/* ==========================================================================
   NextBit theme — clean white + blue
   Skins the existing (legacy table-based) markup. All original class names
   are preserved; only the visual design changes.
   ========================================================================== */

/* ---- IBM Plex Sans Thai (local, SIL Open Font License - fonts/OFL.txt) ---- */
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-thai-400-thai.woff2") format("woff2");
  unicode-range: U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-thai-400-latin.woff2") format("woff2");
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212,
    U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-thai-500-thai.woff2") format("woff2");
  unicode-range: U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 500;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-thai-500-latin.woff2") format("woff2");
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212,
    U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-thai-600-thai.woff2") format("woff2");
  unicode-range: U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 600;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-thai-600-latin.woff2") format("woff2");
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212,
    U+2215, U+FEFF, U+FFFD;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-thai-700-thai.woff2") format("woff2");
  unicode-range: U+0E01-0E5B, U+200C-200D, U+25CC;
}
@font-face {
  font-family: "IBM Plex Sans Thai";
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url("fonts/ibm-plex-sans-thai-700-latin.woff2") format("woff2");
  unicode-range:
    U+0000-00FF, U+0131, U+0152-0153, U+02BB-02BC, U+02C6, U+02DA, U+02DC,
    U+0304, U+0308, U+0329, U+2000-206F, U+20AC, U+2122, U+2191, U+2193, U+2212,
    U+2215, U+FEFF, U+FFFD;
}

/* ------------------------------- Tokens ---------------------------------- */
:root {
  --page: #eef3fb;
  --surface: #ffffff;
  --surface-soft: #f3f7fd;
  --surface-blue: #eaf2ff;
  --border: #dce6f4;
  --border-strong: #c6d6ec;
  --ink: #0a1726;
  --ink-soft: #223349;
  --muted: #46566c;
  --blue: #2563eb;
  --blue-2: #1d4ed8;
  --blue-soft: #e7f0ff;
  --blue-ink: #1e40af;
  --cyan: #0ea5e9;
  --green: #16a34a;
  --red: #dc2626;
  --amber: #b45309;
  --radius: 14px;
  --radius-sm: 9px;
  --shadow:
    0 14px 38px rgba(30, 64, 175, 0.1), 0 2px 8px rgba(30, 64, 175, 0.05);
  --shadow-sm: 0 4px 16px rgba(30, 64, 175, 0.07);
  --focus: 0 0 0 3px rgba(37, 99, 235, 0.18);
}

* {
  box-sizing: border-box;
}

html {
  min-width: 320px;
  background: var(--page);
  -webkit-text-size-adjust: 100%;
}

body {
  min-width: 320px;
  overflow-x: hidden;
  margin: 0;
  padding: 0 0 34px;
  color: var(--ink);
  font-family:
    "IBM Plex Sans Thai", "Noto Sans Thai", "Sarabun", system-ui, Tahoma,
    "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif;
  font-size: 14px;
  font-weight: 500;
  line-height: 1.6;
  background:
    radial-gradient(
      1100px 520px at 50% -240px,
      rgba(37, 99, 235, 0.08),
      transparent 62%
    ),
    var(--page);
  background-attachment: fixed;
  text-rendering: optimizeLegibility;
  -webkit-font-smoothing: antialiased;
}

/* Force one font across the whole site (overrides legacy inline fonts). */
html,
body,
body * {
  font-family:
    "IBM Plex Sans Thai", "Noto Sans Thai", "Sarabun", system-ui, Tahoma,
    "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important;
}

img,
iframe,
embed,
object {
  max-width: 100%;
  height: auto;
}

a {
  color: inherit;
}

/* ------------------------------- Layout ---------------------------------- */
#wrap0 {
  width: 100%;
  display: block;
}

#container {
  width: min(1180px, calc(100% - 40px));
  max-width: 100%;
  margin: 24px auto 0;
  background: transparent;
}

/* Header */
#top {
  position: relative;
  display: flex;
  align-items: center;
  min-height: 104px;
  padding: 16px 24px;
  overflow: hidden;
  border: 1px solid var(--border);
  border-bottom: 3px solid var(--blue);
  border-radius: var(--radius) var(--radius) 0 0;
  background:
    radial-gradient(
      320px 160px at 85% -30%,
      rgba(14, 165, 233, 0.14),
      transparent 70%
    ),
    #ffffff;
  box-shadow: var(--shadow-sm);
}
#top::after {
  content: "";
  position: absolute;
  right: -50px;
  top: -70px;
  width: 240px;
  height: 240px;
  border-radius: 50%;
  background: radial-gradient(circle, rgba(37, 99, 235, 0.1), transparent 70%);
  pointer-events: none;
}
#top img {
  display: block;
  height: 58px;
  width: auto;
}

/* Top navigation (two tiers) */
#menu {
  margin: 0 0 20px;
  padding: 8px 12px;
  border: 1px solid var(--border);
  border-top: 0;
  border-radius: 0 0 var(--radius) var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
#menu ul {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin: 0;
  padding: 0;
  list-style: none;
}
#menu ul + ul {
  margin-top: 4px;
  padding-top: 6px;
  border-top: 1px solid var(--border);
}
#menu li {
  float: none;
  margin: 0;
  padding: 0;
  line-height: normal;
}
#menu a:link,
#menu a:visited,
#menu a:active {
  display: block;
  padding: 8px 14px;
  border: 0;
  border-radius: 999px;
  background: transparent;
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 500;
  text-decoration: none;
  white-space: nowrap;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}
#menu a:hover {
  background: var(--blue-soft);
  color: var(--blue-ink);
}

/* Status strip (welcome / ratio / clock / messages) */
.nbt-status,
table[style*="width:920px"] {
  width: 100% !important;
  max-width: 100%;
  margin: 0 auto 20px !important;
  border: 1px solid var(--border) !important;
  border-radius: 12px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}
.nbt-status td,
table[style*="width:920px"] td {
  padding: 11px 16px;
  border: 0;
  color: var(--ink-soft);
  overflow-wrap: anywhere;
}
.nbt-status .smallfont,
table[style*="width:920px"] .smallfont {
  color: var(--muted);
  white-space: normal;
  overflow-wrap: anywhere;
}
@media (max-width: 700px) {
  .nbt-status,
  .nbt-status > tbody,
  .nbt-status > tbody > tr,
  .nbt-status > tbody > tr > td,
  .nbt-status table,
  .nbt-status table > tbody,
  .nbt-status table > tbody > tr,
  .nbt-status table > tbody > tr > td {
    display: block;
    width: 100% !important;
    max-width: 100% !important;
  }
  .nbt-status td,
  .nbt-status .smallfont,
  .nbt-welcome,
  .nbt-stat-line {
    text-align: center !important;
  }
  .nbt-status .nbt-stat-btn {
    margin: 3px 3px 3px 3px;
  }
  .nbt-status td[align="right"] {
    text-align: center !important;
  }
}

/* Main workspace */
table {
  max-width: 100%;
  border-collapse: collapse;
  background: transparent;
}
table.mainouter {
  width: 100% !important;
  max-width: 1180px;
  margin: 0 auto !important;
  border: 0 !important;
  border-spacing: 0;
  border-collapse: separate;
  background: transparent;
}
table.mainouter > tbody > tr > td {
  vertical-align: top;
  border: 1px solid var(--border);
  background: var(--surface);
}
table.mainouter td[width="155"] {
  width: 220px;
  background: var(--surface-soft);
  border-right: 0;
}
td.outer {
  min-width: 0;
  max-width: 100%;
  padding: 24px clamp(14px, 2.6vw, 34px) 30px;
  border-radius: var(--radius);
  text-align: left;
}

/* Legacy sidebar blocks (kept for safety; not used by the top-nav layout) */
td.block {
  border: 0 !important;
  background: transparent !important;
}
td.block table {
  width: 100%;
  border: 0;
  background: transparent;
}
a.menu {
  display: block;
  padding: 8px 12px;
  border-radius: var(--radius-sm);
  color: var(--ink-soft);
  font-weight: 500;
  text-decoration: none;
  transition:
    background 0.15s ease,
    color 0.15s ease;
}
a.menu:hover {
  background: var(--blue-soft);
  color: var(--blue-ink);
}
a.menu img {
  display: none;
}

/* ------------------------------ Content ---------------------------------- */
td {
  border: 1px solid var(--border);
  padding: 8px 10px;
  font-size: 13px;
}
td.block,
td.bottom,
td.right_menu,
td.embedded,
td.navigation,
td.tablea {
  border: 0;
}
td.text {
  padding: 14px;
  text-align: left;
}
td.comment {
  padding: 14px;
  text-align: left;
}
td.heading {
  font-weight: 600;
  color: var(--ink);
}
td.commenttable {
  background: var(--surface-soft);
}
td.title {
  font-size: 18pt;
  font-weight: 700;
}

td.colhead {
  background: linear-gradient(180deg, #eaf1fe, #e1ebfd);
  color: var(--blue-ink);
  font-weight: 600;
  letter-spacing: 0.2px;
}
td.rowhead {
  background: var(--surface-soft);
  color: var(--muted);
  font-weight: 600;
  text-align: right;
  vertical-align: top;
}
td.pager {
  padding: 4px 8px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface-blue);
}
td.highlight {
  background: #eef4ff;
}

/* Highlight rows only inside real data tables (those with a colhead),
   never on layout tables, the status strip or the footer. */
.mainouter table:has(td.colhead) tr:nth-child(even) > td {
  background-color: rgba(37, 99, 235, 0.025);
}
.mainouter table:has(td.colhead) tr:hover > td {
  background-color: rgba(37, 99, 235, 0.055);
}
.mainouter table tr > td.colhead {
  background: linear-gradient(180deg, #eaf1fe, #e1ebfd);
}

/* Headings */
h1 {
  margin: 0 0 16px;
  color: var(--ink);
  font-size: 22px;
  font-weight: 700;
  letter-spacing: -0.02em;
  text-align: center;
}
h2 {
  height: auto;
  margin: 18px 0 10px;
  padding: 10px 14px;
  border: 0;
  border-left: 4px solid var(--blue);
  border-radius: 0 10px 10px 0;
  background: var(--surface-soft);
  color: var(--ink);
  font-size: 15px;
  font-weight: 600;
  text-align: left;
}
h3 {
  margin: 14px 0 8px;
  color: var(--ink);
  font-size: 14px;
  font-weight: 600;
  text-align: center;
}
p {
  color: var(--ink-soft);
  font-size: 13px;
}
hr {
  height: 0;
  border: 0;
  border-top: 1px solid var(--border);
}

/* Links */
a:link,
a:visited {
  color: var(--blue);
  font-weight: 500;
  text-decoration: none;
}
a:hover {
  color: var(--blue-2);
  text-decoration: underline;
  text-underline-offset: 3px;
}
a.biglink {
  font-size: 15px;
  font-weight: 600;
}
a.online:link,
a.online:visited {
  font-weight: 400;
}
a.subcategory {
  color: var(--muted);
  font-weight: 400;
}
a.subcategory:hover {
  color: var(--blue);
}

/* -------------------------------- Forms ---------------------------------- */
input,
select,
textarea {
  max-width: 100%;
  margin: 3px 0;
  padding: 9px 11px;
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  outline: 0;
  background: #ffffff;
  color: var(--ink);
  font-size: 13px;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}
input::placeholder,
textarea::placeholder {
  color: var(--muted);
}
input:focus,
select:focus,
textarea:focus {
  border-color: var(--blue);
  box-shadow: var(--focus);
}
input[type="checkbox"],
input[type="radio"] {
  accent-color: var(--blue);
}
input[type="submit"],
input[type="button"],
input.btn,
input.button,
button {
  min-height: 38px;
  padding: 9px 18px;
  border: 0;
  border-radius: var(--radius-sm);
  background: linear-gradient(180deg, var(--blue), var(--blue-2));
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
  transition:
    filter 0.15s ease,
    transform 0.05s ease,
    box-shadow 0.15s ease;
}
input[type="submit"]:hover,
input[type="button"]:hover,
input.btn:hover,
input.button:hover,
button:hover {
  filter: brightness(1.07);
  box-shadow: 0 8px 18px rgba(37, 99, 235, 0.22);
}
input[type="submit"]:active,
button:active {
  transform: translateY(1px);
}

/* --------------------------- Alerts & utility ---------------------------- */
.error,
.success {
  margin: 10px 0;
  padding: 11px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
}
.error {
  border-color: #f4cccc;
  background: #fef2f2;
  color: var(--red);
}
.success {
  border-color: #bbf7d0;
  background: #f0fdf4;
  color: #166534;
}
.error b,
.success b {
  color: inherit;
}
.smallfont,
.small {
  color: var(--muted);
  font-size: 12px;
}
.big {
  font-size: 15px;
}
.important {
  font-weight: 600;
}
.red {
  color: var(--red);
}
.yellow {
  color: var(--amber);
}
.green {
  color: var(--green);
}
code,
.code {
  color: var(--blue-ink);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
}

/* Keep legacy inline colours readable on the light theme. */
font[color="black"],
font[color="#000000"],
font[color="#222"] {
  color: var(--ink) !important;
}
font[color="gray"],
font[color="#808080"] {
  color: var(--muted) !important;
}

/* Footer + tooltip */
table.bottom {
  color: var(--muted);
  background: transparent;
}
table.bottom td {
  border: 0;
}
#tooltip {
  z-index: 100;
  border: 1px solid var(--border-strong);
  border-left: 4px solid var(--blue);
  border-radius: 9px;
  background: var(--surface);
  color: var(--ink);
  box-shadow: var(--shadow-sm);
}

/* ------------------------- Login / signup cards -------------------------- */
.nbt-login-form {
  max-width: 400px;
  margin: 8px auto 0;
}
.nbt-login-title {
  text-align: center;
}
.nbt-login {
  text-align: left;
  display: grid;
  gap: 15px;
  margin: 0;
  padding: 26px 24px 22px;
  list-style: none;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow);
}
.nbt-login li {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
}
.nbt-login label {
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 600;
}
.nbt-login input {
  width: 100%;
  padding: 11px 12px;
  font-size: 14px;
}
.nbt-login-submit {
  margin-top: 4px;
}
.nbt-login-submit button {
  width: 100%;
  padding: 12px;
  font-size: 15px;
}
.nbt-login-note {
  margin: 14px 0 0;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}
.nbt-login-alt {
  margin: 6px 0 0;
  text-align: center;
  font-size: 13px;
}
.nbt-login-sep {
  display: inline-block;
  margin: 0 10px;
  color: var(--border-strong);
}
.nbt-login-hint {
  color: var(--muted);
  font-size: 11px;
  line-height: 1.5;
}

.nbt-signup-form {
  max-width: 470px;
}
.nbt-check {
  display: flex;
  align-items: flex-start;
  gap: 9px;
  margin: 0;
  color: var(--ink);
  font-size: 13px;
  font-weight: 500;
  line-height: 1.7;
  cursor: pointer;
}
.nbt-check input[type="checkbox"] {
  flex: 0 0 auto;
  width: auto;
  height: auto;
  margin: 5px 0 0;
  padding: 0;
  border: 0;
  background: none;
}
.nbt-check span {
  flex: 1 1 auto;
  text-align: left;
}
.nbt-signup-terms {
  display: grid;
  gap: 10px;
  border-top: 1px solid var(--border);
  padding-top: 15px;
}

/* Centered notice card (success / info messages) */
.nbt-notice {
  max-width: 640px;
  margin: 6px auto;
  padding: 22px 24px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  text-align: center;
}
.nbt-notice-icon {
  display: block;
  margin-bottom: 10px;
  font-size: 34px;
  line-height: 1;
}
.nbt-notice p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.8;
}
.nbt-notice a {
  font-weight: 600;
  word-break: break-word;
}

/* Success / status message (success.php) */
.nbt-ok {
  max-width: 540px;
  margin: 16px auto;
  padding: 8px 0;
  text-align: center;
}
.nbt-ok-title {
  margin: 0 0 14px;
  color: var(--ink);
  font-size: clamp(20px, 5vw, 24px);
  font-weight: 700;
  line-height: 1.4;
  letter-spacing: -0.01em;
  text-align: center;
}
.nbt-ok-body {
  max-width: 440px;
  margin: 0 auto;
  text-align: center;
}
.nbt-ok-body p {
  margin: 0 0 12px;
  color: var(--ink-soft);
  font-size: 15px;
  line-height: 1.9;
}
.nbt-ok-body p:last-child {
  margin-bottom: 0;
}
.nbt-ok-body a {
  font-weight: 600;
  word-break: break-word;
}
.nbt-ok-note {
  margin-top: 18px !important;
  color: var(--muted) !important;
  font-size: 13.5px !important;
  line-height: 1.8;
}
.nbt-ok-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  justify-content: center;
  margin-top: 26px;
}
.nbt-ok-actions .btn {
  min-width: 150px;
  padding: 12px 22px;
  font-size: 14px;
}
@media (max-width: 520px) {
  .nbt-ok {
    margin: 10px auto;
  }
  .nbt-ok-actions {
    flex-direction: column;
    gap: 10px;
  }
  .nbt-ok-actions .btn {
    width: 100%;
  }
}

/* Casino / games lobby */
.nbt-lobby {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));
  gap: 16px;
  margin: 10px 0 22px;
}
.nbt-game {
  display: flex;
  flex-direction: column;
  gap: 9px;
  padding: 20px 20px 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  color: var(--ink) !important;
  text-decoration: none !important;
  transition:
    transform 0.16s ease,
    box-shadow 0.16s ease,
    border-color 0.16s ease;
}
.nbt-game:hover {
  transform: translateY(-3px);
  border-color: var(--blue);
  box-shadow: var(--shadow);
}
.nbt-game-icon {
  font-size: 34px;
  line-height: 1;
}
.nbt-game-title {
  font-size: 16px;
  font-weight: 600;
  color: var(--ink);
}
.nbt-game-desc {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.65;
}
.nbt-game-cta {
  margin-top: auto;
  align-self: flex-start;
  padding: 8px 15px;
  border-radius: 999px;
  background: linear-gradient(180deg, var(--blue), var(--blue-2));
  color: #fff;
  font-size: 12px;
  font-weight: 600;
}

/* Password strength meter */
.nbt-pw-meter {
  display: flex;
  align-items: center;
  gap: 10px;
  margin-top: 4px;
}
.nbt-pw-track {
  flex: 1 1 auto;
  height: 7px;
  border-radius: 999px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  overflow: hidden;
}
.nbt-pw-fill {
  display: block;
  height: 100%;
  width: 0;
  border-radius: 999px;
  background: #cbd5e1;
  transition:
    width 0.25s ease,
    background 0.25s ease;
}
.nbt-pw-text {
  flex: 0 0 auto;
  min-width: 108px;
  text-align: right;
  color: var(--muted);
  font-size: 11px;
  white-space: nowrap;
}

/* Lucky room */
.nbt-lucky {
  max-width: 460px;
  margin: 6px auto;
  text-align: center;
}
.nbt-balance {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  margin-bottom: 16px;
  padding: 8px 16px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  color: var(--ink-soft);
  font-size: 13px;
}
.nbt-balance strong {
  color: var(--blue-ink);
  font-size: 15px;
}
.nbt-lucky-box {
  padding: 30px 24px 26px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: linear-gradient(160deg, var(--surface) 35%, var(--surface-blue));
  box-shadow: var(--shadow);
}
.nbt-lucky-emoji {
  display: block;
  font-size: 72px;
  line-height: 1;
  margin-bottom: 12px;
}
.nbt-lucky-title {
  font-size: 18px;
  font-weight: 600;
  color: var(--ink);
  margin-bottom: 6px;
}
.nbt-lucky-cost {
  color: var(--muted);
  font-size: 12px;
  margin-bottom: 18px;
}
.nbt-lucky-box button {
  padding: 12px 28px;
  font-size: 15px;
  border-radius: 999px;
}
.nbt-result {
  max-width: 460px;
  margin: 0 auto 16px;
  padding: 14px 18px;
  border-radius: 12px;
  text-align: center;
  font-weight: 600;
}
.nbt-result.lose {
  background: #fef2f2;
  border: 1px solid #f4cccc;
  color: var(--red);
}
.nbt-result.win {
  background: #f0fdf4;
  border: 1px solid #bbf7d0;
  color: #166534;
}
.nbt-result-title {
  font-size: 14px;
}
.nbt-result-amount {
  margin-top: 4px;
  font-size: 22px;
  font-weight: 700;
}

/* Bank / generic panels */
.nbt-balance-row {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  margin: 0 0 18px;
}
.nbt-chip {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  padding: 10px 16px;
  border-radius: 12px;
  border: 1px solid var(--border);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  color: var(--ink-soft);
  font-size: 13px;
}
.nbt-chip strong {
  color: var(--blue-ink);
  font-size: 15px;
}
.nbt-panels {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(260px, 1fr));
  gap: 16px;
  margin-bottom: 18px;
}
.nbt-panel {
  padding: 20px 20px 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-panel h3 {
  margin: 0 0 10px;
  text-align: left;
}
.nbt-panel p {
  margin: 0 0 12px;
}
.nbt-panel-row {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}
.nbt-panel-row input {
  width: 130px;
}
.nbt-bank-note {
  margin-bottom: 18px;
}
.nbt-bank-list {
  margin: 0;
  padding: 0;
  list-style: none;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.8;
}
.nbt-bank-list li {
  position: relative;
  padding-left: 17px;
  margin-bottom: 4px;
}
.nbt-bank-list li::before {
  content: "";
  position: absolute;
  left: 3px;
  top: 0.72em;
  width: 6px;
  height: 6px;
  border-radius: 50%;
  background: var(--blue);
}
.nbt-bank-list strong {
  color: var(--blue-ink);
}

/* Bank dashboard */
.nbt-bank {
  max-width: 780px;
  margin: 0 auto;
}
.nbt-bank-hero {
  display: grid;
  grid-template-columns: 1fr 1fr auto;
  gap: 18px;
  align-items: center;
  padding: 20px 22px;
  margin: 0 0 20px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: linear-gradient(135deg, #ffffff 0%, #eef4ff 100%);
  box-shadow: var(--shadow-sm);
}
.nbt-bank-stat {
  display: flex;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.nbt-bank-stat-label {
  color: var(--muted);
  font-size: 12px;
}
.nbt-bank-stat-value {
  color: var(--ink);
  font-size: 22px;
  font-weight: 700;
  line-height: 1.2;
}
.nbt-bank-stat-value small {
  color: var(--muted);
  font-size: 12px;
  font-weight: 400;
}
.nbt-bank-rate {
  padding: 9px 15px;
  border-radius: 999px;
  background: var(--blue-soft);
  color: var(--blue-ink);
  font-size: 12px;
  white-space: nowrap;
}
.nbt-bank-rate strong {
  color: var(--blue-ink);
}
.nbt-panel-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 9px;
  margin-bottom: 10px;
}
.nbt-panel-head .btn:last-child,
.nbt-panel-head .nbt-card-action:last-child {
  margin-left: auto;
}
.nbt-panel-head h3 {
  margin: 0;
}
.nbt-panel-icon {
  font-size: 18px;
  line-height: 1;
}
.nbt-exchange-row {
  display: flex;
  align-items: center;
  gap: 8px;
}
.nbt-exchange-row input {
  width: 120px;
}
.nbt-unit {
  color: var(--muted);
  font-size: 13px;
}
.nbt-bank-note .nbt-bank-list:last-child {
  margin-bottom: 0;
}
@media (max-width: 620px) {
  .nbt-bank-hero {
    grid-template-columns: 1fr 1fr;
  }
  .nbt-bank-rate {
    grid-column: 1 / -1;
    justify-self: start;
  }
}

/* Pet shop */
.nbt-petshop-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(210px, 1fr));
  gap: 16px;
  margin: 8px 0 20px;
}
.nbt-pet-card {
  position: relative;
  display: flex;
  flex-direction: column;
  gap: 10px;
  padding: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  cursor: pointer;
  text-align: left;
  transition:
    transform 0.15s ease,
    box-shadow 0.15s ease,
    border-color 0.15s ease;
}
.nbt-pet-card:hover {
  transform: translateY(-3px);
  border-color: var(--blue);
  box-shadow: var(--shadow);
}
.nbt-pet-card:has(.nbt-pet-radio:checked) {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--blue-soft);
}
.nbt-pet-radio {
  position: absolute;
  top: 12px;
  right: 12px;
  accent-color: var(--blue);
  z-index: 2;
}
.nbt-pet-thumb {
  display: flex;
  align-items: center;
  justify-content: center;
  height: 116px;
  border-radius: 10px;
  background: var(--surface-soft);
  overflow: hidden;
}
.nbt-pet-thumb img {
  max-height: 104px;
  max-width: 100%;
}
.nbt-pet-info {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.nbt-pet-name {
  font-size: 14px;
  font-weight: 700;
  color: var(--ink);
}
.nbt-pet-stats {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.nbt-pet-stat {
  font-size: 11px;
  color: var(--ink-soft);
  background: var(--surface-soft);
  border-radius: 6px;
  padding: 1px 6px;
}
.nbt-pet-comment {
  font-size: 12px;
  color: var(--muted);
  line-height: 1.6;
  max-height: 76px;
  overflow: hidden;
}
.nbt-pet-card.is-out {
  opacity: 0.6;
}
.nbt-pet-card.is-out .nbt-pet-thumb img {
  filter: grayscale(1);
}
.nbt-pet-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin-top: auto;
  padding-top: 10px;
  border-top: 1px dashed var(--border);
}
.nbt-pet-price {
  color: var(--blue-ink);
  font-weight: 700;
}
.nbt-pet-stock {
  font-size: 11px;
  color: var(--muted);
}
.nbt-pet-stock.out {
  color: var(--red);
  font-weight: 600;
}
.nbt-pet-buy {
  display: flex;
  flex-wrap: wrap;
  gap: 14px;
  align-items: flex-end;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-pet-buy-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.nbt-pet-buy-field label {
  font-size: 12px;
  color: var(--muted);
  font-weight: 600;
}
.nbt-pet-buy button {
  align-self: flex-end;
}

/* My pet page (mypet.php) */
.nbt-pet-user {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.nbt-pet-user-grid {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(280px, 0.95fr);
  gap: 18px;
  align-items: start;
}
.nbt-pet-hero,
.nbt-pet-inventory {
  min-width: 0;
}
.nbt-pet-hero-top {
  display: flex;
  align-items: center;
  gap: 18px;
  padding-bottom: 16px;
  border-bottom: 1px solid var(--border);
}
.nbt-pet-user-image {
  flex: 0 0 auto;
  width: 128px;
  height: 128px;
  object-fit: contain;
  border-radius: 18px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
}
.nbt-pet-hero-info {
  min-width: 0;
}
.nbt-pet-hero-info h2 {
  margin: 8px 0 4px;
  text-align: left;
  font-size: 22px;
  overflow-wrap: anywhere;
}
.nbt-pet-hero-info p {
  margin: 0 0 9px;
  color: var(--muted);
  font-size: 13px;
  line-height: 1.7;
}
.nbt-pet-vitals {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 10px;
  margin: 16px 0;
}
.nbt-pet-vital {
  min-width: 0;
}
.nbt-pet-vital > div {
  display: flex;
  justify-content: space-between;
  gap: 6px;
  margin-bottom: 5px;
  color: var(--ink-soft);
  font-size: 12px;
}
.nbt-pet-vital b {
  color: var(--ink);
}
.nbt-pet-meter {
  display: block;
  height: 8px;
  border-radius: 999px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  overflow: hidden;
}
.nbt-pet-meter i {
  display: block;
  height: 100%;
  border-radius: inherit;
}
.nbt-pet-meter i.hp { background: linear-gradient(90deg, #fb7185, #dc2626); }
.nbt-pet-meter i.food { background: linear-gradient(90deg, #fbbf24, #f97316); }
.nbt-pet-meter i.clean { background: linear-gradient(90deg, #38bdf8, #2563eb); }
.nbt-pet-stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 16px;
}
.nbt-pet-stats > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
  padding: 9px 10px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
}
.nbt-pet-stats span {
  color: var(--muted);
  font-size: 11px;
}
.nbt-pet-stats b {
  font-size: 15px;
}
.nbt-pet-care-actions {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 8px;
  margin-bottom: 12px;
}
.nbt-pet-care {
  display: flex;
  flex-direction: column;
  align-items: center;
  gap: 3px;
  padding: 10px 6px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface);
  color: var(--ink-soft) !important;
  text-decoration: none !important;
  text-align: center;
}
.nbt-pet-care:hover {
  border-color: var(--blue);
  background: var(--blue-soft);
}
.nbt-pet-care > span { font-size: 19px; }
.nbt-pet-care b { font-size: 12px; }
.nbt-pet-care small { color: var(--muted); font-size: 10px; }
.nbt-pet-training {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}
.nbt-pet-training form { margin: 0; }
.nbt-pet-training-note {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 11px;
  line-height: 1.6;
}
.nbt-pet-item-list {
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.nbt-pet-item {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 10px;
  border: 1px solid var(--border);
  border-radius: 11px;
  background: var(--surface);
}
.nbt-pet-item-image {
  flex: 0 0 46px;
  display: grid;
  place-items: center;
  width: 46px;
  height: 46px;
  border-radius: 9px;
  background: var(--surface-soft);
  color: var(--blue);
  font-size: 22px;
}
.nbt-pet-item-image img {
  max-width: 40px;
  max-height: 40px;
  object-fit: contain;
}
.nbt-pet-item-info {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
  font-size: 12px;
}
.nbt-pet-item-info > b { overflow-wrap: anywhere; }
.nbt-pet-item-effects { color: var(--muted); font-size: 10px; }
.nbt-pet-item-info .nbt-chip { align-self: flex-start; font-size: 10px; padding: 1px 7px; }
.nbt-pet-item-actions {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  align-items: stretch;
  gap: 5px;
}
.nbt-pet-item-actions form { margin: 0; }
.nbt-pet-item-actions button,
.nbt-pet-item-actions .nbt-pet-sell {
  min-height: 30px;
  padding: 5px 9px;
  font-size: 11px;
  text-align: center;
}
.nbt-pet-sell { color: var(--blue-ink) !important; font-weight: 600; }
.nbt-pet-cap-note { color: var(--muted); font-size: 10px; }
.nbt-pet-shop-links {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed var(--border);
}
@media (max-width: 900px) {
  .nbt-pet-user-grid { grid-template-columns: minmax(0, 1fr); }
}
@media (max-width: 560px) {
  .nbt-pet-hero-top { align-items: flex-start; gap: 12px; }
  .nbt-pet-user-image { width: 92px; height: 92px; }
  .nbt-pet-hero-info h2 { font-size: 18px; }
  .nbt-pet-vitals { grid-template-columns: minmax(0, 1fr); }
  .nbt-pet-stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nbt-pet-care-actions { grid-template-columns: repeat(3, minmax(0, 1fr)); }
  .nbt-pet-training { flex-direction: column; }
  .nbt-pet-training form,
  .nbt-pet-training button { width: 100%; }
  .nbt-pet-item { flex-wrap: wrap; }
  .nbt-pet-item-actions { width: 100%; flex-direction: row; }
  .nbt-pet-item-actions form,
  .nbt-pet-item-actions button,
  .nbt-pet-item-actions .nbt-pet-sell { flex: 1 1 0; }
}
@media (max-width: 560px) {
  .nbt-petshop-grid {
    grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
    gap: 12px;
  }
  .nbt-pet-buy {
    flex-direction: column;
    align-items: stretch;
  }
  .nbt-pet-buy button {
    width: 100%;
  }
}

/* Home page */
.nbt-home {
  display: flex;
  flex-direction: column;
  gap: 18px;
  text-align: left;
}
.nbt-home-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 320px;
  gap: 18px;
  align-items: start;
}
.nbt-home-main {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}
.nbt-home-side {
  display: flex;
  flex-direction: column;
  gap: 18px;
  min-width: 0;
}
@media (max-width: 880px) {
  .nbt-home-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
.nbt-card {
  padding: 20px 22px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-card-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 15px;
}
.nbt-card-head h2 {
  margin: 0;
  padding: 5px 13px;
  border-left: 4px solid var(--blue);
  border-radius: 0 8px 8px 0;
  background: var(--surface-soft);
  font-size: 16px;
  text-align: left;
}
.nbt-card-action {
  color: var(--muted);
  font-size: 12px;
  font-weight: 500;
  white-space: nowrap;
}
.nbt-news {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.nbt-news li {
  display: flex;
  gap: 16px;
  padding-bottom: 14px;
  border-bottom: 1px solid var(--border);
}
.nbt-news li:last-child {
  padding-bottom: 0;
  border-bottom: 0;
}
.nbt-news-date {
  flex: 0 0 88px;
  color: var(--muted);
  font-size: 11px;
  padding-top: 3px;
}
.nbt-news-body {
  flex: 1 1 auto;
  min-width: 0;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.75;
}
.nbt-news-edit {
  font-size: 11px;
  white-space: nowrap;
}
.nbt-forum-info {
  display: flex;
  flex-direction: column;
  gap: 8px;
  color: var(--ink-soft);
  font-size: 13px;
}
.nbt-forum-info p {
  margin: 0;
}
.nbt-activeusers {
  margin-top: 12px;
  padding-top: 12px;
  border-top: 1px solid var(--border);
  color: var(--muted);
  font-size: 12px;
  line-height: 2;
}
.nbt-stats {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 12px;
}
@media (max-width: 900px) {
  .nbt-stats {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }
}
@media (max-width: 480px) {
  .nbt-stats {
    grid-template-columns: minmax(0, 1fr);
  }
}
.nbt-stat-card {
  display: flex;
  align-items: center;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface-soft);
}
.nbt-stat-icon {
  flex: 0 0 auto;
  display: grid;
  place-items: center;
  width: 42px;
  height: 42px;
  border-radius: 11px;
  background: linear-gradient(160deg, var(--blue-soft), #ffffff);
  font-size: 22px;
  line-height: 1;
  color: var(--blue);
}
.nbt-stat-icon i {
  font-size: 19px;
}
.nbt-stat-body {
  display: flex;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.nbt-stat-label {
  color: var(--muted);
  font-size: 12px;
}
.nbt-stat-value {
  color: var(--blue-ink);
  font-size: 21px;
  font-weight: 700;
  line-height: 1.15;
}
.nbt-poll-q {
  margin: 0 0 14px;
  color: var(--ink);
  font-size: 15px;
  font-weight: 600;
  text-align: center;
}
.nbt-poll-results {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.nbt-poll-row {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 5px;
  color: var(--ink-soft);
  font-size: 13px;
}
.nbt-bar {
  height: 12px;
  border-radius: 999px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  overflow: hidden;
}
.nbt-bar span {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--cyan), var(--blue));
}
.nbt-poll-total {
  margin: 14px 0 0;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}
.nbt-poll-options {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-direction: column;
  gap: 9px;
}
.nbt-poll-options label {
  display: flex;
  align-items: center;
  gap: 9px;
  color: var(--ink-soft);
  font-size: 13px;
  cursor: pointer;
}
.nbt-poll-submit {
  margin: 16px 0 0;
  text-align: center;
}

/* Online statistics */
.nbt-online-stats {
  margin-top: 2px;
}
.nbt-online-dot {
  display: inline-block;
  width: 10px;
  height: 10px;
  margin-right: 9px;
  border-radius: 50%;
  background: var(--green);
  box-shadow: 0 0 0 4px color-mix(in srgb, var(--green) 22%, transparent);
  vertical-align: middle;
}
.nbt-online-toggle {
  padding: 4px 8px;
  border: 0;
  border-radius: 8px;
  background: none;
  color: var(--blue);
  font: inherit;
  font-size: 12px;
  font-weight: 600;
  cursor: pointer;
}
.nbt-online-toggle:hover {
  background: var(--blue-soft);
}
.nbt-online-list {
  margin-top: 16px;
  padding-top: 14px;
  border-top: 1px solid var(--border);
}
.nbt-online-summary {
  margin: 0 0 8px;
  color: var(--ink-soft);
  font-size: 13px;
}
.nbt-stat-sub {
  color: var(--muted);
  font-size: 11px;
}
.nbt-accent-green .nbt-stat-icon {
  color: #16a34a;
  background: linear-gradient(160deg, #d3f3df, #ffffff);
}
.nbt-accent-blue .nbt-stat-icon {
  color: #2563eb;
  background: linear-gradient(160deg, #d8e6ff, #ffffff);
}
.nbt-accent-gray .nbt-stat-icon {
  color: #64748b;
  background: linear-gradient(160deg, #e2e7ee, #ffffff);
}
.nbt-accent-brown .nbt-stat-icon {
  color: #b45309;
  background: linear-gradient(160deg, #f5e2cf, #ffffff);
}

/* Upload page */
.nbt-upload {
  max-width: 880px;
  margin: 0 auto;
  text-align: left;
}
.nbt-upload .nbt-panel {
  margin-bottom: 18px;
}
.nbt-upload form {
  display: block;
}
.nbt-passkey {
  padding: 18px 20px;
  margin-bottom: 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: linear-gradient(160deg, var(--surface), var(--surface-blue));
  box-shadow: var(--shadow-sm);
}
.nbt-passkey .nbt-panel-head {
  margin-bottom: 12px;
}
.nbt-passkey-label {
  margin-bottom: 8px;
  color: var(--muted);
  font-size: 12px;
  font-weight: 600;
}
.nbt-passkey-row {
  display: flex;
  gap: 10px;
  align-items: center;
}
.nbt-passkey-row input {
  flex: 1 1 auto;
  font-size: 12px;
}
.nbt-copy {
  flex: 0 0 auto;
}
.nbt-passkey-hint {
  margin: 8px 0 0;
  color: var(--muted);
  font-size: 11px;
}
.nbt-upload-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(280px, 1fr));
  gap: 16px;
}
.nbt-field {
  display: flex;
  flex-direction: column;
  gap: 7px;
}
.nbt-field > label {
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 600;
}
.nbt-field input[type="text"],
.nbt-field input[type="file"],
.nbt-field select {
  width: 100%;
}
.nbt-field-full {
  grid-column: 1 / -1;
}
.nbt-upload-submit {
  margin-top: 20px;
  text-align: center;
}
.nbt-upload-submit button {
  padding: 12px 28px;
  font-size: 15px;
}
@media (max-width: 560px) {
  .nbt-passkey-row {
    flex-wrap: wrap;
  }
  .nbt-copy {
    width: 100%;
  }
}

/* Font Awesome (keep its icon font from being overridden by the global font rule) */
.fa,
.fas,
.far,
.fa-solid,
.fa-regular {
  font-family: "Font Awesome 6 Free" !important;
}
.fab,
.fa-brands {
  font-family: "Font Awesome 6 Brands" !important;
}

/* Forum table */
.nbt-forumtable {
  width: 100%;
  border-collapse: collapse;
}
.nbt-forumtable th {
  padding: 9px 12px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
  text-align: left;
  white-space: nowrap;
}
.nbt-forumtable td {
  padding: 10px 12px;
  border-bottom: 1px solid var(--border);
  color: var(--ink);
  font-size: 13px;
  vertical-align: top;
}
.nbt-forumtable tr:last-child td {
  border-bottom: 0;
}
.nbt-forumtable tbody tr:hover td {
  background: var(--surface-soft);
}
.nbt-forum-num {
  color: var(--muted);
  text-align: right;
  white-space: nowrap;
}
.nbt-forum-last {
  color: var(--muted);
  white-space: nowrap;
  font-size: 12px;
}
.nbt-forum-by {
  color: var(--ink-soft);
}

/* Latest threads list */
.nbt-topics {
  display: flex;
  flex-direction: column;
}
.nbt-topic {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 14px 4px;
  border-bottom: 1px solid var(--border);
}
.nbt-topic:last-child {
  border-bottom: 0;
}
.nbt-topic-main {
  min-width: 0;
}
.nbt-topic-title {
  display: block;
  color: var(--ink) !important;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none !important;
}
.nbt-topic-title:hover {
  color: var(--blue) !important;
}
.nbt-topic-sub {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
}
.nbt-topic-meta {
  flex: 0 0 auto;
  text-align: right;
}
.nbt-topic-replies {
  color: var(--blue-ink);
  font-size: 13px;
  font-weight: 600;
}
.nbt-topic-last {
  margin-top: 3px;
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}
.nbt-card-head h2 i {
  margin-right: 8px;
  color: var(--blue);
}
@media (max-width: 560px) {
  .nbt-topic {
    flex-direction: column;
    align-items: flex-start;
    gap: 8px;
  }
  .nbt-topic-meta {
    text-align: left;
  }
}

/* Statistic accent colours */
.nbt-accent-amber .nbt-stat-icon {
  color: #d97706;
  background: linear-gradient(160deg, #fbe8c9, #ffffff);
}
.nbt-accent-red .nbt-stat-icon {
  color: #dc2626;
  background: linear-gradient(160deg, #fbdada, #ffffff);
}
.nbt-accent-purple .nbt-stat-icon {
  color: #7c3aed;
  background: linear-gradient(160deg, #e9defb, #ffffff);
}
.nbt-accent-cyan .nbt-stat-icon {
  color: #0891b2;
  background: linear-gradient(160deg, #d3eef6, #ffffff);
}
.nbt-accent-orange .nbt-stat-icon {
  color: #ea580c;
  background: linear-gradient(160deg, #fde3d3, #ffffff);
}

/* Browse page */
.nbt-browse {
  display: flex;
  flex-direction: column;
  gap: 16px;
  margin-bottom: 18px;
}
.nbt-browse-search {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  padding: 16px 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-search-input {
  flex: 1 1 220px;
  min-width: 0;
}
.nbt-search-cat {
  flex: 0 1 auto;
  max-width: 100%;
}
.nbt-search-dead {
  flex: 0 0 auto;
  white-space: nowrap;
}
.nbt-browse-search button {
  flex: 0 0 auto;
}
.nbt-browse-filter {
  padding: 16px 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-filter-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  margin-bottom: 12px;
}
.nbt-filter-title {
  color: var(--ink);
  font-size: 15px;
  font-weight: 600;
}
.nbt-filter-title i {
  margin-right: 7px;
  color: var(--blue);
}
.nbt-cat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 8px;
}
.nbt-cat-chip {
  display: flex;
  align-items: center;
  gap: 8px;
  padding: 7px 11px;
  border: 1px solid var(--border);
  border-radius: 9px;
  background: var(--surface-raised);
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 500;
  cursor: pointer;
  transition:
    border-color 0.14s ease,
    background 0.14s ease,
    color 0.14s ease;
}
.nbt-cat-chip:hover {
  border-color: var(--blue);
  color: var(--blue);
}
.nbt-cat-chip input {
  flex: 0 0 auto;
  accent-color: var(--blue);
}
.nbt-cat-name {
  min-width: 0;
  color: var(--ink-soft) !important;
  font-weight: 500;
  text-decoration: none !important;
  overflow-wrap: anywhere;
}
.nbt-cat-name:hover {
  color: var(--blue) !important;
  text-decoration: underline !important;
}
.nbt-cat-chip:has(input:checked) {
  border-color: var(--blue);
  background: var(--blue-soft);
  color: var(--blue-ink);
}
.nbt-filter-foot {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  margin-top: 14px;
}
@media (max-width: 560px) {
  .nbt-search-input,
  .nbt-search-cat,
  .nbt-search-dead,
  .nbt-browse-search button {
    flex: 1 1 100%;
  }
  .nbt-cat-grid {
    grid-template-columns: repeat(auto-fill, minmax(130px, 1fr));
  }
}

/* Requests system */
.nbt-request-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 14px;
}
.nbt-btn-ghost {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  padding: 8px 14px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface);
  color: var(--ink-soft) !important;
  font-size: 13px;
  font-weight: 500;
  text-decoration: none !important;
  transition:
    border-color 0.15s ease,
    color 0.15s ease,
    background 0.15s ease;
}
.nbt-btn-ghost:hover,
.nbt-btn-ghost.is-active {
  border-color: var(--blue);
  background: var(--blue-soft);
  color: var(--blue-ink) !important;
}
.nbt-btn-ghost i {
  color: var(--blue);
}
.nbt-sortlinks {
  margin-bottom: 14px;
  color: var(--muted);
  font-size: 13px;
}
.nbt-sortlinks a {
  margin-left: 10px;
}
.nbt-reqtable td {
  vertical-align: middle;
}
.nbt-req-delete {
  margin: 12px 0;
  text-align: center;
}
.nbt-btn-danger {
  background: linear-gradient(180deg, #ef4444, #dc2626) !important;
}
.nbt-request-detail {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 760px;
  margin: 0 auto;
}
.nbt-request-title {
  margin: 0 0 10px;
  color: var(--ink);
  font-size: 18px;
  font-weight: 700;
  text-align: left;
}
.nbt-request-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 20px;
  margin-bottom: 12px;
  color: var(--muted);
  font-size: 13px;
}
.nbt-request-descr {
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.7;
}
.nbt-request-filled {
  margin: 12px 0 0;
  color: var(--ink-soft);
  font-size: 13px;
}
.nbt-request-vote {
  text-align: center;
}
.nbt-vote-card {
  max-width: 520px;
  margin: 0 auto;
  text-align: center;
}
.nbt-vote-count {
  color: var(--ink-soft);
  font-size: 14px;
}
.nbt-vote-count b {
  color: var(--blue-ink);
  font-size: 20px;
}

/* BBCode editor */
.nbt-editor {
  border: 1px solid var(--border-strong);
  border-radius: var(--radius-sm);
  background: var(--surface-raised);
  overflow: hidden;
}
.nbt-editor-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 6px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-soft);
}
.nbt-editor-toolbar button {
  min-height: 32px;
  padding: 5px 11px;
  border: 1px solid var(--border);
  border-radius: 7px;
  background: var(--surface);
  color: var(--ink-soft);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.nbt-editor-toolbar button:hover {
  border-color: var(--blue);
  background: var(--blue-soft);
  color: var(--blue);
}
.nbt-editor-preview-btn {
  margin-left: auto;
}
.nbt-editor-text {
  width: 100%;
  min-height: 190px;
  margin: 0 !important;
  padding: 12px 14px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  resize: vertical;
}
.nbt-editor-preview {
  text-align: left;
  padding: 14px;
  border-top: 1px solid var(--border);
  background: var(--surface);
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.8;
  overflow-wrap: anywhere;
}
.nbt-editor-preview img {
  max-width: 100%;
}

/* Requests table: fit and stack on small screens */
.nbt-reqtable {
  width: 100%;
  table-layout: auto;
}
.nbt-reqtable td,
.nbt-reqtable th {
  overflow-wrap: anywhere;
  word-break: break-word;
}
.nbt-reqtable .nbt-forum-last {
  white-space: normal;
}
@media (max-width: 760px) {
  .nbt-reqtable thead {
    display: none;
  }
  .nbt-reqtable,
  .nbt-reqtable tbody,
  .nbt-reqtable tr,
  .nbt-reqtable td {
    display: block;
    width: 100%;
  }
  .nbt-reqtable tr {
    margin-bottom: 12px;
    padding: 12px 14px;
    border: 1px solid var(--border);
    border-radius: 12px;
    background: var(--surface);
  }
  .nbt-reqtable td {
    padding: 5px 0;
    border: 0;
    text-align: left;
  }
  .nbt-reqtable td::before {
    content: attr(data-label);
    display: inline-block;
    min-width: 86px;
    color: var(--muted);
    font-size: 11px;
    font-weight: 600;
  }
  .nbt-reqtable td.nbt-forum-num {
    text-align: left;
  }
  .nbt-reqtable .nbt-forum-subject {
    font-size: 15px;
    margin-bottom: 4px;
  }
}

/* Inbox / messages */
.nbt-inbox {
  max-width: 900px;
  margin: 0 auto;
  text-align: left;
}
.nbt-msgs {
  display: flex;
  flex-direction: column;
  gap: 14px;
}
.nbt-msg {
  padding: 16px 18px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-msg.is-new {
  border-color: #bfdbfe;
  background: linear-gradient(160deg, #f4f9ff, #ffffff);
}
.nbt-msg-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px 14px;
  margin-bottom: 10px;
  color: var(--muted);
  font-size: 13px;
}
.nbt-msg-from {
  color: var(--ink-soft);
}
.nbt-msg-date {
  font-size: 12px;
}
.nbt-msg-new {
  padding: 2px 9px;
  border-radius: 999px;
  background: var(--red);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
}
.nbt-msg-body {
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.75;
  overflow-wrap: anywhere;
}
.nbt-msg-body img {
  max-width: 100%;
}
.nbt-msg-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 14px;
  margin-top: 12px;
  font-size: 13px;
}
.nbt-msg-check {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  margin-left: auto;
  color: var(--muted);
  font-size: 12px;
  cursor: pointer;
}

.nbt-vote-rule {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 7px;
  margin: 12px 0 0;
  color: var(--muted);
  font-size: 12px;
}
.nbt-vote-rule i {
  color: var(--blue);
}

/* Ticket center */
.nbt-tickets {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 720px;
  margin: 0 auto;
  text-align: left;
}
.nbt-ticket-hero {
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 18px;
  padding: 20px 22px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: linear-gradient(135deg, #ffffff, #eef4ff);
  box-shadow: var(--shadow);
}
.nbt-ticket-emoji {
  font-size: 44px;
  line-height: 1;
}
.nbt-ticket-hero-main {
  flex: 1 1 auto;
  min-width: 0;
}
.nbt-ticket-prize {
  color: var(--ink);
  font-size: 20px;
  font-weight: 700;
}
.nbt-ticket-prize b {
  color: var(--blue-ink);
}
.nbt-ticket-sub {
  margin-top: 2px;
  color: var(--muted);
  font-size: 13px;
}
.nbt-ticket-countdown {
  flex: 0 0 auto;
  padding: 10px 16px;
  border-radius: 12px;
  background: var(--blue-soft);
  color: var(--blue-ink);
  font-size: 12px;
  text-align: center;
}
.nbt-ticket-countdown b {
  display: block;
  font-size: 18px;
  font-variant-numeric: tabular-nums;
}
.nbt-ticket-buy-form {
  text-align: center;
}
.nbt-ticket-buy {
  padding: 14px 32px;
  border-radius: 999px;
  font-size: 16px;
}
@media (max-width: 560px) {
  .nbt-ticket-emoji {
    font-size: 36px;
  }
  .nbt-ticket-countdown {
    width: 100%;
  }
  .nbt-ticket-buy {
    width: 100%;
  }
}

/* Take Bet (casa) */
.nbt-casa {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 900px;
  margin: 0 auto;
  text-align: left;
}
.nbt-casa-bet {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
}
.nbt-casa-bet input {
  flex: 1 1 180px;
}
.nbt-casa-bet button {
  flex: 0 0 auto;
}
@media (max-width: 560px) {
  .nbt-casa-bet input,
  .nbt-casa-bet button {
    flex: 1 1 100%;
  }
}

/* Forums (frames + posts) */
.nbt-frame {
  width: 100%;
  margin-bottom: 14px;
  border: 1px solid var(--border) !important;
  border-radius: var(--radius);
  border-collapse: separate;
  overflow: hidden;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-frame > tbody > tr > td.nbt-frame-body {
  padding: 14px;
  border: 0 !important;
}
.nbt-frame-title {
  margin-top: 0;
}
.nbt-frame-table {
  width: 100%;
  border-collapse: collapse;
  background: transparent;
}
.nbt-frame-table > tbody > tr > td {
  border-color: var(--border);
}
/* จัดคอลัมน์ตารางอันดับให้ตรงกัน (หัวตารางกับข้อมูลใช้ padding/แนวเดียว) */
.nbt-frame-table tr > td {
  padding: 8px 10px;
  vertical-align: middle;
  white-space: nowrap;
}
.nbt-frame-table tr > td.colhead {
  padding: 8px 10px;
  white-space: nowrap;
}
.mainouter .sub {
  margin: 0 0 6px;
  color: var(--muted);
  font-size: 12px;
}
.mainouter .sub a {
  font-weight: 600;
}
.mainouter td.comment {
  padding: 14px !important;
  line-height: 1.75;
}
.mainouter .sig {
  margin-top: 12px;
  padding-top: 10px;
  border-top: 1px dashed var(--border);
  color: var(--muted);
  font-size: 12px;
}
.mainouter .sig img {
  max-width: 100%;
}
@media (max-width: 700px) {
  .mainouter table.nbt-frame-table > tbody > tr > td[width="150"] {
    display: block;
    width: 100% !important;
    text-align: left !important;
  }
  .mainouter td.comment {
    display: block;
    width: 100% !important;
  }
}

/* Forum index */
.nbt-forums {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.nbt-forum-row {
  display: flex;
  align-items: center;
  gap: 16px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}
.nbt-forum-row:hover {
  border-color: var(--blue);
  box-shadow: var(--shadow);
}
.nbt-forum-main {
  flex: 1 1 auto;
  min-width: 0;
}
.nbt-forum-name {
  color: var(--ink) !important;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none !important;
}
.nbt-forum-name:hover {
  color: var(--blue) !important;
}
.nbt-forum-desc {
  margin-top: 2px;
  color: var(--muted);
  font-size: 12px;
  overflow-wrap: anywhere;
}
.nbt-forum-stats {
  display: flex;
  flex: 0 0 auto;
  gap: 8px;
}
.nbt-forum-lastpost {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 12px;
  text-align: right;
}
.nbt-forum-dot {
  margin-right: 6px;
  vertical-align: middle;
}
.nbt-forum-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
  margin-top: 16px;
}
.nbt-forum-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
  margin-top: 14px;
  color: var(--muted);
  font-size: 12px;
}
.nbt-forum-legend span {
  display: inline-flex;
  align-items: center;
  gap: 6px;
}
.nbt-forum-empty {
  color: var(--muted);
  text-align: left;
}

/* Topic cards (viewforum) */
.nbt-topiccards {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.nbt-topiccard {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 13px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  text-align: left;
  transition:
    border-color 0.15s ease,
    box-shadow 0.15s ease;
}
.nbt-topiccard:hover {
  border-color: var(--blue);
  box-shadow: var(--shadow);
}
.nbt-topiccard-dot {
  flex: 0 0 auto;
  width: 19px;
  height: 19px;
  vertical-align: middle;
}
.nbt-topiccard-main {
  flex: 1 1 auto;
  min-width: 0;
}
.nbt-topiccard-title {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 6px;
  font-size: 15px;
  line-height: 1.5;
}
.nbt-topiccard-subject {
  color: var(--ink) !important;
  font-weight: 600;
  text-decoration: none !important;
}
.nbt-topiccard-subject:hover {
  color: var(--blue) !important;
}
.nbt-topiccard-meta {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  margin-top: 6px;
  font-size: 12px;
  color: var(--muted);
}
.nbt-topiccard-author {
  overflow-wrap: anywhere;
}
.nbt-topiccard-last {
  flex: 0 0 auto;
  color: var(--muted);
  font-size: 12px;
  text-align: right;
  white-space: nowrap;
}
.nbt-badge {
  display: inline-block;
  padding: 1px 8px;
  border-radius: 999px;
  font-size: 11px;
  font-weight: 600;
}
.nbt-badge-sticky {
  background: #fff2cc;
  color: var(--amber);
}
.nbt-badge-lock {
  background: #f1f3f7;
  color: var(--muted);
}

/* Pagination */
.nbt-pager {
  margin: 16px 0;
  text-align: center;
  font-size: 13px;
  line-height: 2;
  overflow-wrap: anywhere;
}
.nbt-muted {
  color: var(--muted);
}
@media (max-width: 640px) {
  .nbt-topiccard {
    flex-wrap: wrap;
  }
  .nbt-topiccard-last {
    width: 100%;
    text-align: left;
    padding-top: 8px;
    border-top: 1px dashed var(--border);
  }
}
.nbt-topiclist td.nbt-forum-subject {
  font-weight: 600;
}

/* Forum posts */
.nbt-post {
  margin-bottom: 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}
.nbt-post-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: flex-start;
  gap: 6px 10px;
  padding: 10px 14px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 12px;
}
.nbt-post-info {
  position: relative;
  display: inline-flex;
  align-items: center;
  flex-wrap: wrap;
  gap: 6px;
  flex: 1 1 auto;
  min-width: 0;
}
.nbt-post-author {
  min-width: 0;
  overflow-wrap: anywhere;
}
.nbt-post-author a {
  font-weight: 600;
}
.nbt-post-info .nbt-post-info-trigger,
button.nbt-post-info-trigger {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 5px;
  width: auto !important;
  min-width: 0 !important;
  height: 26px !important;
  min-height: 26px !important;
  padding: 0 13px !important;
  border: 1px solid var(--border) !important;
  border-radius: 999px !important;
  background: var(--surface) !important;
  color: var(--muted) !important;
  font-size: 12px !important;
  line-height: 1;
  box-shadow: none;
  cursor: help;
  transition:
    background 0.15s ease,
    color 0.15s ease,
    border-color 0.15s ease;
}
.nbt-post-info:hover .nbt-post-info-trigger,
.nbt-post-info:focus-within .nbt-post-info-trigger,
.nbt-post-info-trigger:focus,
button.nbt-post-info-trigger:hover {
  background: var(--blue-soft) !important;
  color: var(--blue-ink) !important;
  border-color: var(--blue) !important;
}
.nbt-post-by {
  position: absolute;
  left: calc(100% + 10px);
  top: 50%;
  z-index: 40;
  width: max-content;
  max-width: min(320px, 72vw);
  padding: 9px 13px;
  border-radius: 10px;
  background: #0f172a;
  color: #fff;
  font-size: 12px;
  font-weight: 400;
  line-height: 1.6;
  text-align: left;
  overflow-wrap: anywhere;
  white-space: nowrap;
  box-shadow: 0 12px 30px rgba(15, 23, 42, 0.28);
  opacity: 0;
  visibility: hidden;
  transform: translate(-6px, -50%);
  transition:
    opacity 0.15s ease,
    transform 0.15s ease,
    visibility 0.15s ease;
  pointer-events: none;
}
.nbt-post-by::after {
  content: "";
  position: absolute;
  left: -5px;
  top: 50%;
  width: 10px;
  height: 10px;
  background: #0f172a;
  transform: translateY(-50%) rotate(45deg);
}
.nbt-post-info-trigger:hover .nbt-post-by,
.nbt-post-info-trigger:focus .nbt-post-by,
.nbt-post-info:focus-within .nbt-post-by {
  opacity: 1;
  visibility: visible;
  transform: translate(0, -50%);
}
.nbt-post-by a {
  font-weight: 600;
}
@media (max-width: 640px) {
  .nbt-post-by {
    left: 0;
    top: calc(100% + 10px);
    white-space: normal;
    transform: translate(0, -6px);
  }
  .nbt-post-by::after {
    left: 16px;
    top: -5px;
    transform: translateY(0) rotate(45deg);
  }
  .nbt-post-info-trigger:hover .nbt-post-by,
  .nbt-post-info-trigger:focus .nbt-post-by,
  .nbt-post-info:focus-within .nbt-post-by {
    transform: translate(0, 0);
  }
}
.nbt-post-actions {
  display: flex;
  flex: 0 0 auto;
  gap: 12px;
  margin-left: auto;
}
.nbt-post-actions a {
  font-size: 12px;
}
.nbt-post-body {
  display: flex;
  gap: 16px;
  padding: 14px;
}
.nbt-post-side {
  flex: 0 0 160px;
  min-width: 0;
  text-align: center;
  padding-right: 14px;
  border-right: 1px solid var(--border);
}
.nbt-post-side-avatar {
  display: block;
  margin-bottom: 10px;
}
.nbt-post-side-avatar img {
  width: 100%;
  max-width: 140px;
  border-radius: 10px;
}
.nbt-post-side-name {
  font-size: 13px;
  font-weight: 600;
  overflow-wrap: anywhere;
}
.nbt-post-side-title {
  margin: 3px 0 10px;
  color: var(--muted);
  font-size: 11px;
  overflow-wrap: anywhere;
}
.nbt-post-side-pet {
  margin: -4px 0 10px;
}
.nbt-post-side-stats {
  margin: 0;
  padding: 10px;
  list-style: none;
  text-align: left;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
  font-size: 12px;
  line-height: 1.7;
}
.nbt-post-side-stats li {
  overflow-wrap: anywhere;
}
.nbt-post-side-stats .nbt-up {
  color: var(--green);
}
.nbt-post-side-stats .nbt-down {
  color: var(--red);
}
.nbt-post-side-stats .nbt-ratio {
  color: var(--blue);
}
.nbt-post-side-posted {
  margin-top: 6px;
  padding-top: 6px;
  border-top: 1px dashed var(--border);
  color: var(--muted);
}
.nbt-post-content {
  flex: 1 1 auto;
  min-width: 0;
  overflow-wrap: anywhere;
  line-height: 1.75;
}
.nbt-post-content img {
  max-width: 100%;
  height: auto;
}
.nbt-post-content pre,
.nbt-post-content code {
  max-width: 100%;
  white-space: pre-wrap;
  overflow-wrap: anywhere;
}
.nbt-post-content table {
  max-width: 100%;
  display: block;
  overflow-x: auto;
}
.nbt-pet {
  display: inline-block;
  padding: 0 8px;
  border-radius: 999px;
  background: var(--surface-blue);
  color: var(--blue-ink);
  font-size: 12px;
  white-space: nowrap;
}
.nbt-post-edited {
  color: var(--muted);
  font-size: 11px;
}
@media (max-width: 700px) {
  .nbt-post-body {
    flex-direction: column;
    gap: 10px;
  }
  .nbt-post-side {
    flex: 0 0 auto;
    display: flex;
    flex-direction: column;
    align-items: center;
    gap: 8px;
    padding-right: 0;
    padding-bottom: 12px;
    border-right: 0;
    border-bottom: 1px solid var(--border);
    text-align: center;
    width: 100%;
  }
  .nbt-post-side-avatar {
    flex: 0 0 auto;
    margin-bottom: 0;
  }
  .nbt-post-side-avatar img {
    width: 84px;
  }
  .nbt-post-side-name,
  .nbt-post-side-title,
  .nbt-post-side-pet {
    text-align: center;
  }
  .nbt-post-side-stats {
    flex: 0 0 auto;
    width: 100%;
    max-width: 340px;
    text-align: left;
  }
  .nbt-post-head {
    flex-wrap: wrap;
  }
  .nbt-forum-row {
    flex-wrap: wrap;
  }
  .nbt-forum-lastpost {
    width: 100%;
    text-align: left;
  }
}

/* Shoutbox */
.nbt-shout {
  max-width: 860px;
  margin: 0 auto;
  text-align: left;
}
.nbt-shout-form {
  display: flex;
  flex-direction: column;
  gap: 10px;
  margin-bottom: 12px;
}
.nbt-shout-row {
  display: flex;
  gap: 10px;
}
.nbt-shout-form input {
  flex: 1 1 auto;
  min-width: 0;
}
.nbt-shout-form button {
  flex: 0 0 auto;
}
.nbt-smile-toggle {
  font-size: 18px;
  line-height: 1;
  padding: 8px 12px;
}
.nbt-smilies {
  display: flex;
  flex-wrap: wrap;
  gap: 2px;
  max-height: 160px;
  overflow-y: auto;
  padding: 8px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
}
.nbt-smilies[hidden] {
  display: none;
}
.nbt-moneyadd form {
  display: flex;
  flex-direction: column;
  gap: 14px;
  max-width: 420px;
}
.nbt-moneyadd-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
}
.nbt-moneyadd-field label {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-soft);
}
.nbt-moneyadd-field input,
.nbt-moneyadd-field select {
  width: 100%;
}
.nbt-smile {
  background: none;
  border: 0;
  padding: 2px;
  cursor: pointer;
  line-height: 0;
}
.nbt-smile img {
  width: 22px;
  height: 22px;
  vertical-align: middle;
}
.nbt-shout-clear {
  margin: 0 0 12px;
  text-align: right;
  font-size: 12px;
}
.nbt-shout-list {
  display: flex;
  flex-direction: column;
  gap: 3px;
  max-height: 60vh;
  overflow-y: auto;
  padding: 6px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
}
.nbt-shout-msg {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: 6px;
  padding: 6px 10px;
  border-radius: 8px;
  font-size: 13px;
  line-height: 1.6;
  background: #f4f6fa;
}
.nbt-shout-msg:nth-child(even) {
  background: #eef1f7;
}
.nbt-shout-sys,
.nbt-shout-sys:nth-child(even) {
  background: #fdf6d8;
}
.nbt-shout-time {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
  font-variant-numeric: tabular-nums;
}
.nbt-shout-class {
  flex: 0 0 auto;
  width: 10px;
  height: 10px;
  border-radius: 2px;
  align-self: center;
}
.nbt-shout-user {
  font-weight: 700;
  white-space: nowrap;
}
.nbt-shout-user a {
  text-decoration: none;
}
.nbt-shout-text {
  flex: 1 1 160px;
  min-width: 0;
  color: var(--ink-soft);
  overflow-wrap: anywhere;
}
.nbt-shout-del {
  margin-left: auto;
  color: var(--red) !important;
  font-size: 11px;
}
@media (max-width: 560px) {
  .nbt-shout-row {
    flex-wrap: wrap;
  }
  .nbt-shout-row input {
    flex: 1 1 100%;
  }
  .nbt-shout-row button {
    flex: 1 1 auto;
  }
}

/* Check-in rewards */
.nbt-checkin {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 720px;
  margin: 0 auto;
  text-align: left;
}
.nbt-checkin-form {
  margin: 6px 0 14px;
  text-align: center;
}
.nbt-checkin-btn {
  padding: 14px 32px;
  border-radius: 999px;
  font-size: 16px;
}
@media (max-width: 560px) {
  .nbt-checkin-btn {
    width: 100%;
  }
}

/* Inline check-in (shoutbox) */
.nbt-checkin-inline {
  margin-bottom: 16px;
}
.nbt-rules-toggle {
  display: block;
  margin: 6px auto 0;
  padding: 4px 12px;
  font-size: 12px;
}
.nbt-checkin-rules {
  margin-top: 10px;
}
.nbt-checkin-rules[hidden] {
  display: none;
}

/* Shoutbox two-column layout + online sidebar */
.nbt-shout-layout {
  display: flex;
  gap: 18px;
  align-items: flex-start;
}
.nbt-shout {
  flex: 1 1 auto;
  min-width: 0;
}
.nbt-shout-side {
  flex: 0 0 260px;
  width: 260px;
}
.nbt-online-users {
  list-style: none;
  margin: 0;
  padding: 0;
  display: flex;
  flex-wrap: wrap;
  gap: 4px 10px;
}
.nbt-online-users li {
  font-size: 13px;
}
@media (max-width: 760px) {
  .nbt-shout-layout {
    flex-direction: column;
  }
  .nbt-shout-side {
    width: 100%;
    flex: 1 1 auto;
  }
}

/* New message notice */
.nbt-pm-notice {
  display: flex;
  align-items: center;
  justify-content: center;
  flex-wrap: wrap;
  gap: 10px 12px;
  max-width: 640px;
  margin: 0 auto 20px;
  padding: 14px 24px;
  border-radius: 999px;
  background: linear-gradient(135deg, #dc2626, #ef4444);
  color: #fff !important;
  font-size: 15px;
  font-weight: 600;
  text-decoration: none !important;
  box-shadow: 0 10px 26px rgba(220, 38, 38, 0.35);
  animation: nbt-pm-pulse 1.8s ease-in-out infinite;
}
.nbt-pm-notice:hover {
  transform: translateY(-1px);
  color: #fff !important;
}
.nbt-pm-notice-icon {
  font-size: 20px;
  line-height: 1;
}
.nbt-pm-notice-text strong {
  font-size: 18px;
}
.nbt-pm-notice-cta {
  font-size: 13px;
  opacity: 0.92;
}
@keyframes nbt-pm-pulse {
  0%,
  100% {
    box-shadow: 0 10px 26px rgba(220, 38, 38, 0.35);
  }
  50% {
    box-shadow: 0 10px 36px rgba(220, 38, 38, 0.6);
  }
}
@media (max-width: 560px) {
  .nbt-pm-notice {
    border-radius: 16px;
    text-align: center;
  }
}

/* Status strip content */
.nbt-welcome {
  display: block;
  margin-bottom: 8px;
  font-size: 13px;
}
.nbt-stat-btn {
  display: inline-flex;
  align-items: center;
  gap: 5px;
  margin: 2px 4px 2px 0;
  padding: 4px 12px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--ink-soft) !important;
  font-size: 12px;
  font-weight: 600;
  text-decoration: none !important;
  white-space: nowrap;
}
.nbt-stat-btn b {
  color: inherit;
}
.nbt-stat-btn:hover {
  border-color: var(--blue);
  background: var(--blue-soft);
  color: var(--blue-ink) !important;
}
.nbt-stat-money {
  background: #fdecec;
  border-color: #f6c9c9;
  color: #b91c1c !important;
  cursor: default;
}
.nbt-stat-gold {
  background: #fff4d6;
  border-color: #f2d98a;
  color: #92400e !important;
  cursor: default;
}
.nbt-stat-money:hover,
.nbt-stat-gold:hover {
  border-color: #f6c9c9;
  background: #fdecec;
  color: #b91c1c !important;
}
.nbt-stat-gold:hover {
  border-color: #f2d98a;
  background: #fff4d6;
  color: #92400e !important;
}
.nbt-stat-invite {
  background: #f3e8ff;
  border-color: #ddc7f5;
  color: #7e22ce !important;
}
.nbt-stat-bank {
  background: #e0f2fe;
  border-color: #b6e2f8;
  color: #0369a1 !important;
}
.nbt-stat-transfer {
  background: #fce7f3;
  border-color: #f6c3dd;
  color: #be185d !important;
}
.nbt-stat-logout {
  background: var(--surface);
  color: var(--muted) !important;
}
.nbt-stat-line {
  display: flex;
  flex-wrap: wrap;
  gap: 6px 16px;
  margin-top: 8px;
  font-size: 12px;
}
.nbt-stat-item {
  white-space: nowrap;
}
.nbt-stat-key {
  color: var(--blue);
  font-weight: 600;
}
.nbt-stat-key.nbt-up {
  color: var(--green);
}
.nbt-stat-key.nbt-down {
  color: var(--red);
}
.nbt-stat-key.nbt-seedbonus {
  color: var(--amber);
}
.nbt-seed {
  color: var(--green);
  font-weight: 600;
}
.nbt-leech {
  color: var(--red);
  font-weight: 600;
}

/* Rules page */
.nbt-rules {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 900px;
  margin: 0 auto;
}
.nbt-rules-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.nbt-rules-list li {
  position: relative;
  padding: 9px 0 9px 20px;
  border-bottom: 1px dashed var(--border);
  line-height: 1.75;
  color: var(--ink-soft);
}
.nbt-rules-list li:last-child {
  border-bottom: 0;
}
.nbt-rules-list li::before {
  content: "•";
  position: absolute;
  left: 4px;
  color: var(--blue);
  font-weight: 700;
}
.nbt-penalty {
  display: inline-block;
  margin-left: 6px;
  padding: 1px 9px;
  border-radius: 999px;
  background: #fdecec;
  color: var(--red);
  font-size: 12px;
  font-weight: 600;
  white-space: nowrap;
}

/* Top 10 tabs */
.nbt-toptabs {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  justify-content: center;
  margin-bottom: 18px;
}
.nbt-toptab {
  padding: 8px 18px;
  border-radius: 999px;
  border: 1px solid var(--border);
  background: var(--surface);
  color: var(--ink-soft);
  font-weight: 600;
  font-size: 14px;
}
.nbt-toptab.active,
.nbt-toptab:hover {
  background: var(--blue);
  color: #fff;
  border-color: var(--blue);
}
.nbt-small {
  font-size: 12px;
  font-weight: 400;
  color: var(--muted);
}
.nbt-frame-table tr.nbt-me td,
.nbt-forumtable tr.nbt-me td {
  background: #fff7d6;
}
@media (max-width: 820px) {
  .nbt-toptab {
    padding: 7px 14px;
    font-size: 13px;
  }
  .nbt-toptabs {
    gap: 6px;
    margin-bottom: 14px;
  }
  .nbt-frame-body {
    overflow-x: auto;
  }
  .nbt-frame-table {
    min-width: 520px;
  }
  .nbt-frame-table td,
  .nbt-frame-table th {
    white-space: nowrap;
    font-size: 12px;
    padding: 8px 10px;
  }
  .nbt-frame-title {
    font-size: 15px;
    line-height: 1.5;
  }
  .nbt-frame-title .nbt-small {
    display: block;
    margin-top: 4px;
  }
}

/* News admin (news.php) */
#nbt-news-body {
  width: 100%;
  min-height: 120px;
}
.nbt-news-admin {
  display: flex;
  flex-direction: column;
  gap: 12px;
}
.nbt-news-item {
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  overflow: hidden;
}
.nbt-news-item-head {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  padding: 8px 14px;
  background: var(--surface-soft);
  border-bottom: 1px solid var(--border);
  font-size: 12px;
  color: var(--muted);
}
.nbt-news-item-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
}
.nbt-news-item-body {
  padding: 12px 14px;
  color: var(--ink-soft);
  line-height: 1.75;
  overflow-wrap: anywhere;
}
.nbt-news-item-body img {
  max-width: 100%;
  height: auto;
}

/* Karma bonus (mybonus.php) */
.nbt-bonus {
  max-width: 820px;
  margin: 0 auto;
}
.nbt-bonus-item {
  margin-bottom: 16px;
}
.nbt-bonus-item.is-locked {
  opacity: 0.72;
}
.nbt-bonus-desc {
  margin: 0 0 12px;
  color: var(--ink-soft);
  font-size: 13px;
  line-height: 1.7;
}
.nbt-bonus-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  margin-top: 6px;
  padding-top: 12px;
  border-top: 1px dashed var(--border);
}
.nbt-bonus-locked {
  color: var(--muted);
  font-size: 13px;
  font-weight: 600;
}

/* Make/edit poll (makepoll.php) */
.nbt-makerpoll {
  max-width: 820px;
  margin: 0 auto;
}
.nbt-poll-grid {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(240px, 1fr));
  gap: 12px;
  margin-top: 4px;
}
.nbt-req {
  color: var(--red);
  font-weight: 700;
}

/* Polls (polls.php) */
.nbt-polls {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 780px;
  margin: 0 auto;
}
.nbt-poll-card {
  text-align: left;
}
.nbt-poll-head {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 12px;
  margin-bottom: 14px;
}
.nbt-poll-question {
  margin: 0;
  font-size: 17px;
  font-weight: 700;
  text-align: left;
  overflow-wrap: anywhere;
}
.nbt-poll-meta {
  color: var(--muted);
  font-size: 12px;
  white-space: nowrap;
}
.nbt-poll-options {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.nbt-poll-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(90px, 2fr) 42px;
  align-items: center;
  gap: 10px;
}
.nbt-poll-label {
  font-size: 13px;
  color: var(--ink-soft);
  overflow-wrap: anywhere;
}
.nbt-poll-bar {
  height: 12px;
  border-radius: 999px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  overflow: hidden;
}
.nbt-poll-bar-fill {
  display: block;
  height: 100%;
  border-radius: 999px;
  background: linear-gradient(90deg, var(--blue), var(--cyan));
}
.nbt-poll-pct {
  font-size: 12px;
  font-weight: 600;
  color: var(--blue-ink);
  text-align: right;
}
.nbt-poll-foot {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  justify-content: space-between;
  gap: 8px 12px;
  margin-top: 14px;
  padding-top: 12px;
  border-top: 1px dashed var(--border);
}
.nbt-poll-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  font-size: 13px;
}
@media (max-width: 560px) {
  .nbt-poll-row {
    grid-template-columns: minmax(0, 1fr) 42px;
    grid-template-areas:
      "label pct"
      "bar bar";
    row-gap: 6px;
  }
  .nbt-poll-label {
    grid-area: label;
  }
  .nbt-poll-bar {
    grid-area: bar;
  }
  .nbt-poll-pct {
    grid-area: pct;
  }
}

/* Staff panel load bars */
.nbt-loadbar {
  position: relative;
  height: 24px;
  border-radius: 999px;
  background: var(--surface-soft);
  border: 1px solid var(--border);
  overflow: hidden;
}
.nbt-loadbar-fill {
  height: 100%;
  transition: width 0.4s ease;
}
.nbt-loadbar-label {
  position: absolute;
  inset: 0;
  display: flex;
  align-items: center;
  justify-content: center;
  font-size: 12px;
  font-weight: 600;
  color: var(--ink);
  text-shadow: 0 1px 2px rgba(255, 255, 255, 0.6);
}
.nbt-del {
  color: var(--red) !important;
}

/* FAQ accordion */
.nbt-faq {
  max-width: 980px;
  margin: 0 auto;
}
.nbt-faq-tools {
  margin-bottom: 16px;
}
.nbt-faq-search {
  width: 100%;
}
.nbt-faq-cat {
  margin-bottom: 22px;
}
.nbt-faq-cat > h2 {
  margin: 0 0 10px;
  font-size: 18px;
  color: var(--blue-ink);
}
.nbt-faq-item {
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  margin-bottom: 8px;
  overflow: hidden;
}
.nbt-faq-item > summary {
  cursor: pointer;
  padding: 12px 42px 12px 16px;
  font-weight: 600;
  color: var(--ink);
  position: relative;
  list-style: none;
}
.nbt-faq-item > summary::-webkit-details-marker {
  display: none;
}
.nbt-faq-item > summary::after {
  content: "+";
  position: absolute;
  right: 16px;
  top: 50%;
  transform: translateY(-50%);
  color: var(--blue);
  font-weight: 700;
  font-size: 18px;
}
.nbt-faq-item[open] > summary {
  background: var(--surface-blue);
}
.nbt-faq-item[open] > summary::after {
  content: "−";
}
.nbt-faq-a {
  padding: 12px 16px 16px;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.85;
}
.nbt-faq-a ul {
  margin: 6px 0;
  padding-left: 20px;
}
.nbt-faq-a li {
  margin-bottom: 4px;
}
.nbt-faq-table {
  width: 100%;
  border-collapse: collapse;
  margin: 10px 0;
  font-size: 13px;
}
.nbt-faq-table th,
.nbt-faq-table td {
  border: 1px solid var(--border);
  padding: 6px 10px;
  text-align: left;
}
.nbt-faq-table th {
  background: var(--surface-soft);
}

/* User profile (userdetails.php) */
.nbt-profile {
  display: flex;
  flex-direction: column;
  gap: 18px;
}
.nbt-profile-hero {
  display: grid;
  grid-template-columns: minmax(0, 0.95fr) minmax(0, 1.05fr);
  gap: 18px;
  align-items: stretch;
}
.nbt-profile-head {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  align-content: flex-start;
  gap: 20px;
}
.nbt-profile-head .nbt-profile-stats {
  flex: 1 1 100%;
  grid-template-columns: repeat(2, minmax(0, 1fr));
}
.nbt-profile-self-actions {
  margin-bottom: 10px;
}
.nbt-profile-account {
  min-width: 0;
}
.nbt-profile-avatar {
  flex: 0 0 auto;
}
.nbt-profile-avatar img {
  width: 132px;
  height: 132px;
  object-fit: cover;
  border-radius: 18px;
  border: 1px solid var(--border);
  box-shadow: var(--shadow-sm);
  background: var(--surface-soft);
}
.nbt-profile-id {
  flex: 1 1 260px;
  min-width: 0;
}
.nbt-profile-id h1 {
  margin: 0 0 10px;
  text-align: left;
  font-size: 24px;
  overflow-wrap: anywhere;
}
.nbt-profile-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 10px;
}
.nbt-profile-tags img {
  height: 15px;
  vertical-align: middle;
}
.nbt-chip-gold {
  background: #fff4d6;
  color: var(--amber);
}
.nbt-chip-red {
  background: #fdecec;
  color: var(--red);
}
.nbt-profile-pet {
  position: relative;
  display: inline-flex;
  align-items: center;
  justify-content: center;
  width: 72px !important;
  min-width: 72px !important;
  height: 72px !important;
  min-height: 72px !important;
  margin: 0 0 12px;
  padding: 0 !important;
  overflow: visible;
  border: 1px solid var(--border) !important;
  border-radius: 50% !important;
  background: var(--surface-soft) !important;
  box-shadow: none !important;
  cursor: help;
}
.nbt-profile-pet img {
  display: block;
  width: 60px;
  height: 60px;
  object-fit: contain;
  border-radius: 50%;
}
.nbt-profile-pet:hover,
.nbt-profile-pet:focus {
  background: var(--blue-soft) !important;
  border-color: var(--blue) !important;
}
.nbt-profile-pet-tooltip {
  position: absolute;
  left: 50%;
  top: calc(100% + 8px);
  z-index: 50;
  width: max-content;
  max-width: min(260px, 80vw);
  padding: 8px 12px;
  border-radius: 10px;
  background: #0f172a;
  color: #fff;
  font-size: 13px;
  font-weight: 600;
  line-height: 1.5;
  text-align: center;
  overflow-wrap: anywhere;
  box-shadow: 0 10px 25px rgba(15, 23, 42, 0.25);
  opacity: 0;
  visibility: hidden;
  transform: translate(-50%, -4px);
  transition:
    opacity 0.15s ease,
    transform 0.15s ease,
    visibility 0.15s ease;
  pointer-events: none;
}
.nbt-profile-pet-tooltip::before {
  content: "";
  position: absolute;
  left: 50%;
  top: -5px;
  width: 10px;
  height: 10px;
  background: #0f172a;
  transform: translateX(-50%) rotate(45deg);
}
.nbt-profile-pet:hover .nbt-profile-pet-tooltip,
.nbt-profile-pet:focus .nbt-profile-pet-tooltip {
  opacity: 1;
  visibility: visible;
  transform: translate(-50%, 0);
}
.nbt-profile-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 8px;
  flex: 1 1 100%;
  margin-top: 4px;
}
.nbt-profile-actions form {
  margin: 0;
}
.nbt-profile-actions a.nbt-action-friend,
.nbt-profile-actions a.nbt-action-unblock,
.nbt-profile-actions button.nbt-action-friend,
.nbt-profile-actions button.nbt-action-unblock {
  background: #15803d !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(21, 128, 61, 0.22) !important;
}
.nbt-profile-actions a.nbt-action-friend:hover,
.nbt-profile-actions a.nbt-action-unblock:hover,
.nbt-profile-actions button.nbt-action-friend:hover,
.nbt-profile-actions button.nbt-action-unblock:hover {
  background: #166534 !important;
  color: #fff !important;
}
.nbt-profile-actions a.nbt-action-block,
.nbt-profile-actions button.nbt-action-block {
  background: #dc2626 !important;
  color: #fff !important;
  box-shadow: 0 3px 10px rgba(220, 38, 38, 0.2) !important;
}
.nbt-profile-actions a.nbt-action-block:hover,
.nbt-profile-actions button.nbt-action-block:hover {
  background: #b91c1c !important;
  color: #fff !important;
}
.nbt-profile-actions a.nbt-action-friend-remove,
.nbt-profile-actions button.nbt-action-friend-remove {
  background: #64748b !important;
  color: #fff !important;
}
.nbt-profile-actions a.nbt-action-friend-remove:hover,
.nbt-profile-actions button.nbt-action-friend-remove:hover {
  background: #475569 !important;
  color: #fff !important;
}
.btn-ghost,
a.btn-ghost,
button.btn-ghost {
  background: var(--surface) !important;
  color: var(--ink-soft) !important;
  border: 1px solid var(--border-strong) !important;
  box-shadow: none !important;
}
.btn-ghost:hover,
a.btn-ghost:hover,
button.btn-ghost:hover {
  background: var(--blue-soft) !important;
  color: var(--blue-ink) !important;
}
a.btn,
button.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  gap: 6px;
  padding: 9px 18px;
  border: 0;
  border-radius: var(--radius-sm);
  background: linear-gradient(180deg, var(--blue), var(--blue-2, #1d4ed8));
  color: #fff !important;
  font-size: 13px;
  font-weight: 600;
  text-decoration: none !important;
  cursor: pointer;
}
a.btn:hover,
button.btn:hover {
  filter: brightness(1.06);
}
a.btn.btn-ghost,
button.btn.btn-ghost {
  background: var(--surface) !important;
  color: var(--ink-soft) !important;
  border: 1px solid var(--border-strong) !important;
  box-shadow: none !important;
}
a.btn.btn-ghost:hover,
button.btn.btn-ghost:hover {
  background: var(--blue-soft) !important;
  color: var(--blue-ink) !important;
}
.nbt-profile-stats {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
  gap: 12px;
}
.nbt-profile-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 18px;
  align-items: start;
}
.nbt-profile-list {
  margin: 0;
  padding: 0;
  list-style: none;
}
.nbt-profile-list li {
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  justify-content: space-between;
  gap: 6px 14px;
  padding: 9px 0;
  border-bottom: 1px dashed var(--border);
  font-size: 14px;
}
.nbt-profile-list li:last-child {
  border-bottom: 0;
}
.nbt-profile-list li span {
  color: var(--muted);
}
.nbt-profile-list li b {
  color: var(--ink);
  text-align: right;
  overflow-wrap: anywhere;
}
.nbt-profile-info {
  color: var(--ink-soft);
  line-height: 1.8;
  overflow-wrap: anywhere;
}
.nbt-table-scroll {
  overflow-x: auto;
}
.nbt-empty-card {
  text-align: center;
  padding: 34px 20px;
}
.nbt-empty-icon {
  font-size: 40px;
  line-height: 1;
  margin-bottom: 10px;
}
.nbt-empty-card h2 {
  margin: 0 0 8px;
}
.nbt-empty-card p {
  margin: 0 auto 16px;
  max-width: 460px;
  color: var(--muted);
  font-size: 13px;
}

/* My profile (my.php) */
.nbt-myprofile {
  display: flex;
  flex-direction: column;
  gap: 16px;
  max-width: 900px;
  margin: 0 auto;
}
.nbt-profile-shortcuts {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 10px;
}
.nbt-shortcut {
  display: flex;
  align-items: center;
  gap: 10px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  color: var(--ink-soft) !important;
  font-weight: 600;
  font-size: 13px;
  text-decoration: none !important;
  box-shadow: var(--shadow-sm);
  transition:
    border-color 0.15s ease,
    color 0.15s ease;
}
.nbt-shortcut:hover {
  border-color: var(--blue);
  color: var(--blue-ink) !important;
}
.nbt-shortcut-icon {
  font-size: 18px;
}
.nbt-myprofile form {
  display: flex;
  flex-direction: column;
  gap: 16px;
}
.nbt-form-row {
  display: flex;
  flex-wrap: wrap;
  gap: 16px;
}
.nbt-form-row .nbt-form-field {
  flex: 1 1 200px;
}
.nbt-form-field {
  display: flex;
  flex-direction: column;
  gap: 6px;
  margin-bottom: 10px;
}
.nbt-form-field > label {
  font-size: 13px;
  font-weight: 600;
  color: var(--ink-soft);
}
.nbt-form-field small {
  color: var(--muted);
  font-size: 11px;
}
.nbt-form-field input[type="text"],
.nbt-form-field input[type="password"],
.nbt-form-field input:not([type]),
.nbt-form-field select,
.nbt-form-field textarea {
  width: 100%;
}
.nbt-radio,
.nbt-check {
  display: flex;
  align-items: center;
  gap: 7px;
  font-size: 13px;
  color: var(--ink-soft);
  cursor: pointer;
}
.nbt-check {
  margin: 6px 0;
}
.nbt-cat-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(150px, 1fr));
  gap: 4px 14px;
}
.nbt-avatar-row {
  display: flex;
  flex-wrap: wrap;
  align-items: flex-start;
  gap: 14px;
}
.nbt-avatar-input {
  flex: 1 1 240px;
  min-width: 0;
}
.nbt-avatar-input input {
  width: 100%;
}
.nbt-avatar-preview {
  flex: 0 0 auto;
  width: 96px;
  height: 96px;
  border: 1px solid var(--border);
  border-radius: 14px;
  overflow: hidden;
  background: var(--surface-soft);
}
.nbt-avatar-preview img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
}
@media (max-width: 560px) {
  .nbt-avatar-row {
    justify-content: center;
  }
  .nbt-avatar-preview {
    margin-left: auto;
    margin-right: auto;
  }
}
.nbt-form-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  justify-content: center;
}

/* Invite page */
.nbt-invite {
  max-width: 680px;
  margin: 0 auto;
}
.nbt-invite textarea {
  width: 100%;
  min-height: 220px;
}

/* Exchange result (takebank.php) */
.nbt-re {
  max-width: 520px;
  margin: 0 auto;
}
.nbt-transfer {
  max-width: 560px;
  margin: 0 auto;
}
.nbt-transfer-balance {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-bottom: 16px;
}
.nbt-result-card {
  text-align: center;
  padding: 34px 22px;
}
.nbt-result-icon {
  font-size: 42px;
  line-height: 1;
  margin-bottom: 10px;
}
.nbt-result-card h1 {
  margin: 0 0 10px;
  font-size: 20px;
}
.nbt-result-card p {
  margin: 0 0 18px;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.7;
}
.nbt-result-win {
  border-color: #bbf7d0;
}
.nbt-result-err {
  border-color: #fecaca;
}

/* People lists (friends.php) */
.nbt-people {
  display: flex;
  flex-direction: column;
  gap: 10px;
}
.nbt-person {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 12px 14px;
  border: 1px solid var(--border);
  border-radius: var(--radius-sm);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-person-avatar img {
  width: 56px;
  height: 56px;
  object-fit: cover;
  border-radius: 12px;
}
.nbt-person-main {
  flex: 1 1 auto;
  min-width: 0;
}
.nbt-person-name {
  font-weight: 600;
  overflow-wrap: anywhere;
}
.nbt-person-title {
  color: var(--muted);
  font-size: 12px;
  margin-top: 2px;
}
.nbt-person-last {
  color: var(--muted);
  font-size: 12px;
}
.nbt-person-actions {
  display: flex;
  flex-wrap: wrap;
  flex: 0 0 auto;
  gap: 8px;
}
.nbt-empty-text {
  color: var(--muted);
  margin: 0;
}
.nbt-friends-footer {
  margin: 18px 0 0;
  text-align: center;
}
.nbt-friends-footer .btn {
  display: inline-flex;
}
@media (max-width: 560px) {
  .nbt-person {
    flex-wrap: wrap;
  }
  .nbt-person-actions {
    width: 100%;
  }
  .nbt-person-actions .btn {
    flex: 1 1 auto;
  }
}
@media (max-width: 820px) {
  .nbt-profile-hero {
    grid-template-columns: minmax(0, 1fr);
  }
  .nbt-profile-grid {
    grid-template-columns: minmax(0, 1fr);
  }
}
@media (max-width: 820px) {
  .nbt-profile-head {
    flex-direction: column;
    align-items: center;
    text-align: center;
  }
  .nbt-profile-avatar {
    align-self: center;
  }
  .nbt-profile-id {
    flex: 1 1 auto;
    width: 100%;
    text-align: center;
  }
  .nbt-profile-id h1 {
    text-align: center;
  }
  .nbt-profile-tags {
    justify-content: center;
  }
  .nbt-profile-pet {
    margin-left: auto;
    margin-right: auto;
  }
  .nbt-profile-head .nbt-profile-stats {
    flex: 1 1 auto;
    width: 100%;
    grid-template-columns: minmax(0, 1fr);
  }
  .nbt-profile-head .nbt-stat-card {
    justify-content: center;
    text-align: center;
  }
  .nbt-profile-head .nbt-stat-body {
    align-items: center;
  }
}
@media (max-width: 560px) {
  .nbt-profile-head {
    align-items: center;
    text-align: center;
  }
  .nbt-profile-avatar {
    align-self: center;
  }
  .nbt-profile-avatar img {
    width: 108px;
    height: 108px;
  }
  .nbt-profile-id {
    text-align: center;
  }
  .nbt-profile-id h1 {
    font-size: 20px;
    text-align: center;
  }
  .nbt-profile-tags {
    justify-content: center;
  }
  .nbt-profile-pet {
    margin-left: auto;
    margin-right: auto;
  }
  .nbt-profile-actions {
    flex-direction: column;
    align-items: stretch;
    width: 100%;
  }
  .nbt-profile-actions .btn,
  .nbt-profile-actions form,
  .nbt-profile-actions button {
    flex: 1 1 100%;
    width: 100%;
  }
}

/* Mod edit-user form (userdetails.php) */
.nbt-edituser {
  width: 100%;
  table-layout: fixed;
  word-break: break-word;
}
.nbt-edituser input[type="text"],
.nbt-edituser input[type="password"],
.nbt-edituser input:not([type]),
.nbt-edituser textarea,
.nbt-edituser select {
  width: 100%;
  max-width: 100%;
  box-sizing: border-box;
}
.nbt-edituser td {
  overflow-wrap: anywhere;
}
@media (max-width: 620px) {
  .nbt-edituser,
  .nbt-edituser > tbody,
  .nbt-edituser > tbody > tr,
  .nbt-edituser > tbody > tr > td {
    display: block;
    width: 100% !important;
    box-sizing: border-box;
  }
  .nbt-edituser > tbody > tr > td:first-child:not(:last-child) {
    border-bottom: 0;
    padding-bottom: 2px;
  }
  .nbt-edituser > tbody > tr > td + td {
    padding-top: 2px;
  }
}

/* ------------------------------ Responsive ------------------------------- */
@media (max-width: 980px) {
  #container {
    width: calc(100% - 20px);
    margin-top: 14px;
  }
  #top {
    min-height: 84px;
    padding: 12px 16px;
  }
  #top img {
    height: 46px;
  }
  table[style*="width:920px"] td {
    display: block;
    width: 100% !important;
    text-align: left !important;
  }
  table[style*="width:920px"] td + td {
    margin-top: 6px;
  }
}

@media (max-width: 900px) {
  table.mainouter,
  table.mainouter > tbody,
  table.mainouter > tbody > tr,
  table.mainouter td[width="155"] {
    display: block;
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
  }
  table.mainouter > tbody > tr > td {
    display: block;
    box-sizing: border-box;
    width: 100% !important;
    min-width: 0;
    border-radius: var(--radius);
    margin-bottom: 10px;
  }
  td.outer {
    padding: 18px 13px 22px;
  }
  .nbt-frame,
  .nbt-frame > tbody,
  .nbt-frame > tbody > tr,
  .nbt-frame > tbody > tr > td.nbt-frame-body {
    display: block;
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
  }
  .nbt-frame {
    table-layout: fixed;
  }
  .mainouter table.main,
  .mainouter table.main > tbody,
  .mainouter table.main > tbody > tr,
  .mainouter table.main > tbody > tr > td.embedded {
    display: block;
    box-sizing: border-box;
    width: 100% !important;
    max-width: 100%;
    min-width: 0;
  }
  .mainouter table.main {
    table-layout: fixed;
  }
  .nbt-post,
  .nbt-post-head,
  .nbt-post-body,
  .nbt-post-content {
    box-sizing: border-box;
    width: 100%;
    max-width: 100%;
    min-width: 0;
  }
  .nbt-post-content > * {
    max-width: 100%;
  }
  .nbt-post-content iframe,
  .nbt-post-content video,
  .nbt-post-content object,
  .nbt-post-content embed {
    width: 100%;
    max-width: 100%;
  }
  h1 {
    font-size: 19px;
  }
  h2 {
    font-size: 14px;
  }
  h3 {
    font-size: 13px;
  }
  td {
    padding: 6px;
    font-size: 12px;
  }
  .nbt-login,
  .nbt-signup-form {
    max-width: 100%;
  }
}

@media (max-width: 560px) {
  #container {
    width: calc(100% - 16px);
  }
  #top {
    min-height: 72px;
    padding: 10px 13px;
  }
  #top img {
    height: 38px;
  }
  #menu a:link,
  #menu a:visited,
  #menu a:active {
    padding: 8px 11px;
    font-size: 12px;
  }
  td.outer {
    padding: 15px 11px 20px;
  }
  .nbt-login {
    padding: 18px 14px;
  }
  h1 {
    font-size: 17px;
  }
  td.title {
    font-size: 15pt;
  }
}

@media (max-width: 700px) {
  html,
  body,
  #wrap0,
  #container {
    max-width: 100%;
    min-width: 0;
  }
  .nbt-post-head {
    align-items: flex-start;
  }
  .nbt-post-actions {
    margin-left: 0;
  }
  .nbt-post-body {
    padding: 12px;
  }
}

/* Mobile overflow guards for the home page */
.nbt-home,
.nbt-home-grid,
.nbt-home-main,
.nbt-home-side,
.nbt-card,
.nbt-topic,
.nbt-topic-main,
.nbt-stat-body {
  min-width: 0;
  max-width: 100%;
}
.nbt-topic-title,
.nbt-topic-sub,
.nbt-topic-last,
.nbt-forum-last,
.nbt-news-body,
.nbt-poll-row span,
.nbt-stat-label,
.nbt-stat-value {
  overflow-wrap: anywhere;
  word-break: break-word;
}
@media (max-width: 620px) {
  .nbt-news li {
    flex-direction: column;
    gap: 5px;
  }
  .nbt-news-date {
    flex: 0 0 auto;
  }
  .nbt-topic-last,
  .nbt-forum-last {
    white-space: normal;
  }
  .nbt-topic-meta {
    min-width: 0;
  }
  .nbt-home-grid {
    grid-template-columns: minmax(0, 1fr);
  }
  .nbt-card {
    padding: 16px 14px;
  }
  .nbt-stat-card {
    gap: 10px;
    padding: 12px;
  }
  .nbt-stat-icon {
    width: 36px;
    height: 36px;
    font-size: 15px;
  }
  .nbt-stat-icon i {
    font-size: 16px;
  }
  .nbt-stat-value {
    font-size: 18px;
  }
  .nbt-stat-label {
    font-size: 11px;
  }
  .nbt-cards-head,
  .nbt-card-head {
    flex-wrap: wrap;
  }
}

/* Scroll wide legacy tables on small screens (not on desktop) */
@media (max-width: 900px) {
  td.outer {
    overflow-x: auto;
  }
}

/* Pet adventure hub, care station, and arena */
.nbt-pet-page {
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 1160px;
  margin: 0 auto;
  text-align: left;
}
.nbt-pet-page-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 8px 2px;
}
.nbt-pet-page-head h1 {
  margin: 0 0 5px;
  text-align: left;
}
.nbt-pet-page-head p:not(.nbt-pet-eyebrow) {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}
.nbt-pet-eyebrow {
  margin: 0 0 5px;
  color: var(--blue-ink);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .13em;
}
.nbt-pet-wallet {
  display: flex;
  flex: 0 0 auto;
  flex-direction: column;
  gap: 4px;
  padding: 12px 16px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-soft);
  color: var(--ink-soft);
  font-size: 12px;
}
.nbt-pet-wallet > span { color: var(--muted); font-size: 10px; }
.nbt-pet-wallet strong { white-space: nowrap; }
.nbt-pet-callout {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 20px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface-soft);
}
.nbt-pet-callout strong { color: var(--ink); font-size: 16px; }
.nbt-pet-callout p { margin: 4px 0 0; color: var(--muted); font-size: 13px; line-height: 1.7; }
.nbt-pet-empty-icon { display: block; margin-bottom: 6px; font-size: 28px; }
.nbt-adoption-controls { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 6px 14px; align-items: end; margin-top: 14px; padding: 17px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); }
.nbt-adoption-controls label { grid-column: 1; grid-row: 1; color: var(--ink-soft); font-size: 12px; font-weight: 700; }
.nbt-adoption-controls input { grid-column: 1; grid-row: 2; width: 100%; min-width: 0; padding: 11px 12px; }
.nbt-adoption-controls button { grid-column: 2; grid-row: 1 / span 2; white-space: nowrap; }
.nbt-pet-spotlight {
  display: grid;
  grid-template-columns: 190px minmax(0, 1fr);
  gap: 22px;
  align-items: center;
  padding: 22px;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: radial-gradient(100% 140% at 0% 0%, var(--blue-soft), transparent 58%), var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-pet-spotlight-image {
  display: grid;
  place-items: center;
  min-height: 180px;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--surface);
}
.nbt-pet-spotlight-image img { width: 100%; height: 168px; object-fit: contain; }
.nbt-pet-spotlight-main { min-width: 0; }
.nbt-pet-name-line { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.nbt-pet-name-line h2 { margin: 2px 0 0; text-align: left; font-size: 25px; overflow-wrap: anywhere; }
.nbt-pet-level { color: var(--blue-ink); font-size: 10px; font-weight: 800; letter-spacing: .1em; }
.nbt-pet-mood { flex: 0 0 auto; padding: 6px 10px; border-radius: 999px; background: var(--surface-soft); color: var(--ink-soft); font-size: 11px; font-weight: 700; }
.nbt-pet-species { margin: 6px 0 14px; color: var(--muted); font-size: 12px; line-height: 1.7; }
.nbt-pet-exp { margin-bottom: 14px; }
.nbt-pet-exp > div { display: flex; justify-content: space-between; gap: 10px; margin-bottom: 5px; color: var(--muted); font-size: 11px; }
.nbt-pet-exp b { color: var(--ink-soft); }
.nbt-pet-exp .nbt-pet-meter { height: 7px; }
.nbt-pet-exp .nbt-pet-meter i { background: linear-gradient(90deg, #8b5cf6, #3b82f6); }
.nbt-pet-adventure-grid { display: grid; grid-template-columns: minmax(0, 1.1fr) minmax(300px, .9fr); gap: 18px; align-items: start; }
.nbt-pet-quest-card .nbt-card-head,
.nbt-pet-stats-card .nbt-card-head { align-items: center; }
.nbt-pet-quest-card .nbt-card-head h2,
.nbt-pet-stats-card .nbt-card-head h2 { margin: 0; text-align: left; }
.nbt-pet-quest { display: flex; align-items: center; gap: 11px; padding: 13px 0; border-bottom: 1px solid var(--border); }
.nbt-pet-quest:last-of-type { border-bottom: 0; }
.nbt-pet-quest-icon { display: grid; flex: 0 0 40px; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--blue-soft); font-size: 20px; }
.nbt-pet-quest-copy { display: flex; flex: 1 1 auto; flex-direction: column; gap: 3px; min-width: 0; }
.nbt-pet-quest-copy strong { color: var(--ink); font-size: 13px; }
.nbt-pet-quest-copy span { color: var(--muted); font-size: 11px; line-height: 1.6; }
.nbt-pet-quest form { flex: 0 0 auto; margin: 0; }
.nbt-pet-quest form button { white-space: nowrap; }
.nbt-pet-done { flex: 0 0 auto; color: var(--muted); font-size: 11px; font-weight: 700; }
.nbt-pet-training-note { margin: 8px 0 0; color: var(--muted); font-size: 11px; line-height: 1.7; }
.nbt-pet-stats-card .nbt-card-head { margin-bottom: 14px; }
.nbt-pet-stats-card .nbt-pet-stats { margin: 0; }
.nbt-pet-shortcuts { display: flex; flex-wrap: wrap; gap: 8px; margin-top: 15px; }
.nbt-pet-inventory .nbt-card-head { margin-bottom: 14px; }
.nbt-pet-inventory .nbt-card-head h2 { margin: 0; text-align: left; }
.nbt-pet-inventory-empty { display: flex; align-items: center; flex-wrap: wrap; gap: 10px; color: var(--muted); font-size: 13px; }
.nbt-pet-inventory-empty > span { font-size: 24px; }
.nbt-pet-inventory-empty p { flex: 1 1 240px; margin: 0; }
.nbt-pet-release { margin: 0; text-align: right; }
.nbt-pet-release button { padding: 0; border: 0; background: none; color: var(--muted); font-size: 11px; text-decoration: underline; cursor: pointer; }

.nbt-care-pet-strip,
.nbt-arena-own {
  display: flex;
  align-items: center;
  gap: 14px;
  padding: 13px 16px;
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface);
}
.nbt-care-pet-strip > img,
.nbt-arena-own > img { flex: 0 0 62px; width: 62px; height: 62px; object-fit: contain; border-radius: 11px; background: var(--surface-soft); }
.nbt-care-pet-strip > div,
.nbt-arena-own > div:first-of-type { display: flex; flex: 1 1 auto; flex-direction: column; gap: 3px; min-width: 0; }
.nbt-care-pet-strip > div > span,
.nbt-arena-own > div:first-of-type > span { color: var(--muted); font-size: 10px; }
.nbt-care-pet-strip strong,
.nbt-arena-own > div:first-of-type > strong { color: var(--ink); font-size: 17px; }
.nbt-care-pet-strip small,
.nbt-arena-own small { color: var(--muted); font-size: 11px; }
.nbt-care-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 14px; }
.nbt-care-card { display: flex; align-items: center; flex-direction: column; gap: 9px; margin: 0; padding: 18px 14px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow-sm); text-align: center; }
.nbt-care-card-icon { display: grid; place-items: center; width: 52px; height: 52px; border-radius: 16px; background: var(--blue-soft); font-size: 27px; }
.nbt-care-card > strong { color: var(--ink); font-size: 14px; }
.nbt-care-effect { color: var(--muted); font-size: 12px; }
.nbt-care-price { margin-top: auto; color: var(--blue-ink); font-size: 12px; font-weight: 700; }
.nbt-care-card button { width: 100%; margin-top: 3px; }
.nbt-care-card button:disabled { opacity: .55; cursor: not-allowed; }
.nbt-care-footnote { margin: -5px 0 0; color: var(--muted); font-size: 11px; text-align: center; }
.nbt-pet-result.info,
.nbt-result.info { border-color: var(--border); background: var(--surface-soft); color: var(--ink-soft); }

.nbt-arena-page > .nbt-pet-page-head { align-items: flex-end; }
.nbt-arena-own { padding: 15px 18px; }
.nbt-arena-quota { display: flex; flex: 0 0 auto; flex-direction: column; align-items: center; gap: 2px; padding: 8px 13px; border-radius: 11px; background: var(--blue-soft); }
.nbt-arena-quota strong { color: var(--blue-ink); font-size: 20px; }
.nbt-arena-quota span { color: var(--muted); font-size: 9px; }
.nbt-arena-warning { border-color: #f4d58b; background: #fff9e8; }
.nbt-arena-warning .btn { flex: 0 0 auto; }
.nbt-arena-rules { display: flex; flex-wrap: wrap; gap: 6px 12px; padding: 11px 14px; border-radius: 11px; background: var(--surface-soft); color: var(--muted); font-size: 11px; }
.nbt-arena-rules strong { color: var(--ink-soft); }
.nbt-arena-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 13px; }
.nbt-arena-card { display: flex; flex-direction: column; gap: 12px; min-width: 0; padding: 15px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-sm); }
.nbt-arena-card-top { display: flex; align-items: center; gap: 11px; min-width: 0; }
.nbt-arena-card-top img { flex: 0 0 62px; width: 62px; height: 62px; object-fit: contain; border-radius: 11px; background: var(--surface-soft); }
.nbt-arena-card-top > div { min-width: 0; }
.nbt-arena-card-top span,
.nbt-arena-card-top small { display: block; color: var(--muted); font-size: 10px; overflow-wrap: anywhere; }
.nbt-arena-card-top h2 { margin: 3px 0; text-align: left; font-size: 16px; overflow-wrap: anywhere; }
.nbt-arena-card-stats { display: flex; flex-wrap: wrap; gap: 6px; }
.nbt-arena-card-stats span { padding: 4px 7px; border-radius: 7px; background: var(--surface-soft); color: var(--ink-soft); font-size: 10px; }
.nbt-arena-card form { margin: 0; }
.nbt-arena-card button { width: 100%; }
.nbt-arena-history .nbt-card-head h2 { margin: 0; text-align: left; }
.nbt-arena-history-row { display: grid; grid-template-columns: minmax(0, 1fr) auto auto; gap: 12px; align-items: center; padding: 10px 0; border-bottom: 1px solid var(--border); font-size: 11px; }
.nbt-arena-history-row:last-child { border-bottom: 0; }
.nbt-arena-history-row > span { min-width: 0; color: var(--muted); overflow-wrap: anywhere; }
.nbt-arena-history-row strong.win { color: var(--green, #15803d); }
.nbt-arena-history-row strong.loss { color: var(--red); }
.nbt-arena-history-row strong.draw { color: var(--muted); }
.nbt-arena-history-row time { color: var(--muted); white-space: nowrap; }
.nbt-item-shop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(215px, 1fr)); gap: 13px; }
.nbt-item-shop-card { position: relative; display: flex; flex-direction: column; align-items: center; gap: 9px; min-width: 0; padding: 15px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-sm); cursor: pointer; text-align: center; }
.nbt-item-shop-card:has(input:checked) { border-color: var(--blue); box-shadow: 0 0 0 3px var(--blue-soft); }
.nbt-item-shop-card > input { position: absolute; top: 12px; right: 12px; accent-color: var(--blue); }
.nbt-item-shop-card.is-owned { opacity: .66; cursor: default; }
.nbt-item-shop-art { display: grid; place-items: center; width: 90px; height: 90px; border-radius: 15px; background: var(--surface-soft); font-size: 34px; }
.nbt-item-shop-art img { max-width: 76px; max-height: 76px; object-fit: contain; }
.nbt-item-shop-card > strong { color: var(--ink); font-size: 13px; }
.nbt-item-shop-effects { display: flex; flex-wrap: wrap; justify-content: center; gap: 5px; }
.nbt-item-shop-effects span { padding: 3px 6px; border-radius: 6px; background: var(--surface-soft); color: var(--ink-soft); font-size: 9px; }
.nbt-item-shop-price { margin-top: auto; color: var(--blue-ink); font-size: 12px; font-weight: 700; }
.nbt-item-owned { color: var(--muted); font-size: 10px; font-weight: 700; }
.nbt-item-shop-submit { display: flex; flex-wrap: wrap; justify-content: center; gap: 9px; margin-top: 17px; }
.nbt-item-trade-form { display: grid; grid-template-columns: minmax(0, 1fr) minmax(0, 1fr); gap: 10px 14px; max-width: 650px; margin: 0 auto; padding: 20px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); }
.nbt-item-trade-form label { align-self: end; color: var(--ink-soft); font-size: 12px; font-weight: 600; }
.nbt-item-trade-form input,
.nbt-item-trade-form select { width: 100%; min-width: 0; padding: 10px 11px; }
.nbt-item-trade-form button,
.nbt-item-trade-form > a { grid-column: span 1; text-align: center; }
.nbt-result.info { border: 1px solid var(--border); background: var(--surface-soft); color: var(--ink-soft); }

@media (max-width: 760px) {
  .nbt-pet-adventure-grid { grid-template-columns: minmax(0, 1fr); }
  .nbt-pet-spotlight { grid-template-columns: 140px minmax(0, 1fr); gap: 15px; }
  .nbt-pet-spotlight-image { min-height: 145px; }
  .nbt-pet-spotlight-image img { height: 135px; }
  .nbt-care-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nbt-item-trade-form { grid-template-columns: minmax(0, 1fr); }
  .nbt-item-trade-form > * { grid-column: 1 !important; }
}
@media (max-width: 560px) {
  .nbt-pet-page { gap: 13px; }
  .nbt-pet-page-head { align-items: flex-start; flex-direction: column; }
  .nbt-pet-wallet { width: 100%; flex-direction: row; flex-wrap: wrap; justify-content: space-between; }
  .nbt-pet-callout { align-items: flex-start; flex-direction: column; }
  .nbt-adoption-controls { grid-template-columns: minmax(0, 1fr); }
  .nbt-adoption-controls label,
  .nbt-adoption-controls input,
  .nbt-adoption-controls button { grid-column: 1; grid-row: auto; }
  .nbt-adoption-controls button { width: 100%; white-space: normal; }
  .nbt-pet-spotlight { grid-template-columns: minmax(0, 1fr); padding: 15px; }
  .nbt-pet-spotlight-image { min-height: 135px; }
  .nbt-pet-spotlight-image img { height: 125px; }
  .nbt-pet-name-line { align-items: flex-start; }
  .nbt-pet-name-line h2 { font-size: 21px; }
  .nbt-pet-mood { font-size: 9px; }
  .nbt-pet-quest { align-items: flex-start; flex-wrap: wrap; }
  .nbt-pet-quest-copy { flex-basis: calc(100% - 55px); }
  .nbt-pet-quest form,
  .nbt-pet-quest form button { width: 100%; }
  .nbt-pet-done { margin-left: 51px; }
  .nbt-pet-shortcuts > a { flex: 1 1 100%; text-align: center; }
  .nbt-pet-item { flex-wrap: wrap; }
  .nbt-pet-item-actions { width: 100%; }
  .nbt-pet-item-actions form,
  .nbt-pet-item-actions button { width: 100%; }
  .nbt-care-pet-strip,
  .nbt-arena-own { align-items: flex-start; flex-wrap: wrap; }
  .nbt-care-pet-strip > .btn { width: 100%; text-align: center; }
  .nbt-arena-own .nbt-arena-quota { margin-left: auto; }
  .nbt-arena-warning .btn { width: 100%; text-align: center; }
  .nbt-arena-history-row { grid-template-columns: minmax(0, 1fr) auto; }
  .nbt-arena-history-row time { grid-column: 1 / -1; }
}

/* Groups page (groups.php) */
.nbt-groups-page {
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 1160px;
  margin: 0 auto;
  text-align: left;
}
.nbt-groups-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 18px;
  padding: 8px 2px;
}
.nbt-groups-head h1 {
  margin: 0 0 5px;
  text-align: left;
}
.nbt-groups-head p:not(.nbt-pet-eyebrow) {
  margin: 0;
  color: var(--muted);
  font-size: 14px;
  line-height: 1.7;
}
.nbt-groups-stats {
  display: flex;
  flex: 0 0 auto;
  gap: 10px;
}
.nbt-groups-stats > div {
  display: flex;
  flex-direction: column;
  gap: 2px;
  min-width: 92px;
  padding: 11px 15px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-soft);
}
.nbt-groups-stats span { color: var(--muted); font-size: 10px; }
.nbt-groups-stats strong { color: var(--blue-ink); font-size: 20px; }
.nbt-groups-admin {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 11px 15px;
  border: 1px dashed var(--border-strong);
  border-radius: 12px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 12px;
}
.nbt-groups-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(300px, 1fr));
  gap: 16px;
}
.nbt-group-card {
  display: flex;
  flex-direction: column;
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease;
}
.nbt-group-card:hover {
  transform: translateY(-3px);
  border-color: var(--blue);
  box-shadow: var(--shadow);
}
.nbt-group-cover {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 138px;
  padding: 12px;
  background-color: var(--surface-soft);
  background-size: cover;
  background-position: center;
}
.nbt-group-cover::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, transparent 40%, rgba(15, 23, 42, .55));
}
.nbt-group-cover-fallback {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -60%);
  color: var(--blue-soft);
  font-size: 54px;
  font-weight: 800;
}
.nbt-group-count {
  position: relative;
  z-index: 1;
  padding: 4px 10px;
  border-radius: 999px;
  background: rgba(15, 23, 42, .55);
  color: #fff;
  font-size: 11px;
  font-weight: 700;
  backdrop-filter: blur(2px);
}
.nbt-group-body {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 12px;
  padding: 15px;
}
.nbt-group-body h2 {
  margin: 0;
  padding: 0;
  border: 0;
  background: none;
  color: var(--ink);
  font-size: 17px;
  text-align: left;
  overflow-wrap: anywhere;
}
.nbt-group-members {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}
.nbt-group-member {
  display: inline-flex;
  align-items: center;
  gap: 6px;
  max-width: 100%;
  padding: 3px 9px 3px 3px;
  border: 1px solid var(--border);
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--ink-soft) !important;
  font-size: 11px;
  text-decoration: none !important;
}
.nbt-group-member:hover {
  border-color: var(--blue);
  background: var(--blue-soft);
}
.nbt-group-avatar {
  position: relative;
  display: grid;
  flex: 0 0 22px;
  place-items: center;
  width: 22px;
  height: 22px;
  overflow: hidden;
  border-radius: 50%;
  background: var(--blue);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
}
.nbt-group-avatar img {
  position: absolute;
  z-index: 1;
  inset: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  border-radius: inherit;
}
.nbt-group-avatar-initial { position: relative; z-index: 0; }
.nbt-group-username {
  max-width: 120px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nbt-group-more {
  display: inline-flex;
  align-items: center;
  padding: 3px 10px;
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--muted);
  font-size: 11px;
  font-weight: 600;
}
.nbt-group-none {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
}
.nbt-group-card.is-mine {
  border-color: var(--blue);
}
.nbt-group-cover {
  text-decoration: none !important;
}
.nbt-group-cover-fallback {
  pointer-events: none;
}
.nbt-group-mine {
  position: absolute;
  top: 12px;
  right: 12px;
  z-index: 1;
  padding: 4px 10px;
  border-radius: 999px;
  background: var(--blue);
  color: #fff;
  font-size: 10px;
  font-weight: 700;
}
.nbt-group-body h2 a {
  color: var(--ink) !important;
  text-decoration: none !important;
}
.nbt-group-body h2 a:hover {
  color: var(--blue-ink) !important;
}
.nbt-group-card-foot {
  margin-top: auto;
  padding-top: 4px;
}
.nbt-group-card-foot .btn {
  width: 100%;
  padding: 9px 14px;
  font-size: 13px;
}
.nbt-group-crumb {
  font-size: 13px;
}
.nbt-group-crumb a {
  font-weight: 600;
}
.nbt-group-hero {
  display: grid;
  grid-template-columns: minmax(0, 300px) minmax(0, 1fr);
  gap: 20px;
  align-items: stretch;
  overflow: hidden;
  padding: 0;
  border: 1px solid var(--border);
  border-radius: 18px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-group-hero-cover {
  position: relative;
  display: flex;
  align-items: flex-end;
  min-height: 200px;
  background-color: var(--surface-soft);
  background-size: cover;
  background-position: center;
}
.nbt-group-hero-info {
  display: flex;
  flex-direction: column;
  gap: 9px;
  align-items: flex-start;
  justify-content: center;
  padding: 24px 24px 24px 4px;
}
.nbt-group-hero-info h1 {
  margin: 0;
  text-align: left;
  overflow-wrap: anywhere;
}
.nbt-group-hero-actions {
  display: flex;
  flex-wrap: wrap;
  align-items: center;
  gap: 10px;
  margin-top: 6px;
}
.nbt-group-hero-actions form { margin: 0; }
.nbt-group-badge {
  padding: 6px 12px;
  border-radius: 999px;
  background: var(--surface-soft);
  color: var(--green, #15803d);
  font-size: 12px;
  font-weight: 700;
}
.nbt-group-hint {
  color: var(--muted);
  font-size: 11px;
}
.nbt-group-roster {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(200px, 1fr));
  gap: 9px;
}
.nbt-group-roster-item {
  display: flex;
  align-items: center;
  gap: 10px;
  min-width: 0;
  padding: 9px 11px;
  border: 1px solid var(--border);
  border-radius: 12px;
  background: var(--surface);
  color: var(--ink) !important;
  text-decoration: none !important;
}
.nbt-group-roster-item:hover {
  border-color: var(--blue);
  background: var(--blue-soft);
}
.nbt-group-roster-item .nbt-group-avatar {
  flex: 0 0 34px;
  width: 34px;
  height: 34px;
  font-size: 14px;
}
.nbt-group-roster-text {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 1px;
  min-width: 0;
}
.nbt-group-roster-text b {
  font-size: 13px;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}
.nbt-group-roster-text small {
  color: var(--muted);
  font-size: 10px;
}
.nbt-group-you {
  flex: 0 0 auto;
  padding: 2px 8px;
  border-radius: 999px;
  background: var(--blue);
  color: #fff;
  font-size: 9px;
  font-weight: 700;
}
@media (max-width: 760px) {
  .nbt-group-hero { grid-template-columns: minmax(0, 1fr); }
  .nbt-group-hero-cover { min-height: 168px; }
  .nbt-group-hero-info { padding: 4px 18px 20px; }
}
@media (max-width: 620px) {
  .nbt-groups-head {
    align-items: flex-start;
    flex-direction: column;
  }
  .nbt-groups-stats { width: 100%; }
  .nbt-groups-stats > div { flex: 1 1 0; }
  .nbt-groups-grid { grid-template-columns: minmax(0, 1fr); }
  .nbt-groups-admin { align-items: flex-start; flex-direction: column; }
  .nbt-group-username { max-width: 96px; }
}

/* Group management (creategroups.php) */
.nbt-group-form-card .nbt-card-head h2 { margin: 0; }
.nbt-group-form {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  gap: 8px 16px;
  align-items: start;
}
.nbt-group-form label {
  color: var(--ink-soft);
  font-size: 12px;
  font-weight: 700;
}
.nbt-group-form label small {
  color: var(--muted);
  font-weight: 500;
}
.nbt-group-form input {
  width: 100%;
  min-width: 0;
  padding: 10px 12px;
  font-size: 14px;
}
.nbt-group-form-actions {
  grid-column: 1 / -1;
  display: flex;
  justify-content: flex-end;
  margin-top: 4px;
}
.nbt-group-admin-grid {
  display: grid;
  gap: 11px;
}
.nbt-group-admin-card {
  display: flex;
  align-items: center;
  gap: 13px;
  min-width: 0;
  padding: 11px 13px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface);
}
.nbt-group-admin-card.is-editing {
  border-color: var(--blue);
  box-shadow: 0 0 0 3px var(--blue-soft);
}
.nbt-group-admin-thumb {
  display: grid;
  flex: 0 0 54px;
  place-items: center;
  width: 54px;
  height: 54px;
  overflow: hidden;
  border-radius: 11px;
  background: var(--surface-soft);
  font-size: 22px;
}
.nbt-group-admin-thumb img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}
.nbt-group-admin-info {
  display: flex;
  flex: 1 1 auto;
  flex-direction: column;
  gap: 3px;
  min-width: 0;
}
.nbt-group-admin-info strong {
  color: var(--ink);
  font-size: 14px;
  overflow-wrap: anywhere;
}
.nbt-group-admin-meta {
  color: var(--muted);
  font-size: 11px;
}
.nbt-group-admin-actions {
  display: flex;
  flex: 0 0 auto;
  align-items: center;
  gap: 8px;
}
.nbt-group-admin-actions form { margin: 0; }
.nbt-group-admin-actions .btn {
  min-width: 0;
  padding: 8px 14px;
  font-size: 12px;
}
@media (max-width: 620px) {
  .nbt-group-form { grid-template-columns: minmax(0, 1fr); }
  .nbt-group-form-actions { justify-content: stretch; }
  .nbt-group-form-actions .btn { width: 100%; }
  .nbt-group-admin-card { flex-wrap: wrap; }
  .nbt-group-admin-info { flex-basis: calc(100% - 67px); }
  .nbt-group-admin-actions { width: 100%; }
  .nbt-group-admin-actions > a,
  .nbt-group-admin-actions form,
  .nbt-group-admin-actions form .btn { flex: 1 1 0; }
  .nbt-group-admin-actions .btn { width: 100%; }
}

/* Group community feed and discussions */
.nbt-group-summary { display: flex; flex-wrap: wrap; gap: 7px; }
.nbt-group-tabs {
  display: flex;
  gap: 6px;
  padding: 5px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-soft);
}
.nbt-group-tabs a {
  flex: 0 0 auto;
  padding: 9px 15px;
  border-radius: 9px;
  color: var(--muted) !important;
  font-size: 12px;
  font-weight: 700;
  text-decoration: none !important;
}
.nbt-group-tabs a.is-active { background: var(--surface); color: var(--blue-ink) !important; box-shadow: var(--shadow-sm); }
.nbt-group-composer {
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-group-composer-intro { display: flex; align-items: center; gap: 10px; margin-bottom: 14px; }
.nbt-group-composer-intro > div { display: flex; flex-direction: column; gap: 3px; }
.nbt-group-composer-intro strong { color: var(--ink); font-size: 13px; }
.nbt-group-composer-intro span:not(.nbt-group-avatar) { color: var(--muted); font-size: 11px; }
.nbt-group-composer form,
.nbt-group-comment-form { display: flex; flex-direction: column; gap: 8px; margin: 0; }
.nbt-group-composer label,
.nbt-group-comment-form label { color: var(--ink-soft); font-size: 11px; font-weight: 700; }
.nbt-group-composer input,
.nbt-group-composer textarea,
.nbt-group-comment-form textarea { width: 100%; min-width: 0; padding: 10px 12px; }
.nbt-group-composer textarea,
.nbt-group-comment-form textarea { min-height: 92px; resize: vertical; line-height: 1.7; }
.nbt-group-composer-foot { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-top: 3px; }
.nbt-group-composer-foot small { color: var(--muted); font-size: 10px; line-height: 1.6; }
.nbt-group-feed-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.nbt-group-feed-head h2 { margin: 0; color: var(--ink); font-size: 17px; text-align: left; }
.nbt-group-feed-head span { color: var(--muted); font-size: 11px; }
.nbt-group-feed { display: flex; flex-direction: column; gap: 13px; }
.nbt-group-post {
  min-width: 0;
  padding: 17px 19px 12px;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-group-post-focus { padding: 20px; }
.nbt-group-post-head { display: flex; align-items: center; gap: 10px; min-width: 0; }
.nbt-group-avatar-large { flex-basis: 38px; width: 38px; height: 38px; font-size: 14px; }
.nbt-group-post-head > div { display: flex; flex: 1 1 auto; flex-direction: column; gap: 2px; min-width: 0; }
.nbt-group-post-head > div > a { color: var(--ink) !important; font-size: 12px; font-weight: 700; text-decoration: none !important; }
.nbt-group-post-head small { color: var(--muted); font-size: 10px; }
.nbt-group-post-head form { flex: 0 0 auto; margin: 0; }
.nbt-group-delete { padding: 5px 8px; border: 0; border-radius: 7px; background: transparent; color: var(--muted); font-size: 10px; cursor: pointer; }
.nbt-group-delete:hover { background: #fef2f2; color: var(--red); }
.nbt-group-post-link { display: block; margin-top: 14px; color: inherit !important; text-decoration: none !important; }
.nbt-group-post-link h3,
.nbt-group-post > h2 { margin: 0 0 8px; padding: 0; border: 0; background: none; color: var(--ink); font-size: 16px; line-height: 1.5; text-align: left; overflow-wrap: anywhere; }
.nbt-group-post-link:hover h3 { color: var(--blue-ink); }
.nbt-group-post-body { color: var(--ink-soft); font-size: 13px; line-height: 1.85; white-space: normal; overflow-wrap: anywhere; }
.nbt-group-post-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-top: 14px; padding-top: 10px; border-top: 1px solid var(--border); }
.nbt-group-post-actions form { margin: 0; }
.nbt-group-post-actions a,
.nbt-group-reaction { color: var(--muted) !important; font-size: 11px; text-decoration: none !important; }
.nbt-group-post-actions a:hover { color: var(--blue-ink) !important; }
.nbt-group-reaction { padding: 0; border: 0; background: transparent; cursor: pointer; }
.nbt-group-reaction.is-liked { color: var(--red) !important; font-weight: 700; }
.nbt-group-join-prompt {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: 13px;
  background: var(--surface-soft);
  color: var(--ink-soft);
  font-size: 12px;
}
.nbt-group-empty-feed { display: flex; align-items: center; flex-direction: column; gap: 5px; padding: 35px 20px; border: 1px dashed var(--border-strong); border-radius: 15px; background: var(--surface-soft); text-align: center; }
.nbt-group-empty-feed > span { font-size: 30px; }
.nbt-group-empty-feed strong { color: var(--ink); font-size: 14px; }
.nbt-group-empty-feed p { margin: 0; color: var(--muted); font-size: 12px; }
.nbt-group-pagination { display: flex; align-items: center; justify-content: center; gap: 14px; }
.nbt-group-pagination > span { color: var(--muted); font-size: 11px; }
.nbt-group-discussion-head { display: flex; align-items: center; justify-content: space-between; gap: 10px; color: var(--muted); font-size: 11px; }
.nbt-group-discussion-head a { font-weight: 700; }
.nbt-group-comments { display: flex; flex-direction: column; gap: 10px; padding: 17px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); }
.nbt-group-comments > h2 { margin: 0 0 2px; padding: 0; border: 0; background: none; color: var(--ink); font-size: 15px; text-align: left; }
.nbt-group-comment { display: flex; align-items: flex-start; gap: 9px; padding: 10px 0; border-bottom: 1px solid var(--border); }
.nbt-group-comment-content { flex: 1 1 auto; min-width: 0; color: var(--ink-soft); font-size: 12px; line-height: 1.75; overflow-wrap: anywhere; }
.nbt-group-comment-content > header { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin-bottom: 3px; }
.nbt-group-comment-content > header a { color: var(--ink) !important; font-weight: 700; text-decoration: none !important; }
.nbt-group-comment-content time { color: var(--muted); font-size: 9px; }
.nbt-group-comment > form { flex: 0 0 auto; margin: 0; }
.nbt-group-comment-form { padding-top: 12px; }
.nbt-group-comment-form button { align-self: flex-end; }
.nbt-group-no-comments { margin: 0; color: var(--muted); font-size: 12px; }
.nbt-group-members-section .nbt-card-head h2 { margin: 0; text-align: left; }
.nbt-group-rules { display: flex; flex-direction: column; gap: 4px; padding: 12px 15px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); color: var(--muted); font-size: 11px; line-height: 1.7; }
.nbt-group-rules strong { color: var(--ink-soft); font-size: 12px; }
.nbt-group-locked { display: flex; flex-direction: column; align-items: center; gap: 8px; padding: 40px 22px; border: 1px dashed var(--border-strong); border-radius: 16px; background: var(--surface-soft); text-align: center; }
.nbt-group-locked-icon { display: grid; place-items: center; width: 62px; height: 62px; border-radius: 50%; background: var(--surface); font-size: 28px; }
.nbt-group-locked h2 { margin: 0; padding: 0; border: 0; background: none; color: var(--ink); font-size: 17px; text-align: center; }
.nbt-group-locked p { max-width: 520px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.8; }
.nbt-group-locked-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 6px; }

@media (max-width: 620px) {
  .nbt-group-composer { padding: 14px; }
  .nbt-group-composer-foot { align-items: stretch; flex-direction: column; }
  .nbt-group-composer-foot button { width: 100%; }
  .nbt-group-post { padding: 14px 13px 10px; }
  .nbt-group-post-focus { padding: 15px 13px; }
  .nbt-group-post-actions { gap: 10px; }
  .nbt-group-join-prompt { align-items: stretch; flex-direction: column; }
  .nbt-group-join-prompt .btn { text-align: center; }
  .nbt-group-discussion-head { align-items: flex-start; flex-direction: column; }
  .nbt-group-comment-form button { align-self: stretch; }
  .nbt-group-pagination { gap: 8px; }
}

/* Pok Deng table */
.nbt-pokdeng { display: flex; flex-direction: column; gap: 16px; max-width: 860px; margin: 0 auto; text-align: left; }
.nbt-pokdeng-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; }
.nbt-pokdeng-head h1 { margin: 0 0 5px; text-align: left; }
.nbt-pokdeng-head p:not(.nbt-pet-eyebrow) { margin: 0; color: var(--muted); font-size: 13px; }
.nbt-pokdeng-rules { display: flex; flex-direction: column; gap: 5px; padding: 13px 16px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); color: var(--muted); font-size: 11px; line-height: 1.65; }
.nbt-pokdeng-rules strong { color: var(--ink); font-size: 12px; }
.nbt-pd-table { display: flex; flex-direction: column; gap: 20px; padding: clamp(20px, 5vw, 38px); border: 1px solid #0b573d; border-radius: 20px; background: radial-gradient(ellipse at 50% 35%, #14734f, #07543a 70%, #06452f); box-shadow: 0 18px 40px rgba(3, 33, 24, .25); color: #fff; }
.nbt-pd-stake { align-self: center; padding: 7px 14px; border: 1px solid rgba(255,255,255,.24); border-radius: 999px; background: rgba(0,0,0,.15); color: rgba(255,255,255,.82); font-size: 12px; }
.nbt-pd-stake strong { color: #fff; }
.nbt-pd-hand { display: flex; flex-direction: column; align-items: center; gap: 10px; }
.nbt-pd-hand-label { display: flex; align-items: center; gap: 10px; color: rgba(255,255,255,.76); font-size: 12px; }
.nbt-pd-hand-label b { color: #fff; font-size: 14px; }
.nbt-pd-cards { display: flex; justify-content: center; gap: 9px; min-height: 104px; }
.nbt-pd-card { position: relative; display: flex; flex: 0 0 70px; flex-direction: column; justify-content: space-between; width: 70px; height: 100px; padding: 8px; border: 1px solid #d8deea; border-radius: 10px; background: linear-gradient(145deg, #fff, #f1f4f9); box-shadow: 0 6px 13px rgba(0,0,0,.2); color: #152238; }
.nbt-pd-card small { font-size: 13px; font-weight: 700; }
.nbt-pd-card b { align-self: center; font-size: 31px; line-height: 1; }
.nbt-pd-card i { align-self: flex-end; font-size: 19px; font-style: normal; }
.nbt-pd-card.red { color: #d32f45; }
.nbt-pd-card-back { display: grid; place-items: center; border: 2px solid #f4d47c; background: repeating-linear-gradient(45deg, #8e2435, #8e2435 5px, #a52d40 5px, #a52d40 10px); color: #fff; }
.nbt-pd-card-back b { font-size: 26px; }
.nbt-pd-divider { display: flex; align-items: center; gap: 12px; color: rgba(255,255,255,.55); font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-pd-divider::before,
.nbt-pd-divider::after { content: ""; flex: 1 1 auto; height: 1px; background: rgba(255,255,255,.18); }
.nbt-pd-controls { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 3px; }
.nbt-pd-controls form { margin: 0; }
.nbt-pd-controls .btn { min-width: 170px; text-align: center; }
.nbt-pd-result { gap: 18px; }
.nbt-pd-result.win { border-color: rgba(255,255,255,.25); }
.nbt-pd-outcome { display: flex; flex-direction: column; align-items: center; gap: 5px; text-align: center; }
.nbt-pd-outcome strong { font-size: 20px; }
.nbt-pd-outcome span { color: rgba(255,255,255,.82); font-size: 14px; }
.nbt-pd-outcome small { color: #f4d47c; font-size: 11px; }
.nbt-pd-result-hands { display: grid; grid-template-columns: minmax(0,1fr) 44px minmax(0,1fr); align-items: center; gap: 8px; }
.nbt-pd-result-hands .nbt-pd-divider { justify-content: center; }
.nbt-pd-start { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 18px 20px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow-sm); }
.nbt-pd-start h2 { margin: 0 0 4px; padding: 0; border: 0; background: none; color: var(--ink); font-size: 16px; text-align: left; }
.nbt-pd-start p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.6; }
.nbt-pd-start form { flex: 0 0 280px; margin: 0; }
.nbt-pd-start label { display: block; margin-bottom: 5px; color: var(--ink-soft); font-size: 11px; font-weight: 700; }
.nbt-pd-bet-controls { display: flex; gap: 7px; }
.nbt-pd-bet-controls input { width: 100%; min-width: 0; padding: 9px 11px; }
.nbt-pd-bet-controls button { flex: 0 0 auto; }
.nbt-pd-bet-controls button:disabled { opacity: .55; cursor: not-allowed; }
.nbt-pokdeng-back { margin: 0; text-align: center; font-size: 12px; }
.nbt-pokdeng-back a { font-weight: 600; }
.nbt-casa-challenge { margin: 0; }
.nbt-casa-challenge .btn { padding: 7px 12px; font-size: 11px; }
@media (max-width: 620px) {
  .nbt-pokdeng-head { align-items: flex-start; flex-direction: column; }
  .nbt-pokdeng-head .nbt-pet-wallet { width: 100%; }
  .nbt-pd-table { padding: 18px 12px; border-radius: 15px; }
  .nbt-pd-card { flex-basis: 58px; width: 58px; height: 84px; padding: 6px; }
  .nbt-pd-card b { font-size: 25px; }
  .nbt-pd-card i { font-size: 16px; }
  .nbt-pd-cards { min-height: 88px; gap: 6px; }
  .nbt-pd-controls { flex-direction: column; }
  .nbt-pd-controls form,
  .nbt-pd-controls .btn { width: 100%; }
  .nbt-pd-result-hands { grid-template-columns: minmax(0,1fr); gap: 14px; }
  .nbt-pd-result-hands .nbt-pd-divider { width: 100%; }
  .nbt-pd-start { align-items: stretch; flex-direction: column; }
  .nbt-pd-start form { flex-basis: auto; }
}
.nbt-pd-balances { display: flex; flex: 0 0 auto; flex-direction: column; gap: 5px; padding: 11px 15px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); color: var(--blue-ink); font-size: 12px; font-weight: 700; }
.nbt-pd-backbar { display: flex; width: 100%; margin-bottom: 2px; }
.nbt-pd-backbtn {
  width: 100%;
  min-width: 0;
  padding: 14px 26px;
  font-size: 16px;
  font-weight: 800;
  letter-spacing: .01em;
  border-radius: 14px;
  box-shadow: var(--shadow);
}
.nbt-pd-room-head { display: flex; align-items: center; justify-content: space-between; gap: 16px; }
.nbt-pd-room-head h2 { margin: 0; padding: 0; border: 0; background: none; color: var(--ink); font-size: 19px; text-align: left; }
.nbt-pd-room-head > div:first-child > a { font-size: 11px; font-weight: 700; }
.nbt-pd-room-card { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 12px 14px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); color: var(--ink) !important; text-decoration: none !important; transition: border-color .15s ease, transform .15s ease; }
.nbt-pd-room-card:hover { transform: translateY(-2px); border-color: var(--blue); }
.nbt-pd-room-card.is-active { border-color: var(--blue); background: var(--blue-soft); }
.nbt-pd-room-icon { display: grid; flex: 0 0 42px; place-items: center; width: 42px; height: 42px; border-radius: 11px; background: var(--surface-soft); font-size: 22px; }
.nbt-pd-room-info { display: flex; flex: 1 1 auto; flex-direction: column; gap: 3px; min-width: 0; }
.nbt-pd-room-info b { color: var(--ink); font-size: 12px; overflow-wrap: anywhere; }
.nbt-pd-room-info small { color: var(--muted); font-size: 10px; }
.nbt-pd-room-open { flex: 0 0 auto; color: var(--blue-ink); font-size: 11px; font-weight: 700; }
.nbt-pd-section { display: flex; flex-direction: column; gap: 10px; }
.nbt-pd-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.nbt-pd-section-head h2 { margin: 0; color: var(--ink); font-size: 16px; text-align: left; }
.nbt-pd-section-head > span { color: var(--muted); font-size: 10px; }
.nbt-pd-room-list { display: flex; flex-direction: column; gap: 8px; }
.nbt-pd-empty { padding: 19px; border: 1px dashed var(--border-strong); border-radius: 13px; background: var(--surface-soft); color: var(--muted); font-size: 12px; text-align: center; }
.nbt-pd-start > form select { width: 100%; margin-bottom: 9px; padding: 9px 10px; }
.nbt-pd-concede-form { display: flex; justify-content: center; margin: 0; }
.nbt-pd-concede { padding: 6px 10px; border: 0; border-radius: 8px; background: rgba(255,255,255,.1); color: rgba(255,255,255,.75); font-size: 10px; cursor: pointer; }
.nbt-pd-concede:hover { background: rgba(255,255,255,.2); color: #fff; }
.nbt-pd-waiting { align-self: center; padding: 8px 12px; border-radius: 999px; background: rgba(0,0,0,.15); color: rgba(255,255,255,.8); font-size: 11px; }
.nbt-pd-help { margin: 0; color: rgba(255,255,255,.72); font-size: 11px; line-height: 1.7; text-align: center; }
.nbt-pd-countdown { display: flex; align-items: center; justify-content: center; gap: 9px; align-self: center; padding: 9px 16px; border: 1px solid rgba(244,212,124,.5); border-radius: 999px; background: rgba(0,0,0,.22); color: rgba(255,255,255,.85); font-size: 12px; }
.nbt-pd-countdown b { min-width: 48px; color: #f4d47c; font-size: 17px; font-variant-numeric: tabular-nums; text-align: center; }
.nbt-pd-countdown.is-expired { border-color: rgba(255,120,120,.6); }
.nbt-pd-countdown.is-expired b { color: #ff8a8a; }
.nbt-pd-result.draw { background: linear-gradient(145deg, #26556c, #163c51); }
@media (max-width: 620px) {
  .nbt-pd-balances { width: 100%; }
  .nbt-pd-room-head { align-items: flex-start; flex-direction: column; }
  .nbt-pd-room-card { flex-wrap: wrap; }
  .nbt-pd-room-info { flex-basis: calc(100% - 54px); }
  .nbt-pd-room-open { margin-left: 54px; }
}

/* Premium casino floor: polished, clear stakes, no urgency tricks */
.nbt-casino-floor {
  --casino-ink: #eff4ec;
  --casino-muted: #aab7ac;
  --casino-gold: #d7b86b;
  --casino-line: rgba(215,184,107,.24);
  display: flex;
  flex-direction: column;
  gap: 22px;
  max-width: 1120px;
  margin: 0 auto;
  text-align: left;
}
.nbt-casino-hero {
  position: relative;
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  align-items: center;
  gap: 25px;
  overflow: hidden;
  padding: clamp(24px, 5vw, 48px);
  border: 1px solid var(--casino-line);
  border-radius: 22px;
  background: radial-gradient(ellipse at 80% 0%, rgba(215,184,107,.17), transparent 45%), linear-gradient(135deg, #13261f, #0b1714 72%);
  box-shadow: 0 22px 55px rgba(4,18,13,.18);
}
.nbt-casino-hero::after {
  content: "";
  position: absolute;
  right: 26%;
  top: -65px;
  width: 1px;
  height: 280px;
  transform: rotate(34deg);
  background: linear-gradient(transparent, rgba(215,184,107,.27), transparent);
  pointer-events: none;
}
.nbt-casino-hero-copy,
.nbt-casino-wallet { position: relative; z-index: 1; }
.nbt-casino-kicker { margin: 0 0 8px; color: var(--casino-gold); font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-casino-hero h1 { margin: 0 0 9px; color: var(--casino-ink); font-family: Georgia, "Times New Roman", serif; font-size: clamp(31px, 5vw, 46px); letter-spacing: .02em; text-align: left; }
.nbt-casino-hero-copy > p:last-child { max-width: 540px; margin: 0; color: var(--casino-muted); font-size: 14px; line-height: 1.8; }
.nbt-casino-wallet { display: grid; grid-template-columns: repeat(2, minmax(135px,1fr)); gap: 9px; }
.nbt-casino-wallet > div { display: flex; flex-direction: column; gap: 6px; min-width: 0; padding: 13px 15px; border: 1px solid rgba(255,255,255,.12); border-radius: 13px; background: rgba(255,255,255,.055); }
.nbt-casino-wallet span { color: var(--casino-muted); font-size: 10px; }
.nbt-casino-wallet strong { color: #f8f0da; font-size: 16px; white-space: nowrap; }
.nbt-casino-wallet small { color: var(--casino-gold); font-size: 10px; }
.nbt-casino-responsible { display: flex; align-items: flex-start; gap: 11px; padding: 13px 16px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); }
.nbt-casino-responsible-mark { display: grid; flex: 0 0 22px; place-items: center; width: 22px; height: 22px; border: 1px solid var(--border-strong); border-radius: 50%; color: var(--blue-ink); font-family: Georgia,serif; font-size: 14px; font-weight: 700; }
.nbt-casino-responsible p { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.7; }
.nbt-casino-responsible strong { color: var(--ink); }
.nbt-casino-section { display: flex; flex-direction: column; gap: 13px; }
.nbt-casino-section-head { display: flex; align-items: flex-end; justify-content: space-between; gap: 12px; }
.nbt-casino-section-head .nbt-casino-kicker { margin-bottom: 3px; color: var(--blue-ink); }
.nbt-casino-section-head h2 { margin: 0; color: var(--ink); font-family: Georgia,"Times New Roman",serif; font-size: 22px; text-align: left; }
.nbt-casino-section-head > span { color: var(--muted); font-size: 11px; }
.nbt-casino-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 14px; }
.nbt-casino-card {
  position: relative;
  display: flex;
  min-height: 218px;
  flex-direction: column;
  gap: 10px;
  overflow: hidden;
  padding: 19px 20px 16px;
  border: 1px solid var(--border);
  border-radius: 16px;
  background: linear-gradient(145deg, var(--surface), var(--surface-soft));
  color: var(--ink) !important;
  text-decoration: none !important;
  transition: transform .16s ease, border-color .16s ease, box-shadow .16s ease;
}
.nbt-casino-card:hover { transform: translateY(-2px); border-color: #c6a65d; box-shadow: var(--shadow); }
.nbt-casino-card-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; }
.nbt-casino-mark { display: grid; place-items: center; width: 44px; height: 44px; border: 1px solid var(--casino-line); border-radius: 13px; background: #15271f; color: var(--casino-gold); font-family: Georgia,serif; font-size: 19px; font-weight: 700; }
.nbt-casino-type { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .15em; }
.nbt-casino-card h3 { margin: 0; color: var(--ink); font-family: Georgia,"Times New Roman",serif; font-size: 20px; }
.nbt-casino-card > p { min-height: 40px; margin: 0; color: var(--muted); font-size: 12px; line-height: 1.7; }
.nbt-casino-terms { display: inline-flex; align-self: flex-start; padding: 5px 9px; border: 1px solid var(--border); border-radius: 7px; background: var(--surface); color: var(--ink-soft); font-size: 10px; }
.nbt-casino-card-cta { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: auto; padding-top: 11px; border-top: 1px solid var(--border); color: var(--blue-ink); font-size: 12px; font-weight: 700; }
.nbt-casino-card-cta b { color: #b08b36; font-size: 16px; }
.nbt-casino-footer { display: flex; justify-content: center; gap: 7px; padding: 9px; color: var(--muted); font-size: 11px; }
.nbt-casino-footer a { font-weight: 700; }

.nbt-casino-game,
.nbt-pokdeng { --casino-gold: #d7b86b; --casino-line: rgba(215,184,107,.24); }
.nbt-casino-game { display: flex; flex-direction: column; gap: 15px; max-width: 1000px; margin: 0 auto; text-align: left; }
.nbt-casino-game-top { display: flex; align-items: center; justify-content: space-between; gap: 12px; color: var(--muted); font-size: 10px; font-weight: 800; letter-spacing: .13em; }
.nbt-casino-game-top a { color: var(--blue-ink); font-size: 12px; letter-spacing: 0; }
.nbt-casino-game-head { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 23px 26px; border: 1px solid var(--casino-line); border-radius: 17px; background: radial-gradient(ellipse at 85% 0%, rgba(215,184,107,.14), transparent 42%), linear-gradient(135deg, #13261f, #0b1714); }
.nbt-casino-game-head .nbt-casino-kicker { color: var(--casino-gold); }
.nbt-casino-game-head h1 { margin: 0 0 5px; color: #f4f3ea; font-family: Georgia,"Times New Roman",serif; font-size: 27px; text-align: left; }
.nbt-casino-game-head p:not(.nbt-casino-kicker) { margin: 0; color: #b4c0b6; font-size: 12px; line-height: 1.7; }
.nbt-casino-game-head .nbt-pet-wallet { flex: 0 0 auto; }
.nbt-casino-game-note { display: flex; flex-direction: column; gap: 4px; padding: 12px 15px; border: 1px solid var(--casino-line); border-radius: 12px; background: #f9f6ec; color: var(--muted); font-size: 11px; line-height: 1.7; }
.nbt-casino-game-note strong { color: #59461f; font-size: 12px; }
.nbt-lucky-page .nbt-lucky { max-width: 620px; margin: 0 auto; }
.nbt-lucky-page .nbt-lucky-box { border-color: var(--casino-line); background: radial-gradient(ellipse at 50% 0%, rgba(215,184,107,.16), transparent 55%), linear-gradient(145deg, #13261f, #0b1714); color: #f4f3ea; }
.nbt-lucky-page .nbt-lucky-title { color: #f4f3ea; font-family: Georgia,"Times New Roman",serif; font-size: 22px; }
.nbt-lucky-page .nbt-lucky-cost { color: #b4c0b6; line-height: 1.7; }
.nbt-lucky-page .nbt-lucky-box button { border: 1px solid #e5cc88; background: linear-gradient(180deg, #e0c577, #b08b36); color: #1c231a; font-weight: 800; }
.nbt-lucky-page .nbt-lucky-box button:disabled { opacity: .45; cursor: not-allowed; }
.nbt-ticket-casino-page .nbt-ticket-hero { border-radius: 16px; }
.nbt-casa-game .nbt-balance-row { margin-top: 0; }
.nbt-casa-game .nbt-panel { border-radius: 15px; }
.nbt-casa-game .nbt-casa-bet button { min-width: 150px; }
.nbt-pokdeng-head { padding: 22px 24px; border: 1px solid var(--casino-line); border-radius: 17px; background: radial-gradient(ellipse at 85% 0%, rgba(215,184,107,.14), transparent 42%), linear-gradient(135deg, #13261f, #0b1714); }
.nbt-pokdeng-head h1 { color: #f4f3ea; font-family: Georgia,"Times New Roman",serif; font-size: 27px; }
.nbt-pokdeng-head .nbt-pet-eyebrow { color: var(--casino-gold); }
.nbt-pokdeng-head p:not(.nbt-pet-eyebrow) { color: #b4c0b6; }
.nbt-pd-balances { border-color: rgba(255,255,255,.13); background: rgba(255,255,255,.06); color: #f4f3ea; }
.nbt-pd-balances span { color: #c1c9c0; }
@media (max-width: 700px) {
  .nbt-casino-hero { grid-template-columns: minmax(0,1fr); gap: 20px; padding: 23px 20px; }
  .nbt-casino-wallet { width: 100%; grid-template-columns: repeat(2,minmax(0,1fr)); }
  .nbt-casino-grid { grid-template-columns: minmax(0,1fr); }
  .nbt-casino-card { min-height: 0; }
  .nbt-casino-game-head { align-items: flex-start; flex-direction: column; padding: 21px 18px; }
  .nbt-casino-game-head .nbt-pet-wallet { width: 100%; }
}

/* Casino wager confirmation dialog */
.nbt-casino-modal[hidden] { display: none !important; }
.nbt-casino-modal { position: fixed; z-index: 30000; inset: 0; display: grid; place-items: center; padding: 20px; }
.nbt-casino-modal-backdrop { position: absolute; inset: 0; background: rgba(4,12,10,.74); backdrop-filter: blur(5px); }
.nbt-casino-dialog { position: relative; width: min(100%, 440px); padding: 28px; border: 1px solid rgba(215,184,107,.55); border-radius: 20px; background: radial-gradient(ellipse at 100% 0%, rgba(215,184,107,.15), transparent 42%), linear-gradient(145deg, #172820, #0d1713 72%); box-shadow: 0 28px 90px rgba(0,0,0,.48); color: #f1f2e9; animation: nbt-casino-dialog-in .18s ease-out both; }
.nbt-casino-dialog-close { position: absolute; top: 11px; right: 13px; display: grid; place-items: center; width: 34px; height: 34px; border: 1px solid rgba(255,255,255,.16); border-radius: 50%; background: rgba(255,255,255,.06); color: #e7e8df; font-size: 22px; line-height: 1; cursor: pointer; }
.nbt-casino-dialog-close:hover { border-color: rgba(215,184,107,.7); color: #f3d994; }
.nbt-casino-dialog-mark { display: grid; place-items: center; width: 42px; height: 42px; margin-bottom: 14px; border: 1px solid rgba(215,184,107,.48); border-radius: 13px; background: rgba(215,184,107,.12); color: #e6c978; font-size: 22px; }
.nbt-casino-dialog-kicker { margin: 0 0 5px; color: #d7b86b; font-size: 9px; font-weight: 800; letter-spacing: .17em; }
.nbt-casino-dialog h2 { margin: 0 38px 15px 0; padding: 0; border: 0; background: none; color: #fffdf5; font-family: Georgia,"Times New Roman",serif; font-size: 22px; text-align: left; }
.nbt-casino-dialog-stake { display: flex; align-items: center; justify-content: space-between; gap: 12px; padding: 13px 15px; border: 1px solid rgba(215,184,107,.32); border-radius: 12px; background: rgba(215,184,107,.09); }
.nbt-casino-dialog-stake span { color: #bbc4b9; font-size: 11px; }
.nbt-casino-dialog-stake strong { color: #f3d994; font-size: 17px; text-align: right; }
.nbt-casino-dialog-copy { margin: 14px 0 0; color: #d3dbd1; font-size: 13px; line-height: 1.75; }
.nbt-casino-dialog-note { margin: 10px 0 0; color: #9da99f; font-size: 10px; line-height: 1.65; }
.nbt-casino-dialog-actions { display: grid; grid-template-columns: minmax(0,1fr) minmax(0,1fr); gap: 9px; margin-top: 22px; }
.nbt-casino-dialog-actions button { min-height: 43px; padding: 10px 12px; border-radius: 10px; font-size: 12px; font-weight: 700; cursor: pointer; }
.nbt-casino-dialog-cancel { border: 1px solid rgba(255,255,255,.2); background: rgba(255,255,255,.06); color: #edf0e9; }
.nbt-casino-dialog-confirm { border: 1px solid #e5cc88; background: linear-gradient(180deg, #e0c577, #b08b36); color: #1b241d; }
.nbt-casino-dialog-actions button:focus-visible,
.nbt-casino-dialog-close:focus-visible { outline: 3px solid rgba(255,225,150,.75); outline-offset: 2px; }
body.nbt-casino-modal-open { overflow: hidden; }
@keyframes nbt-casino-dialog-in { from { opacity: 0; transform: translateY(8px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
@media (max-width: 520px) {
  .nbt-casino-modal { align-items: end; padding: 10px; }
  .nbt-casino-dialog { padding: 24px 19px 19px; border-radius: 18px; }
  .nbt-casino-dialog-actions { grid-template-columns: minmax(0,1fr); }
}

/* Member directory, activity log, staff team */
.nbt-directory,
.nbt-log-page,
.nbt-staff-page {
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 1080px;
  margin: 0 auto;
  text-align: left;
}
.nbt-directory-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 8px 2px; }
.nbt-directory-head h1 { margin: 0 0 5px; text-align: left; }
.nbt-directory-head p:not(.nbt-pet-eyebrow) { margin: 0; color: var(--muted); font-size: 13px; }
.nbt-directory-stat { display: flex; flex: 0 0 auto; flex-direction: column; gap: 2px; padding: 11px 17px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface-soft); }
.nbt-directory-stat span { color: var(--muted); font-size: 10px; }
.nbt-directory-stat strong { color: var(--blue-ink); font-size: 20px; }
.nbt-directory-filter { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; padding: 16px 18px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow-sm); }
.nbt-directory-field { display: flex; flex: 1 1 200px; flex-direction: column; gap: 5px; min-width: 0; }
.nbt-directory-field label { color: var(--ink-soft); font-size: 11px; font-weight: 700; }
.nbt-directory-field label small { color: var(--muted); font-weight: 500; }
.nbt-directory-field input,
.nbt-directory-field select { width: 100%; min-width: 0; padding: 10px 12px; }
.nbt-alpha { display: flex; flex-wrap: wrap; gap: 5px; }
.nbt-alpha a { display: grid; place-items: center; width: 32px; height: 32px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); color: var(--ink-soft) !important; font-size: 12px; font-weight: 700; text-decoration: none !important; }
.nbt-alpha a:hover { border-color: var(--blue); background: var(--blue-soft); }
.nbt-alpha a.is-active { border-color: var(--blue); background: var(--blue); color: #fff !important; }
.nbt-directory-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 11px; }
.nbt-dir-card { display: flex; align-items: center; gap: 11px; min-width: 0; padding: 11px 13px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); color: var(--ink) !important; text-decoration: none !important; transition: border-color .15s ease, transform .15s ease; }
.nbt-dir-card:hover { transform: translateY(-2px); border-color: var(--blue); }
.nbt-dir-avatar { position: relative; display: grid; flex: 0 0 42px; place-items: center; width: 42px; height: 42px; overflow: hidden; border-radius: 12px; background: var(--u-color, var(--blue)); color: #fff; font-size: 17px; font-weight: 700; }
.nbt-dir-avatar img { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nbt-dir-avatar-initial { position: relative; z-index: 0; }
.nbt-dir-info { display: flex; flex: 1 1 auto; flex-direction: column; gap: 2px; min-width: 0; }
.nbt-dir-name { font-size: 13px; font-weight: 700; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nbt-dir-donor { color: #d97706; }
.nbt-dir-class { color: var(--muted); font-size: 11px; }
.nbt-dir-meta { display: flex; flex-wrap: wrap; gap: 4px 10px; color: var(--muted); font-size: 10px; }
.nbt-empty-card { display: flex; align-items: center; flex-direction: column; gap: 6px; padding: 40px 20px; border: 1px dashed var(--border-strong); border-radius: 16px; background: var(--surface-soft); text-align: center; }
.nbt-empty-card > span { font-size: 32px; }
.nbt-empty-card strong { color: var(--ink); font-size: 15px; }
.nbt-empty-card p { margin: 0; color: var(--muted); font-size: 12px; }
.nbt-directory .nbt-pager,
.nbt-log-page .nbt-pager { display: flex; align-items: center; justify-content: center; gap: 14px; margin: 4px 0 0; }
.nbt-directory .nbt-pager > span,
.nbt-log-page .nbt-pager > span { color: var(--muted); font-size: 12px; }

.nbt-log-search { display: flex; flex-direction: column; gap: 6px; padding: 15px 18px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-sm); }
.nbt-log-search > label { color: var(--ink-soft); font-size: 11px; font-weight: 700; }
.nbt-log-search-row { display: flex; gap: 9px; }
.nbt-log-search-row input { flex: 1 1 auto; min-width: 0; padding: 10px 12px; }
.nbt-log-list { display: flex; flex-direction: column; gap: 8px; }
.nbt-log-item { display: flex; gap: 13px; padding: 12px 15px; border: 1px solid var(--border); border-left: 4px solid var(--border-strong); border-radius: 12px; background: var(--surface); }
.nbt-log-upload { border-left-color: #16a34a; }
.nbt-log-delete { border-left-color: #dc2626; }
.nbt-log-request { border-left-color: #7c3aed; }
.nbt-log-edit { border-left-color: #2563eb; }
.nbt-log-when { display: flex; flex: 0 0 86px; flex-direction: column; gap: 2px; }
.nbt-log-when time { color: var(--ink); font-size: 12px; font-weight: 700; }
.nbt-log-when span { color: var(--muted); font-size: 10px; }
.nbt-log-body { display: flex; flex: 1 1 auto; flex-direction: column; gap: 5px; min-width: 0; }
.nbt-log-body p { margin: 0; color: var(--ink-soft); font-size: 12px; line-height: 1.7; overflow-wrap: anywhere; }
.nbt-log-tag { display: inline-flex; align-self: flex-start; padding: 2px 8px; border-radius: 999px; font-size: 9px; font-weight: 700; }
.nbt-log-tag-upload { background: #dcfce7; color: #166534; }
.nbt-log-tag-delete { background: #fee2e2; color: #b91c1c; }
.nbt-log-tag-request { background: #ede9fe; color: #6d28d9; }
.nbt-log-tag-edit { background: #dbeafe; color: #1d4ed8; }
.nbt-log-tag-default { background: var(--surface-soft); color: var(--muted); }

.nbt-staff-tools { display: flex; flex: 0 0 auto; flex-wrap: wrap; gap: 8px; }
.nbt-staff-panel { display: flex; flex-direction: column; gap: 14px; padding: 18px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow-sm); }
.nbt-staff-panel .nbt-card-head h2 { margin: 0; }
.nbt-ban-form { display: flex; flex-wrap: wrap; align-items: flex-end; gap: 12px; }
.nbt-ban-form .nbt-directory-field { flex: 1 1 180px; }
.nbt-ban-form .nbt-ban-comment { flex: 1 1 100%; }
.nbt-ban-list { display: flex; flex-direction: column; gap: 8px; }
.nbt-ban-item { display: flex; align-items: center; gap: 13px; padding: 11px 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.nbt-ban-range { display: flex; flex: 0 0 auto; flex-direction: column; gap: 2px; }
.nbt-ban-range strong { color: var(--ink); font-size: 13px; }
.nbt-ban-range span { color: var(--muted); font-size: 10px; }
.nbt-ban-info { flex: 1 1 auto; min-width: 0; }
.nbt-ban-info p { margin: 0 0 3px; color: var(--ink-soft); font-size: 12px; overflow-wrap: anywhere; }
.nbt-ban-info small { color: var(--muted); font-size: 10px; }
.nbt-ban-item form { flex: 0 0 auto; margin: 0; }
.nbt-staff-section { display: flex; flex-direction: column; gap: 11px; }
.nbt-staff-section-head { display: flex; align-items: baseline; justify-content: space-between; gap: 12px; }
.nbt-staff-section-head h2 { margin: 0; color: var(--ink); font-size: 17px; text-align: left; }
.nbt-staff-section-head > span { color: var(--muted); font-size: 11px; }
.nbt-staff-sysop .nbt-staff-section-head h2 { color: #dc2626; }
.nbt-staff-admin .nbt-staff-section-head h2 { color: #db2777; }
.nbt-staff-mod .nbt-staff-section-head h2 { color: #a16207; }
.nbt-staff-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 11px; }
.nbt-staff-card { display: flex; align-items: center; gap: 12px; min-width: 0; padding: 12px 14px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); box-shadow: var(--shadow-sm); }
.nbt-staff-avatar { position: relative; display: grid; flex: 0 0 46px; place-items: center; width: 46px; height: 46px; overflow: hidden; border-radius: 13px; background: var(--u-color, var(--blue)); color: #fff; font-size: 18px; font-weight: 700; }
.nbt-staff-avatar img { position: absolute; z-index: 1; inset: 0; width: 100%; height: 100%; object-fit: cover; }
.nbt-staff-avatar-initial { position: relative; z-index: 0; }
.nbt-staff-status { position: absolute; z-index: 2; right: -2px; bottom: -2px; width: 13px; height: 13px; border: 2px solid var(--surface); border-radius: 50%; background: #cbd5e1; }
.nbt-staff-status.is-online { background: #16a34a; }
.nbt-staff-info { display: flex; flex: 1 1 auto; flex-direction: column; gap: 2px; min-width: 0; }
.nbt-staff-name { font-size: 13px; font-weight: 700; text-decoration: none !important; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nbt-staff-role { color: var(--muted); font-size: 10px; }
.nbt-staff-pm { flex: 0 0 auto; padding: 7px 11px; font-size: 11px; }
@media (max-width: 620px) {
  .nbt-directory-head { align-items: flex-start; flex-direction: column; }
  .nbt-directory-stat { width: 100%; }
  .nbt-directory-grid { grid-template-columns: minmax(0, 1fr); }
  .nbt-log-item { flex-wrap: wrap; }
  .nbt-log-when { flex-basis: 100%; flex-direction: row; gap: 8px; }
  .nbt-ban-item { flex-wrap: wrap; }
  .nbt-ban-info { flex-basis: calc(100% - 110px); }
  .nbt-ban-item form { flex-basis: 100%; }
  .nbt-ban-item form .btn { width: 100%; }
  .nbt-staff-grid { grid-template-columns: minmax(0, 1fr); }
  .nbt-staff-card { flex-wrap: wrap; }
  .nbt-staff-pm { flex-basis: 100%; width: 100%; text-align: center; }
}

/* Pok Deng audit log */
.nbt-pdlog-summary { display: grid; grid-template-columns: repeat(auto-fit, minmax(130px, 1fr)); gap: 10px; }
.nbt-pdlog-summary > div { display: flex; flex-direction: column; gap: 3px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.nbt-pdlog-summary span { color: var(--muted); font-size: 10px; }
.nbt-pdlog-summary strong { color: var(--ink); font-size: 15px; }
.nbt-pdlog-win { color: #15803d !important; }
.nbt-pdlog-loss { color: var(--red) !important; }
.nbt-pdlog-note { margin: 0; color: var(--muted); font-size: 12px; }
.nbt-pdlog-delta { flex: 0 0 auto; align-self: center; padding: 5px 11px; border-radius: 999px; font-size: 12px; font-weight: 700; }
.nbt-pdlog-delta.is-win { background: #dcfce7; color: #15803d; }
.nbt-pdlog-delta.is-loss { background: #fee2e2; color: #b91c1c; }

/* Forum composer with emoji picker */
.nbt-composer {
  border: 1px solid var(--border);
  border-radius: 14px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  overflow: hidden;
}
.nbt-composer-toolbar {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  padding: 8px;
  border-bottom: 1px solid var(--border);
  background: var(--surface-soft);
}
.nbt-composer-toolbar button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-width: 34px;
  height: 32px;
  padding: 0 9px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--ink-soft);
  font-size: 13px;
  cursor: pointer;
}
.nbt-composer-toolbar button:hover {
  border-color: var(--blue);
  background: var(--blue-soft);
  color: var(--blue-ink);
}
.nbt-composer-u { text-decoration: underline; }
.nbt-composer-s { text-decoration: line-through; }
.nbt-composer-emoji-toggle {
  margin-left: auto;
  gap: 5px;
  font-weight: 600;
}
.nbt-composer-emoji-toggle[aria-expanded="true"] {
  border-color: var(--blue) !important;
  background: var(--blue-soft) !important;
  color: var(--blue-ink) !important;
}
.nbt-composer-input {
  display: block;
  width: 100%;
  min-height: 220px;
  padding: 14px;
  border: 0;
  background: var(--surface);
  color: var(--ink);
  font-size: 14px;
  line-height: 1.8;
  resize: vertical;
}
.nbt-composer-input:focus {
  outline: none;
}
.nbt-composer-emoji {
  border-top: 1px solid var(--border);
  background: var(--surface-soft);
}
.nbt-composer-emoji-head {
  display: flex;
  gap: 8px;
  padding: 9px 10px;
}
.nbt-composer-emoji-search {
  flex: 1 1 auto;
  min-width: 0;
  padding: 8px 11px;
  font-size: 13px;
}
.nbt-composer-emoji-close {
  flex: 0 0 auto;
  width: 36px;
  border: 1px solid var(--border);
  border-radius: 8px;
  background: var(--surface);
  color: var(--muted);
  font-size: 20px;
  line-height: 1;
  cursor: pointer;
}
.nbt-composer-emoji-close:hover { color: var(--red); border-color: var(--red); }
.nbt-composer-emoji-grid {
  display: grid;
  grid-template-columns: repeat(auto-fill, minmax(38px, 1fr));
  gap: 4px;
  max-height: 216px;
  padding: 4px 10px 12px;
  overflow-y: auto;
}
.nbt-composer-emoji-item {
  display: grid;
  place-items: center;
  height: 36px;
  border: 1px solid transparent;
  border-radius: 8px;
  background: var(--surface);
  cursor: pointer;
}
.nbt-composer-emoji-item:hover {
  border-color: var(--blue);
  background: var(--blue-soft);
}
.nbt-composer-emoji-item img {
  max-width: 26px;
  max-height: 26px;
}
.nbt-composer-emoji-empty {
  margin: 0;
  padding: 8px 12px 14px;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}
.nbt-composer-preview-toggle {
  gap: 5px;
  font-weight: 600;
}
.nbt-composer-preview-toggle[aria-expanded="true"] {
  border-color: var(--blue) !important;
  background: var(--blue-soft) !important;
  color: var(--blue-ink) !important;
}
.nbt-composer-preview {
  border-top: 1px solid var(--border);
  background: var(--surface-soft);
  padding: 14px 16px;
}
.nbt-composer-preview-empty {
  margin: 0;
  color: var(--muted);
  font-size: 12px;
  text-align: center;
}
.nbt-composer-preview-body {
  color: var(--ink);
  font-size: 14px;
  line-height: 1.9;
  overflow-wrap: anywhere;
}
.nbt-composer-preview-body blockquote {
  margin: 8px 0;
  padding: 8px 12px;
  border-left: 3px solid var(--blue);
  border-radius: 0 8px 8px 0;
  background: var(--surface);
  color: var(--ink-soft);
}
.nbt-composer-preview-body blockquote cite {
  display: block;
  margin-bottom: 3px;
  color: var(--blue-ink);
  font-size: 11px;
  font-style: normal;
  font-weight: 700;
}
.nbt-composer-preview-code {
  margin: 8px 0;
  padding: 10px 12px;
  border-radius: 9px;
  background: #0f172a;
  color: #e2e8f0;
  font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace;
  font-size: 12px;
  overflow-x: auto;
  white-space: pre-wrap;
}
.nbt-composer-preview-smilie {
  max-height: 22px;
  vertical-align: middle;
}
.nbt-composer-preview-body img {
  max-width: 100%;
  border-radius: 8px;
}
.nbt-composer-foot {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 8px 12px;
  border-top: 1px solid var(--border);
  color: var(--muted);
  font-size: 11px;
}
.nbt-composer-hint { min-width: 0; }
.nbt-composer-count { flex: 0 0 auto; white-space: nowrap; }
.nbt-composer-count b { color: var(--ink-soft); }
@media (max-width: 560px) {
  .nbt-composer-input { min-height: 180px; }
  .nbt-composer-emoji-toggle { margin-left: 0; width: 100%; }
  .nbt-composer-foot { flex-direction: column; align-items: flex-start; gap: 3px; }
}

/* Profile group badge */
.nbt-profile-group {
  margin: 12px 0 18px;
}
.nbt-group-badge {
  display: inline-flex;
  align-items: center;
  gap: 7px;
  max-width: 100%;
  padding: 5px 13px 5px 6px;
  border: 1px solid var(--border-strong);
  border-radius: 999px;
  background: linear-gradient(135deg, var(--surface), var(--surface-soft));
  box-shadow: var(--shadow-sm);
  color: var(--ink) !important;
  font-size: 12px;
  text-decoration: none !important;
  transition: border-color .15s ease, transform .15s ease;
}
.nbt-group-badge:hover {
  border-color: var(--blue);
  transform: translateY(-1px);
}
.nbt-group-badge-icon {
  display: grid;
  flex: 0 0 24px;
  place-items: center;
  width: 24px;
  height: 24px;
  border-radius: 50%;
  background: var(--blue-soft);
  font-size: 13px;
}
.nbt-group-badge-label {
  color: var(--muted);
  font-size: 10px;
  font-weight: 700;
  letter-spacing: .04em;
}
.nbt-group-badge-name {
  overflow: hidden;
  color: var(--blue-ink);
  font-weight: 700;
  text-overflow: ellipsis;
  white-space: nowrap;
}

/* Signup captcha */
.nbt-captcha {
  display: flex;
  align-items: center;
  gap: 12px;
  margin-bottom: 4px;
}
.nbt-captcha img {
  display: block;
  width: 150px;
  height: 50px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface-soft);
}
.nbt-captcha-refresh {
  flex: 0 0 auto;
  padding: 9px 14px;
  border: 1px solid var(--border);
  border-radius: 10px;
  background: var(--surface);
  color: var(--blue-ink);
  font-size: 13px;
  font-weight: 600;
  cursor: pointer;
}
.nbt-captcha-refresh:hover {
  border-color: var(--blue);
  background: var(--blue-soft);
}
.nbt-hp {
  position: absolute !important;
  left: -9999px !important;
  width: 1px;
  height: 1px;
  overflow: hidden;
}
@media (max-width: 420px) {
  .nbt-captcha { flex-wrap: wrap; }
}

/* Upload result (takeupload.php) */
.nbt-upload-result {
  display: flex;
  align-items: center;
  justify-content: center;
  min-height: 60vh;
  padding: 20px 0;
}
.nbt-upload-result-card {
  width: min(100%, 560px);
  padding: clamp(28px, 6vw, 46px) clamp(20px, 5vw, 42px);
  border: 1px solid var(--border);
  border-radius: 20px;
  background: var(--surface);
  box-shadow: var(--shadow);
  text-align: center;
}
.nbt-upload-result-icon {
  display: grid;
  place-items: center;
  width: 72px;
  height: 72px;
  margin: 0 auto 16px;
  border-radius: 50%;
  font-size: 34px;
  line-height: 1;
  background: var(--surface-soft);
}
.nbt-upload-success .nbt-upload-result-icon { background: #dcfce7; }
.nbt-upload-error .nbt-upload-result-icon { background: #fee2e2; }
.nbt-upload-info .nbt-upload-result-icon { background: var(--blue-soft); }
.nbt-upload-result-card h1 {
  margin: 0 0 10px;
  color: var(--ink);
  font-size: clamp(20px, 5vw, 25px);
  text-align: center;
}
.nbt-upload-result-card p {
  margin: 0;
  color: var(--ink-soft);
  font-size: 14px;
  line-height: 1.9;
  overflow-wrap: anywhere;
}
.nbt-upload-result-card p a { font-weight: 600; }
.nbt-upload-result-actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: center;
  gap: 10px;
  margin-top: 24px;
}
.nbt-upload-result-actions .btn { min-width: 150px; padding: 11px 20px; font-size: 14px; }
@media (max-width: 520px) {
  .nbt-upload-result-actions { flex-direction: column; }
  .nbt-upload-result-actions .btn { width: 100%; }
}

/* BBCode tags reference */
.nbt-tags-page,
.nbt-smilies-page {
  display: flex;
  flex-direction: column;
  gap: 18px;
  max-width: 1080px;
  margin: 0 auto;
  text-align: left;
}
.nbt-tags-tester {
  display: flex;
  flex-direction: column;
  gap: 12px;
  padding: 18px;
  border: 1px solid var(--border);
  border-radius: 15px;
  background: var(--surface);
  box-shadow: var(--shadow-sm);
}
.nbt-tags-tester .nbt-card-head h2 { margin: 0; }
.nbt-tags-tester .nbt-card-head span { color: var(--muted); font-size: 11px; }
.nbt-tags-test-input {
  width: 100%;
  min-height: 96px;
  padding: 12px 14px;
  font-size: 14px;
  line-height: 1.8;
  resize: vertical;
}
.nbt-tags-tester-actions { display: flex; justify-content: flex-end; }
.nbt-tags-test-result { display: flex; flex-direction: column; gap: 6px; }
.nbt-tags-test-label { color: var(--muted); font-size: 11px; font-weight: 700; }
.nbt-tags-test-output { padding: 14px; border: 1px dashed var(--border-strong); border-radius: 12px; background: var(--surface-soft); color: var(--ink); font-size: 14px; line-height: 1.8; overflow-wrap: anywhere; }
.nbt-tags-filter { display: flex; flex-direction: column; gap: 12px; }
.nbt-tags-chips { display: flex; flex-wrap: wrap; gap: 7px; }
.nbt-tags-chip { padding: 7px 14px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--ink-soft); font-size: 12px; font-weight: 600; cursor: pointer; }
.nbt-tags-chip:hover { border-color: var(--blue); background: var(--blue-soft); }
.nbt-tags-chip.is-active { border-color: var(--blue); background: var(--blue); color: #fff; }
.nbt-tags-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.nbt-tag-card { display: flex; flex-direction: column; gap: 11px; min-width: 0; padding: 16px 18px; border: 1px solid var(--border); border-radius: 15px; background: var(--surface); box-shadow: var(--shadow-sm); }
.nbt-tag-card-head { display: flex; align-items: flex-start; justify-content: space-between; gap: 10px; }
.nbt-tag-card-head h2 { margin: 0; padding: 0; border: 0; background: none; color: var(--ink); font-size: 16px; text-align: left; }
.nbt-tag-card-head span { color: var(--muted); font-size: 11px; }
.nbt-tag-cat { flex: 0 0 auto; padding: 3px 9px; border-radius: 999px; background: var(--surface-soft); color: var(--muted); font-size: 9px; font-weight: 700; }
.nbt-tag-desc { margin: 0; color: var(--ink-soft); font-size: 12px; line-height: 1.7; }
.nbt-tag-row { display: flex; align-items: center; flex-wrap: wrap; gap: 8px; min-width: 0; }
.nbt-tag-row-label { flex: 0 0 56px; color: var(--muted); font-size: 10px; font-weight: 700; }
.nbt-tag-code { flex: 1 1 auto; min-width: 0; padding: 7px 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-soft); color: var(--blue-ink); font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; font-size: 12px; overflow-wrap: anywhere; }
.nbt-tag-copy { flex: 0 0 auto; padding: 6px 11px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--blue-ink); font-size: 11px; font-weight: 600; cursor: pointer; }
.nbt-tag-copy:hover { border-color: var(--blue); background: var(--blue-soft); }
.nbt-tag-copy.is-done { border-color: var(--blue); background: var(--blue); color: #fff; }
.nbt-tag-result { display: flex; align-items: flex-start; gap: 8px; }
.nbt-tag-result-box { flex: 1 1 auto; min-width: 0; padding: 10px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-soft); color: var(--ink); font-size: 13px; line-height: 1.8; overflow-wrap: anywhere; }
.nbt-tag-remarks { margin: 0; color: var(--muted); font-size: 11px; line-height: 1.7; }
.nbt-tags-empty { margin: 0; padding: 22px; border: 1px dashed var(--border-strong); border-radius: 14px; background: var(--surface-soft); color: var(--muted); font-size: 13px; text-align: center; }

/* Smilies reference */
.nbt-smilies-filter { display: flex; }
.nbt-smilies-filter .nbt-directory-field { flex: 1 1 auto; }
.nbt-smilies-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(120px, 1fr)); gap: 10px; }
.nbt-smilie-card { display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 13px 10px 10px; border: 1px solid var(--border); border-radius: 13px; background: var(--surface); box-shadow: var(--shadow-sm); cursor: pointer; transition: border-color .15s ease, transform .15s ease; }
.nbt-smilie-card:hover { transform: translateY(-2px); border-color: var(--blue); }
.nbt-smilie-card.is-done { border-color: var(--blue); background: var(--blue-soft); }
.nbt-smilie-img { display: grid; place-items: center; height: 42px; }
.nbt-smilie-img img { max-width: 34px; max-height: 34px; }
.nbt-smilie-code { color: var(--ink-soft); font-family: ui-monospace, "SFMono-Regular", Menlo, Consolas, monospace; font-size: 11px; overflow-wrap: anywhere; text-align: center; }
.nbt-smilie-copy { color: var(--muted); font-size: 10px; font-weight: 700; }
@media (max-width: 620px) {
  .nbt-tags-grid { grid-template-columns: minmax(0, 1fr); }
  .nbt-smilies-grid { grid-template-columns: repeat(auto-fill, minmax(96px, 1fr)); }
  .nbt-smilie-code { font-size: 10px; }
}

.nbt-inline { display: inline; margin: 0; padding: 0; }
.nbt-inline-btn {
  background: none; border: none; padding: 0; margin: 0;
  color: inherit; cursor: pointer; font: inherit; text-decoration: underline;
}
.nbt-inline-btn:hover { color: #2980b9; }

/* ===== browse / details / edit (NextBitTBdev) ===== */
.nbt-page-title { margin: 8px 0 16px; }

.nbt-torrent-list { display: flex; flex-direction: column; gap: 12px; margin: 12px 0; }
.nbt-torrent {
  display: grid;
  grid-template-columns: 68px minmax(0, 1fr) auto auto;
  align-items: center;
  gap: 14px;
  padding: 14px 16px;
  border: 1px solid var(--border);
  border-radius: var(--radius);
  background: var(--surface);
  box-shadow: var(--shadow-sm);
  transition: border-color .14s ease, box-shadow .14s ease, transform .14s ease;
}
.nbt-torrent:hover { border-color: var(--blue); box-shadow: 0 8px 22px rgba(37,99,235,.10); transform: translateY(-1px); }
.nbt-torrent-cat { display: flex; align-items: center; justify-content: center; }
.nbt-torrent-cat img { max-width: 64px; max-height: 44px; border-radius: 8px; }
.nbt-torrent-cat-txt { font-size: 11px; font-weight: 600; color: var(--muted); text-align: center; overflow-wrap: anywhere; }
.nbt-torrent-main { min-width: 0; }
.nbt-torrent-name { display: block; font-size: 15px; font-weight: 700; color: var(--ink) !important; text-decoration: none !important; overflow-wrap: anywhere; line-height: 1.35; }
.nbt-torrent-name:hover { color: var(--blue) !important; text-decoration: underline !important; }
.nbt-torrent-name.is-nuked { color: var(--muted) !important; text-decoration: line-through !important; }
.nbt-torrent-meta { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 7px; }
.nbt-torrent-stats { display: flex; flex-wrap: wrap; gap: 10px; }
.nbt-torrent-stat { display: inline-flex; flex-direction: column; align-items: center; min-width: 54px; color: var(--muted); font-size: 11px; }
.nbt-torrent-stat i { font-size: 12px; margin-bottom: 2px; }
.nbt-torrent-stat b { font-size: 14px; color: var(--ink); }
.nbt-torrent-stat small { color: var(--muted); font-size: 10px; }
.nbt-stat-seed i { color: var(--green); }
.nbt-stat-leech i { color: var(--red); }
.nbt-torrent-dl { display: inline-flex; align-items: center; gap: 7px; white-space: nowrap; }
@media (max-width: 720px) {
  .nbt-torrent { grid-template-columns: 48px minmax(0,1fr); grid-template-areas: "cat main" "stats stats" "dl dl"; }
  .nbt-torrent-cat { grid-area: cat; }
  .nbt-torrent-main { grid-area: main; }
  .nbt-torrent-stats { grid-area: stats; justify-content: space-between; border-top: 1px solid var(--border); padding-top: 10px; margin-top: 4px; }
  .nbt-torrent-dl { grid-area: dl; justify-content: center; }
  .nbt-torrent-stat { flex: 1 1 0; }
}

.nbt-chip-purple { background: #efe3ff; color: #6d28d9; }
.nbt-chip-link { color: var(--blue-ink) !important; text-decoration: none !important; }
.nbt-chip-link:hover { text-decoration: underline !important; }
.nbt-chip i { font-size: 11px; }

.nbt-pager { text-align: center; margin: 14px 0; }
.nbt-pager p { margin: 6px 0; }

.nbt-detail { display: flex; flex-direction: column; gap: 16px; }
.nbt-detail-head { display: flex; flex-wrap: wrap; gap: 14px; justify-content: space-between; align-items: flex-start; }
.nbt-detail-title { margin: 0 0 8px; font-size: 22px; line-height: 1.3; overflow-wrap: anywhere; }
.nbt-detail-meta { display: flex; flex-wrap: wrap; gap: 6px; }
.nbt-detail-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.nbt-detail-stats { display: flex; flex-wrap: wrap; gap: 10px; padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); }
.nbt-detail-stats .nbt-torrent-stat { flex: 1 1 80px; }
.nbt-detail-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(280px, 1fr)); gap: 16px; }
.nbt-detail-descr { line-height: 1.65; overflow-wrap: anywhere; }
.nbt-detail-dl { display: grid; grid-template-columns: auto 1fr; gap: 6px 12px; margin: 0; }
.nbt-detail-dl dt { color: var(--muted); font-weight: 600; font-size: 12px; }
.nbt-detail-dl dd { margin: 0; overflow-wrap: anywhere; }
.nbt-hash { font-size: 11px; word-break: break-all; }
.nbt-snatchers { display: flex; flex-wrap: wrap; gap: 6px; }
.nbt-inline-form { align-items: flex-end; }
.nbt-radio-group { display: flex; flex-wrap: wrap; gap: 14px; }
.nbt-dl-count { margin: 12px 0 6px; }

.nbt-comments { display: flex; flex-direction: column; gap: 14px; margin: 12px 0; }
.nbt-comment { display: flex; gap: 14px; padding: 14px 16px; border: 1px solid var(--border); border-radius: var(--radius); background: var(--surface); box-shadow: var(--shadow-sm); }
.nbt-comment-avatar { flex: 0 0 auto; }
.nbt-comment-avatar img { width: 56px; height: 56px; border-radius: 50%; object-fit: cover; }
.nbt-comment-main { min-width: 0; flex: 1 1 auto; }
.nbt-comment-head { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin-bottom: 6px; font-size: 12px; }
.nbt-comment-user { font-weight: 700; }
.nbt-comment-role { color: var(--muted); }
.nbt-comment-date { color: var(--muted); }
.nbt-comment-tools { margin-left: auto; display: inline-flex; gap: 8px; align-items: center; }
.nbt-comment-text { line-height: 1.65; overflow-wrap: anywhere; }
.nbt-comment-edited { color: var(--muted); font-size: 11px; margin: 6px 0 0; }
@media (max-width: 620px) {
  .nbt-comment { flex-direction: column; }
  .nbt-comment-tools { margin-left: 0; }
}

/* Polished library, torrent detail and edit surfaces */
.nbt-browse-hero {
  position: relative;
  isolation: isolate;
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 24px;
  min-height: 176px;
  margin: 8px 0 18px;
  padding: 28px 32px;
  overflow: hidden;
  border: 1px solid rgba(255,255,255,.12);
  border-radius: 20px;
  background: radial-gradient(circle at 82% 15%, rgba(73,151,255,.34), transparent 28%), linear-gradient(115deg, #101c31 0%, #152b4b 58%, #194a7b 100%);
  color: #fff;
  box-shadow: 0 16px 38px rgba(11,30,58,.18);
}
.nbt-browse-hero::after {
  position: absolute;
  z-index: -1;
  right: 10%;
  bottom: -120px;
  width: 290px;
  height: 290px;
  border: 1px solid rgba(255,255,255,.14);
  border-radius: 50%;
  box-shadow: 0 0 0 30px rgba(255,255,255,.025), 0 0 0 62px rgba(255,255,255,.02);
  content: "";
}
.nbt-browse-hero-copy { max-width: 700px; }
.nbt-browse-hero .nbt-eyebrow,
.nbt-detail .nbt-eyebrow,
.nbt-edit-hero .nbt-eyebrow {
  display: inline-flex;
  align-items: center;
  gap: 8px;
  color: #8cc4ff;
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .16em;
}
.nbt-browse-hero h1 { margin: 9px 0 5px; color: #fff; font-size: clamp(27px, 4vw, 38px); line-height: 1.12; letter-spacing: -.035em; }
.nbt-browse-hero p { margin: 0; color: rgba(239,246,255,.76); font-size: 14px; }
.nbt-browse-total { display: flex; flex-direction: column; flex: 0 0 auto; padding: 11px 16px; border: 1px solid rgba(255,255,255,.18); border-radius: 14px; background: rgba(5,18,36,.25); backdrop-filter: blur(8px); }
.nbt-browse-total strong { color: #fff; font-size: 25px; line-height: 1; }
.nbt-browse-total span { margin-top: 5px; color: rgba(239,246,255,.72); font-size: 11px; }
.nbt-browse-search { padding: 11px; border-radius: 15px; box-shadow: 0 8px 25px rgba(19,44,78,.07); }
.nbt-browse-searchbox { display: flex; flex: 1 1 280px; align-items: center; gap: 10px; min-width: 0; padding: 0 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface-raised); color: var(--muted); }
.nbt-browse-searchbox:focus-within { border-color: var(--blue); box-shadow: 0 0 0 3px rgba(37,99,235,.1); }
.nbt-browse-searchbox .nbt-search-input { border: 0 !important; background: transparent !important; box-shadow: none !important; }
.nbt-browse-search .nbt-search-input { flex-basis: auto; padding-left: 0; }
.nbt-browse-search .btn { min-height: 42px; }
.nbt-browse-filter { border-radius: 15px; }
.nbt-filter-head { margin-bottom: 15px; }
.nbt-filter-title { display: inline-flex; align-items: center; gap: 8px; font-size: 14px; }
.nbt-cat-chip { min-height: 38px; border-radius: 10px; }
.nbt-cat-grid { grid-template-columns: repeat(auto-fill, minmax(165px, 1fr)); }
.nbt-filter-foot { justify-content: flex-end; border-top: 1px solid var(--border); padding-top: 13px; }
.nbt-browse-context { display: flex; flex-wrap: wrap; align-items: baseline; gap: 8px; margin: 0 0 12px; color: var(--muted); font-size: 13px; }
.nbt-browse-context strong { color: var(--ink); font-size: 17px; }
.nbt-results-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; margin: 24px 0 4px; padding: 0 2px; }
.nbt-results-bar > div { display: flex; flex-direction: column; gap: 2px; }
.nbt-results-bar .nbt-eyebrow { color: var(--muted); font-size: 9px; font-weight: 800; letter-spacing: .16em; }
.nbt-results-bar strong { color: var(--ink); font-size: 17px; }
.nbt-results-bar strong small { color: var(--muted); font-size: 12px; font-weight: 500; }
.nbt-sort-form { display: flex; align-items: center; gap: 7px; }
.nbt-sort-form label { color: var(--muted); font-size: 12px; }
.nbt-sort-form select { min-height: 36px; padding-top: 5px; padding-bottom: 5px; font-size: 12px; }
.nbt-sort-form .btn { min-height: 36px; padding: 6px 11px; }
.nbt-pager { padding: 3px 0; color: var(--muted); font-size: 12px; }
.nbt-pager a { color: var(--blue-ink); }
.nbt-torrent-list { gap: 10px; }
.nbt-torrent { position: relative; grid-template-columns: 58px minmax(0,1fr) minmax(250px,auto) auto; gap: 17px; padding: 17px 19px; border-radius: 15px; }
.nbt-torrent::before { position: absolute; inset: 13px auto 13px 0; width: 3px; border-radius: 0 5px 5px 0; background: transparent; content: ""; transition: background .16s ease; }
.nbt-torrent:hover::before { background: var(--blue); }
.nbt-torrent-cat { width: 54px; height: 54px; border: 1px solid var(--border); border-radius: 13px; background: linear-gradient(145deg,#f4f8ff,#e8f0fc); }
.nbt-torrent-cat img { max-width: 38px; max-height: 38px; object-fit: contain; }
.nbt-torrent-cat-txt { padding: 5px; font-size: 9px; }
.nbt-torrent-name { font-size: 15px; letter-spacing: -.01em; }
.nbt-torrent-meta { align-items: center; gap: 5px 12px; color: var(--muted); font-size: 11px; }
.nbt-torrent-meta > span { display: inline-flex; align-items: center; gap: 5px; }
.nbt-torrent-meta > span i { color: #8292a8; font-size: 10px; }
.nbt-torrent-meta .nbt-chip { padding: 3px 8px; border-radius: 999px; font-size: 10px; box-shadow: none; }
.nbt-torrent-stats { justify-content: flex-end; gap: 4px; }
.nbt-torrent-stat { min-width: 56px; padding: 0 7px; border-left: 1px solid var(--border); }
.nbt-torrent-stat b { font-size: 15px; font-variant-numeric: tabular-nums; }
.nbt-torrent-stat small { font-size: 9px; white-space: nowrap; }
.nbt-torrent-dl { min-width: 43px; min-height: 43px; justify-content: center; border-radius: 12px; box-shadow: 0 6px 14px rgba(37,99,235,.17); }
.nbt-torrent-dl span { display: none; }
.nbt-empty-card { border: 1px solid var(--border); border-radius: 18px; background: linear-gradient(145deg,var(--surface),var(--surface-soft)); }

.nbt-detail { gap: 18px; }
.nbt-detail-head { position: relative; isolation: isolate; align-items: flex-end; min-height: 205px; padding: 25px 28px; overflow: hidden; border: 1px solid rgba(255,255,255,.12); border-radius: 20px; background: radial-gradient(circle at 85% 0%,rgba(55,142,245,.32),transparent 26%), linear-gradient(115deg,#101c31,#173456 62%,#175185); color: #fff; box-shadow: 0 16px 38px rgba(11,30,58,.16); }
.nbt-detail-head::after { position: absolute; z-index: -1; right: 13%; bottom: -130px; width: 300px; height: 300px; border: 1px solid rgba(255,255,255,.13); border-radius: 50%; box-shadow: 0 0 0 28px rgba(255,255,255,.025),0 0 0 60px rgba(255,255,255,.02); content: ""; }
.nbt-detail-heading { min-width: 0; max-width: 790px; }
.nbt-detail .nbt-eyebrow { color: #91c9ff; }
.nbt-detail-id { margin-left: 4px; color: rgba(240,247,255,.52); letter-spacing: .04em; }
.nbt-detail-title { margin: 10px 0 13px; color: #fff; font-size: clamp(23px,4vw,35px); letter-spacing: -.035em; }
.nbt-detail-meta .nbt-chip { border-color: rgba(255,255,255,.14); background: rgba(255,255,255,.09); color: #eef6ff; box-shadow: none; backdrop-filter: blur(6px); }
.nbt-detail-meta .nbt-chip-link { color: #d3e9ff !important; }
.nbt-detail-actions { flex: 0 0 auto; }
.nbt-detail-actions .btn-ghost { border-color: rgba(255,255,255,.25); background: rgba(255,255,255,.09); color: #fff !important; }
.nbt-detail-actions .btn-ghost:hover { background: rgba(255,255,255,.18); }
.nbt-detail-download { min-height: 44px; border-color: #8cc4ff; background: #d8edff; color: #10375f !important; box-shadow: 0 8px 20px rgba(0,0,0,.15); }
.nbt-detail-download:hover { background: #fff; }
.nbt-detail-stats { gap: 0; padding: 12px 8px; border-radius: 15px; box-shadow: 0 7px 20px rgba(19,44,78,.06); }
.nbt-detail-stats .nbt-torrent-stat { position: relative; min-width: 100px; padding: 4px 13px; }
.nbt-detail-stats .nbt-torrent-stat + .nbt-torrent-stat { border-left: 1px solid var(--border); }
.nbt-detail-stats .nbt-torrent-stat b { font-size: 19px; }
.nbt-detail-stats .nbt-torrent-stat small { margin-top: 2px; font-size: 10px; }
.nbt-detail-grid { grid-template-columns: minmax(0,1.45fr) minmax(270px,.85fr); }
.nbt-detail-grid .nbt-panel, .nbt-detail > .nbt-panel { border-radius: 16px; }
.nbt-detail-grid .nbt-panel:first-child { background: linear-gradient(155deg,#fff,#f6f9ff); }
.nbt-detail-descr { font-size: 14px; line-height: 1.8; }
.nbt-detail-dl dt { padding-top: 2px; }
.nbt-detail-dl dd { font-size: 13px; }
.nbt-hash { display: inline-block; padding: 6px 8px; border: 1px solid var(--border); border-radius: 7px; background: var(--surface-soft); color: var(--blue-ink); }
.nbt-comment { border-radius: 14px; box-shadow: 0 5px 17px rgba(19,44,78,.05); }
.nbt-comment-avatar img { border: 2px solid #e7eef8; }
.nbt-comment-text { font-size: 13px; line-height: 1.75; }

.nbt-edit-hero { display: flex; align-items: center; gap: 16px; margin: 8px 0 20px; padding: 21px 24px; border: 1px solid var(--border); border-radius: 18px; background: linear-gradient(115deg,#f0f6ff,#fff 65%,#f4f8ff); box-shadow: var(--shadow-sm); }
.nbt-edit-mark { display: grid; flex: 0 0 48px; width: 48px; height: 48px; place-items: center; border-radius: 14px; background: #e1edff; color: var(--blue); font-size: 19px; }
.nbt-edit-hero .nbt-eyebrow { color: var(--blue); }
.nbt-edit-hero h1 { margin: 2px 0; font-size: 22px; letter-spacing: -.025em; }
.nbt-edit-hero p { margin: 0; color: var(--muted); font-size: 12px; overflow-wrap: anywhere; }
.nbt-edit-back { display: inline-flex; align-items: center; gap: 7px; margin-left: auto; padding: 9px 12px; border: 1px solid var(--border); border-radius: 10px; background: var(--surface); color: var(--ink-soft) !important; font-size: 12px; text-decoration: none !important; white-space: nowrap; }
.nbt-edit-back:hover { border-color: var(--blue); color: var(--blue) !important; }
.nbt-bank > .nbt-panel { margin-bottom: 14px; border-radius: 16px; }
.nbt-bank > .nbt-panel:nth-of-type(2) { border-top: 3px solid #e2a3a3; }
.nbt-edit-actions { position: sticky; bottom: 12px; z-index: 5; width: fit-content; max-width: 100%; margin: 16px auto; padding: 10px; border: 1px solid var(--border); border-radius: 14px; background: rgba(255,255,255,.94); box-shadow: 0 10px 30px rgba(16,35,63,.15); backdrop-filter: blur(12px); }
.nbt-edit-actions .btn { min-height: 42px; }
.nbt-bank .nbt-radio-group .nbt-radio { padding: 7px 10px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-raised); }

@media (max-width: 760px) {
  .nbt-browse-hero { align-items: flex-start; flex-direction: column; min-height: 0; padding: 23px 20px; }
  .nbt-browse-total { align-self: stretch; flex-direction: row; align-items: baseline; justify-content: space-between; }
  .nbt-sort-form { width: 100%; }
  .nbt-sort-form label { display: none; }
  .nbt-sort-form select:first-of-type { flex: 1; min-width: 0; }
  .nbt-torrent { grid-template-columns: 48px minmax(0,1fr) auto; grid-template-areas: "cat main dl" "stats stats stats"; gap: 12px; padding: 14px; }
  .nbt-torrent-cat { grid-area: cat; width: 44px; height: 44px; }
  .nbt-torrent-main { grid-area: main; }
  .nbt-torrent-dl { grid-area: dl; align-self: start; width: 42px; min-width: 42px; height: 42px; padding: 0; }
  .nbt-torrent-stats { grid-area: stats; justify-content: space-between; padding-top: 10px; border-top: 1px solid var(--border); }
  .nbt-detail-head { align-items: flex-start; flex-direction: column; min-height: 0; padding: 22px 19px; }
  .nbt-detail-actions { width: 100%; }
  .nbt-detail-actions .btn { flex: 1 1 auto; justify-content: center; }
  .nbt-detail-grid { grid-template-columns: minmax(0,1fr); }
  .nbt-detail-stats { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 8px 0; }
  .nbt-detail-stats .nbt-torrent-stat { min-width: 0; padding: 7px 5px; }
  .nbt-detail-stats .nbt-torrent-stat:nth-child(4) { border-left: 0; }
  .nbt-edit-hero { align-items: flex-start; flex-wrap: wrap; padding: 17px; }
  .nbt-edit-mark { width: 42px; height: 42px; flex-basis: 42px; }
  .nbt-edit-hero > div:nth-child(2) { flex: 1; min-width: 0; }
  .nbt-edit-back { width: 100%; justify-content: center; margin-left: 0; }
  .nbt-edit-actions { position: sticky; bottom: 6px; width: 100%; justify-content: stretch; }
  .nbt-edit-actions .btn { flex: 1 1 auto; justify-content: center; }
}
@media (max-width: 420px) {
  .nbt-torrent-meta > span:nth-of-type(2) { display: none; }
  .nbt-torrent-stat { min-width: 0; padding: 0 3px; }
  .nbt-torrent-stat b { font-size: 13px; }
  .nbt-torrent-stat small { font-size: 8px; }
  .nbt-detail-title { font-size: 23px; }
  .nbt-edit-actions { flex-wrap: wrap; }
}

/* Torrent pages: compact tracker layout, aligned with the classic NextBit view. */
.nbt-browse,
.nbt-detail,
.nbt-bank { max-width: 1100px; margin-left: auto; margin-right: auto; }
.nbt-browse { gap: 12px; }
.nbt-browse-hero,
.nbt-detail-head {
  min-height: 0;
  padding: 18px 22px;
  border: 1px solid #b9d0ee;
  border-top: 4px solid var(--blue);
  border-radius: 10px;
  background: linear-gradient(110deg, #f8fbff, #fff 62%, #eef6ff);
  color: var(--ink);
  box-shadow: 0 3px 12px rgba(30, 64, 175, .08);
}
.nbt-browse-hero::after,
.nbt-detail-head::after { display: none; }
.nbt-browse-hero h1,
.nbt-detail-title { margin: 4px 0 5px; color: #123c75; font-size: clamp(21px, 3vw, 29px); letter-spacing: -.02em; }
.nbt-browse-hero p { color: var(--muted); font-size: 13px; }
.nbt-browse-hero .nbt-eyebrow,
.nbt-detail .nbt-eyebrow { color: #1765bc; letter-spacing: .1em; }
.nbt-detail-id { color: #6c8098; }
.nbt-browse-total { padding: 8px 12px; border-color: #c6d9f0; border-radius: 8px; background: #fff; }
.nbt-browse-total strong { color: #145ca8; font-size: 21px; }
.nbt-browse-total span { color: var(--muted); }
.nbt-browse-search,
.nbt-browse-filter,
.nbt-detail-stats,
.nbt-detail-grid .nbt-panel,
.nbt-detail > .nbt-panel,
.nbt-bank > .nbt-panel {
  border-radius: 8px;
  box-shadow: none;
}
.nbt-browse-search { padding: 10px 12px; }
.nbt-browse-filter { padding: 12px 14px; }
.nbt-cat-grid { grid-template-columns: repeat(auto-fill, minmax(145px, 1fr)); gap: 5px; }
.nbt-cat-chip { min-height: 31px; padding: 4px 8px; border-radius: 5px; font-size: 11px; }
.nbt-filter-head { margin-bottom: 8px; }
.nbt-filter-foot { margin-top: 9px; padding-top: 9px; }
.nbt-results-bar { margin-top: 15px; }
.nbt-torrent-list { gap: 0; margin-top: 7px; border: 1px solid #bfd3eb; border-radius: 8px; overflow: hidden; background: #fff; }
.nbt-torrent {
  grid-template-columns: 48px minmax(0, 1fr) minmax(230px, auto) 38px;
  gap: 11px;
  padding: 10px 13px;
  border: 0;
  border-bottom: 1px solid #dce7f3;
  border-radius: 0;
  box-shadow: none;
}
.nbt-torrent:last-child { border-bottom: 0; }
.nbt-torrent:nth-child(even) { background: #f8fbff; }
.nbt-torrent:hover { border-color: transparent; background: #edf6ff; box-shadow: none; transform: none; }
.nbt-torrent::before { inset: 0 auto 0 0; width: 3px; }
.nbt-torrent-cat { width: 42px; height: 42px; border-radius: 6px; }
.nbt-torrent-name { font-size: 13px; }
.nbt-torrent-meta { margin-top: 3px; font-size: 10px; }
.nbt-torrent-stat b { font-size: 13px; }
.nbt-torrent-dl { min-width: 34px; min-height: 34px; border-radius: 6px; box-shadow: none; }
.nbt-detail-actions .btn-ghost { border-color: var(--border); background: #fff; color: var(--ink-soft) !important; }
.nbt-detail-download { min-height: 38px; border-color: #78ade4; border-radius: 6px; background: #e9f4ff; box-shadow: none; }
.nbt-detail-stats { padding: 7px 4px; }
.nbt-detail-stats .nbt-torrent-stat { padding: 3px 9px; }
.nbt-detail-stats .nbt-torrent-stat b { font-size: 16px; }
.nbt-detail-grid { gap: 12px; }
.nbt-detail-grid { grid-template-columns: minmax(0, 1fr); }
.nbt-detail-grid { grid-template-columns: minmax(0, 1.45fr) minmax(280px, .85fr); align-items: start; }
.nbt-panel-head { padding-bottom: 8px; border-bottom: 1px solid var(--border); }
.nbt-detail-descr { font-size: 13px; line-height: 1.7; }
.nbt-file-summary { display: flex; flex-wrap: wrap; gap: 0; margin: 11px 0 8px; border: 1px solid #c8daed; border-radius: 7px; background: rgba(255,255,255,.78); overflow: hidden; }
.nbt-file-summary > span { display: grid; grid-template-columns: 17px minmax(0,auto); grid-template-rows: auto auto; column-gap: 6px; align-items: center; min-width: 130px; padding: 7px 11px; border-right: 1px solid #d9e5f1; color: var(--ink-soft); }
.nbt-file-summary > span > i { grid-row: 1 / 3; color: #3979bc; font-size: 12px; }
.nbt-file-summary b { font-size: 12px; line-height: 1.25; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nbt-file-summary b a { color: #174f91 !important; text-decoration: none; }
.nbt-file-summary small { color: var(--muted); font-size: 9px; line-height: 1.2; }
.nbt-file-summary .nbt-status-active { color: var(--green); }
.nbt-file-summary .nbt-status-dead { color: var(--red); }
.nbt-file-hash { display: flex; align-items: center; padding: 7px 11px; color: #245b99; font-size: 11px; cursor: pointer; }
.nbt-file-hash summary { white-space: nowrap; }
.nbt-file-hash summary i { margin-right: 5px; }
.nbt-file-hash code { display: none; max-width: 100%; margin-left: 8px; color: var(--ink-soft); font-size: 10px; overflow-wrap: anywhere; }
.nbt-file-hash[open] code { display: inline; }
.nbt-file-info { position: sticky; top: 14px; background: linear-gradient(160deg, #fff, #f7fbff) !important; }
.nbt-file-info dl { display: flex; flex-direction: column; margin: 0; }
.nbt-file-info dl > div { display: grid; grid-template-columns: minmax(98px, .8fr) minmax(0, 1.2fr); gap: 10px; padding: 10px 2px; border-bottom: 1px solid #e0eaf4; }
.nbt-file-info dl > div:last-child { border-bottom: 0; }
.nbt-file-info dt { color: var(--muted); font-size: 11px; font-weight: 600; }
.nbt-file-info dt i { width: 16px; color: #3678bb; text-align: center; }
.nbt-file-info dd { min-width: 0; margin: 0; color: var(--ink-soft); font-size: 12px; overflow-wrap: anywhere; }
.nbt-file-info dd b { color: var(--ink); }
.nbt-file-info dd small { display: block; margin-top: 2px; color: var(--muted); font-size: 10px; }
.nbt-file-info dd a { color: #195796 !important; text-decoration: none; }
.nbt-file-info .nbt-status-active { color: var(--green); }
.nbt-file-info .nbt-status-dead { color: var(--red); }
.nbt-file-info-hash { display: block !important; }
.nbt-file-info-hash dt { margin-bottom: 5px; }
.nbt-file-info-hash code { display: block; padding: 6px 7px; border: 1px solid #d8e5f1; border-radius: 5px; background: #edf5fd; color: #315b8b; font-size: 10px; line-height: 1.45; word-break: break-all; }
.nbt-detail-poster { display: block; width: fit-content; max-width: 100%; margin: 0 auto 15px; }
.nbt-detail-poster img { display: block; max-width: min(100%, 680px); max-height: 900px; border: 1px solid #c8d8e9; border-radius: 5px; box-shadow: 0 3px 12px rgba(15, 52, 92, .14); }
.nbt-detail-poster-panel { padding-bottom: 4px; background: linear-gradient(155deg, #fff, #f5f9ff); }
.nbt-detail-poster-panel .nbt-detail-poster { margin: 14px auto; }
.nbt-comment-composer { max-width: 860px; margin: 8px auto 18px; padding: 18px; border: 1px solid var(--border); border-top: 4px solid var(--blue); border-radius: 10px; background: var(--surface); box-shadow: var(--shadow-sm); }
.nbt-comment-composer-head { display: flex; align-items: flex-start; gap: 12px; margin-bottom: 15px; }
.nbt-comment-composer-head i { display: grid; width: 36px; height: 36px; place-items: center; border-radius: 8px; background: var(--blue-soft); color: var(--blue); }
.nbt-comment-composer h1 { margin: 0; color: var(--ink); font-size: 19px; }
.nbt-comment-composer p { margin: 2px 0 0; color: var(--muted); font-size: 12px; }
.nbt-comment-form { display: flex; flex-direction: column; gap: 10px; }
.nbt-comment-form textarea { width: 100%; min-height: 180px; padding: 11px 12px; resize: vertical; line-height: 1.7; }
.nbt-comment-form-actions { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: center; gap: 8px; }
.nbt-comment-form-actions small { color: var(--muted); }
.nbt-comment-recent { max-width: 860px; margin: 0 auto; padding: 15px 18px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface); }
.nbt-comment-recent h2 { margin: 0 0 8px; font-size: 14px; }
.nbt-comment-preview { padding: 9px 0; border-top: 1px solid var(--border); }
.nbt-comment-preview-meta { display: flex; flex-wrap: wrap; gap: 7px; color: var(--muted); font-size: 10px; }
.nbt-comment-preview-text { margin-top: 3px; color: var(--ink-soft); font-size: 12px; line-height: 1.65; overflow-wrap: anywhere; }
.nbt-edit-hero { margin-bottom: 12px; padding: 15px 18px; border-top: 4px solid var(--blue); border-radius: 9px; box-shadow: none; }
.nbt-edit-mark { width: 40px; height: 40px; flex-basis: 40px; border-radius: 8px; }
.nbt-bank > .nbt-panel { margin-bottom: 10px; }
.nbt-edit-actions { padding: 7px; border-radius: 8px; box-shadow: 0 4px 16px rgba(16,35,63,.13); }
@media (max-width: 760px) {
  .nbt-torrent { grid-template-columns: 43px minmax(0, 1fr) 36px; padding: 10px; }
  .nbt-torrent-cat { width: 38px; height: 38px; }
  .nbt-file-summary > span { flex: 1 1 130px; border-bottom: 1px solid #d9e5f1; }
  .nbt-file-hash { flex: 1 1 100%; }
  .nbt-detail-grid { grid-template-columns: minmax(0, 1fr); }
  .nbt-file-info { position: static; }
  .nbt-detail-poster img { width: 100%; max-height: none; }
}

/* High-contrast torrent identity: the filename and its metadata stay readable at a glance. */
.nbt-detail-head {
  background: linear-gradient(115deg, #0d315d 0%, #164f8c 62%, #2373b8 100%);
  border-color: #0f4f94;
  border-top-color: #63b2ff;
  color: #fff;
}
.nbt-detail .nbt-eyebrow { color: #b8ddff; }
.nbt-detail-id { color: #d8eaff; }
.nbt-detail-title { color: #fff; text-shadow: 0 1px 1px rgba(0,0,0,.18); }
.nbt-detail-meta .nbt-chip { border-color: rgba(255,255,255,.25); background: rgba(255,255,255,.13); color: #fff; }
.nbt-detail-meta .nbt-chip-link { color: #fff !important; }
.nbt-detail-actions .btn-ghost { border-color: rgba(255,255,255,.45); background: rgba(255,255,255,.95); color: #163d69 !important; }

/* Metadata needs its own contrast so it remains legible regardless of the header background. */
.nbt-detail-meta .nbt-chip {
  border-color: #2a6cab !important;
  background: #195790 !important;
  color: #fff !important;
  font-weight: 700;
  text-shadow: none;
}
.nbt-detail-meta .nbt-chip-link,
.nbt-detail-meta .nbt-chip-link:visited { color: #fff !important; }
.nbt-detail-meta .nbt-chip-gold { border-color: #a86b00 !important; background: #9a6200 !important; }
.nbt-detail-meta .nbt-chip-purple { border-color: #7044a6 !important; background: #65389b !important; }
.nbt-detail-meta .nbt-chip-red { border-color: #a93232 !important; background: #9e2929 !important; }

/* Torrent details: peers drawer + comments panel */
.nbt-detail-stats a.nbt-torrent-stat { text-decoration: none; }
.nbt-detail-stats a.nbt-torrent-stat:hover { background: var(--surface-soft); border-radius: 6px; }
.nbt-panel-head h3 small { margin-left: 4px; padding: 1px 8px; border-radius: 999px; background: var(--blue-soft); color: var(--blue-ink); font-size: 11px; font-weight: 700; vertical-align: middle; }
.nbt-peers > summary { list-style: none; cursor: pointer; margin-bottom: 0; }
.nbt-peers > summary::-webkit-details-marker { display: none; }
.nbt-peers[open] > summary { margin-bottom: 12px; }
.nbt-peers:not([open]) > summary { padding-bottom: 0; border-bottom: 0; }
.nbt-peers-toggle { margin-left: auto; pointer-events: none; }
.nbt-peers .when-open, .nbt-peers[open] .when-closed { display: none; }
.nbt-peers[open] .when-open { display: inline; }
.nbt-peers > summary:focus-visible { outline: none; box-shadow: var(--focus); border-radius: 6px; }
.nbt-peer-groups { display: flex; flex-direction: column; gap: 16px; }
.nbt-peer-group-title { display: flex; align-items: center; gap: 7px; margin: 0 0 8px; color: var(--ink-soft); font-size: 13px; }
.nbt-peer-group-seed .nbt-peer-group-title i { color: var(--green); }
.nbt-peer-group-leech .nbt-peer-group-title i { color: var(--red); }
.nbt-peer-count { padding: 0 8px; border-radius: 999px; background: var(--surface-soft); border: 1px solid var(--border); color: var(--muted); font-size: 11px; }
.nbt-peer-list { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; border: 1px solid var(--border); border-radius: 8px; overflow: hidden; }
.nbt-peer { display: grid; grid-template-columns: minmax(170px, 1.2fr) minmax(120px, .8fr) minmax(200px, 1.3fr); grid-template-areas: "who prog nums" "meta meta meta"; gap: 6px 16px; align-items: center; padding: 10px 13px; border-bottom: 1px solid var(--border); background: var(--surface); }
.nbt-peer:nth-child(even) { background: #f8fbff; }
.nbt-peer:last-child { border-bottom: 0; }
.nbt-peer-who { grid-area: who; display: flex; align-items: center; gap: 10px; min-width: 0; }
.nbt-peer-who > div { display: flex; flex-direction: column; min-width: 0; }
.nbt-peer-avatar { display: grid; flex: 0 0 32px; width: 32px; height: 32px; place-items: center; border-radius: 50%; background: var(--blue-soft); color: var(--blue-ink); font-weight: 800; font-size: 13px; }
.nbt-peer-group-seed .nbt-peer-avatar { background: #dcfce7; color: #166534; }
.nbt-peer-name { font-weight: 700; font-size: 13px; text-decoration: none; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nbt-peer-ip { color: var(--muted); font-size: 10px; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; }
.nbt-peer-progress { grid-area: prog; display: flex; align-items: center; gap: 8px; }
.nbt-peer-bar { flex: 1; height: 7px; border-radius: 999px; background: #e3ebf5; overflow: hidden; }
.nbt-peer-bar span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue), var(--cyan)); }
.nbt-peer-group-seed .nbt-peer-bar span { background: linear-gradient(90deg, #16a34a, #4ade80); }
.nbt-peer-progress small { min-width: 42px; color: var(--ink-soft); font-size: 11px; font-weight: 700; text-align: right; font-variant-numeric: tabular-nums; }
.nbt-peer-nums { grid-area: nums; display: flex; flex-wrap: wrap; justify-content: flex-end; gap: 4px 14px; font-size: 12px; font-variant-numeric: tabular-nums; }
.nbt-peer-nums i { font-size: 10px; }
.nbt-peer-nums .fa-arrow-up { color: var(--green); }
.nbt-peer-nums .fa-arrow-down { color: var(--red); }
.nbt-peer-nums small { color: var(--muted); font-size: 10px; }
.nbt-peer-ratio { color: var(--muted); }
.nbt-peer-meta { grid-area: meta; display: flex; flex-wrap: wrap; align-items: center; gap: 4px 14px; padding-left: 42px; color: var(--muted); font-size: 11px; }
.nbt-peer-meta i { margin-right: 3px; font-size: 10px; }
.nbt-peer-badge { padding: 1px 8px; border-radius: 999px; font-weight: 700; font-size: 10px; }
.nbt-peer-badge.ok { background: #dcfce7; color: #166534; }
.nbt-peer-badge.bad { background: #fee2e2; color: #991b1b; }
.nbt-peer-empty { margin: 4px 0; padding: 12px; border: 1px dashed var(--border-strong); border-radius: 8px; background: var(--surface-soft); color: var(--muted); font-size: 12px; text-align: center; }
.nbt-peer-error { display: block; color: var(--muted); font-size: 12px; }
.nbt-comments-panel { scroll-margin-top: 16px; }
.nbt-comments-panel .nbt-comments { margin: 4px 0 0; }
.nbt-comments-panel .nbt-comment { box-shadow: none; background: var(--surface-soft); }
.nbt-comment:target { border-color: var(--blue); box-shadow: var(--focus); }
.nbt-comment-date { text-decoration: none; }
.nbt-comment-tools a { color: var(--muted); font-size: 11px; text-decoration: none; }
.nbt-comment-tools a:hover { color: var(--blue); }
.nbt-comments-empty { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 26px 16px; color: var(--muted); text-align: center; }
.nbt-comments-empty span { font-size: 30px; }
.nbt-comments-empty p { margin: 0; font-size: 13px; }
@media (max-width: 760px) {
  .nbt-peer { grid-template-columns: minmax(0, 1fr); grid-template-areas: "who" "prog" "nums" "meta"; gap: 7px; }
  .nbt-peer-nums { justify-content: flex-start; }
  .nbt-peer-meta { padding-left: 0; }
  .nbt-peers-toggle { padding: 6px 10px; font-size: 12px; }
}

/* Torrent details hero: centred cover, title, compact chips and actions */
.nbt-detail-head.nbt-detail-hero { position: relative; isolation: isolate; display: flex; flex-direction: column; align-items: center; gap: 18px; padding: 30px 24px 24px; overflow: hidden; border: 0; border-radius: 16px; background: linear-gradient(160deg, #0b2547 0%, #12406f 55%, #1d65a6 100%); text-align: center; box-shadow: 0 14px 34px rgba(11, 37, 71, .22); }
.nbt-hero-backdrop { position: absolute; inset: -40px; z-index: -1; background-position: center; background-size: cover; filter: blur(38px) saturate(1.2); opacity: .35; }
.nbt-detail-hero::before { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(8, 26, 52, .35), rgba(8, 26, 52, .8)); content: ""; }
.nbt-detail-hero .nbt-detail-heading { display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 820px; }
.nbt-detail-hero .nbt-eyebrow { justify-content: center; color: #9fd0ff; font-size: 10px; letter-spacing: .18em; }
.nbt-detail-hero .nbt-detail-id { padding: 1px 7px; border-radius: 999px; background: rgba(255,255,255,.12); color: #e6f2ff; letter-spacing: .04em; }
.nbt-hero-poster { display: block; margin: 16px auto 4px; line-height: 0; }
.nbt-hero-poster img { display: block; max-width: min(100%, 340px); max-height: 460px; border: 3px solid rgba(255,255,255,.9); border-radius: 10px; box-shadow: 0 18px 40px rgba(0,0,0,.45); transition: transform .2s ease; }
.nbt-hero-poster:hover img { transform: translateY(-3px); }
.nbt-detail-hero .nbt-detail-title { width: 100%; margin: 14px 0 12px; color: #fff; font-size: clamp(22px, 3.4vw, 32px); line-height: 1.25; text-align: center; text-shadow: 0 2px 10px rgba(0,0,0,.3); }
.nbt-detail-hero .nbt-detail-meta { justify-content: center; gap: 6px; }
.nbt-detail-hero .nbt-detail-meta .nbt-chip { padding: 4px 11px; border: 1px solid rgba(255,255,255,.2) !important; border-radius: 999px; background: rgba(255,255,255,.12) !important; font-size: 12px; font-weight: 600; backdrop-filter: blur(6px); }
.nbt-detail-hero .nbt-detail-meta .nbt-chip-gold { border-color: #fbbf24 !important; background: rgba(245,158,11,.85) !important; }
.nbt-detail-hero .nbt-detail-meta .nbt-chip-purple { border-color: #c4b5fd !important; background: rgba(124,58,237,.8) !important; }
.nbt-detail-hero .nbt-detail-meta .nbt-chip-red { border-color: #fca5a5 !important; background: rgba(220,38,38,.85) !important; }
.nbt-detail-hero .nbt-detail-actions { justify-content: center; gap: 8px; width: auto; }
.nbt-detail-hero .nbt-detail-actions .btn { min-height: 40px; padding: 8px 16px; border-radius: 999px; font-size: 13px; }
.nbt-detail-hero .nbt-detail-download { border: 0; background: linear-gradient(135deg, #38bdf8, #2563eb); color: #fff !important; box-shadow: 0 8px 20px rgba(37,99,235,.45); }
.nbt-detail-hero .nbt-detail-download:hover { filter: brightness(1.08); background: linear-gradient(135deg, #38bdf8, #2563eb); }
.nbt-detail-hero .nbt-detail-actions .btn-ghost { border: 1px solid rgba(255,255,255,.35); background: rgba(255,255,255,.1); color: #fff !important; }
.nbt-detail-hero .nbt-detail-actions .btn-ghost:hover { background: rgba(255,255,255,.2); }
@media (max-width: 760px) {
  .nbt-detail-head.nbt-detail-hero { padding: 22px 16px 18px; align-items: center; }
  .nbt-hero-poster img { max-width: min(100%, 240px); max-height: 340px; }
  .nbt-detail-hero .nbt-detail-actions { width: 100%; }
  .nbt-detail-hero .nbt-detail-actions .btn { flex: 1 1 auto; justify-content: center; }
}
.nbt-detail-poster-panel .nbt-detail-poster { display: flex; justify-content: center; width: 100%; margin: 14px auto; }
.nbt-detail-poster-panel .nbt-detail-poster img { margin: 0 auto; }
.nbt-detail-poster-panel .nbt-panel-head { justify-content: center; }

/* --- Details polish v2: fix invisible ghost buttons, peers toggle, overall look --- */
.nbt-detail-hero .nbt-detail-actions a.btn.btn-ghost {
  border: 1px solid rgba(255,255,255,.4) !important;
  background: rgba(255,255,255,.14) !important;
  color: #fff !important;
  backdrop-filter: blur(6px);
}
.nbt-detail-hero .nbt-detail-actions a.btn.btn-ghost:hover { background: rgba(255,255,255,.28) !important; color: #fff !important; }
.nbt-detail-hero .nbt-detail-actions a.btn.nbt-detail-download { border: 0 !important; }

.nbt-peers-toggle,
.nbt-peers .nbt-peers-toggle.btn.btn-ghost {
  display: inline-flex; align-items: center; justify-content: center; gap: 6px;
  padding: 8px 16px; border-radius: 999px; font-size: 13px; font-weight: 700; line-height: 1.2;
  background: linear-gradient(135deg, #38bdf8, #2563eb) !important; color: #fff !important;
  border: 0 !important; box-shadow: 0 6px 16px rgba(37,99,235,.28) !important;
  pointer-events: none; white-space: nowrap;
}
.nbt-peers[open] .nbt-peers-toggle.btn.btn-ghost { background: var(--surface) !important; color: var(--ink-soft) !important; border: 1px solid var(--border-strong) !important; box-shadow: none !important; }
.nbt-peers > summary:hover .nbt-peers-toggle { filter: brightness(1.08); }
.nbt-peers .when-closed, .nbt-peers .when-open { display: inline-flex; align-items: center; gap: 6px; }
.nbt-peers[open] .when-closed { display: none; }
.nbt-peers:not([open]) .when-open { display: none; }

/* overall look */
.nbt-detail { gap: 16px; }
.nbt-detail-stats { display: grid; grid-template-columns: repeat(6, minmax(0,1fr)); gap: 10px; padding: 0; border: 0; background: transparent; box-shadow: none; }
.nbt-detail-stats .nbt-torrent-stat,
.nbt-detail-stats .nbt-torrent-stat + .nbt-torrent-stat { min-width: 0; padding: 14px 8px 12px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); box-shadow: 0 4px 14px rgba(30,64,175,.06); align-items: center; text-align: center; transition: transform .15s ease, box-shadow .15s ease; }
.nbt-detail-stats .nbt-torrent-stat:hover { transform: translateY(-2px); box-shadow: 0 8px 20px rgba(30,64,175,.12); }
.nbt-detail-stats .nbt-torrent-stat i { display: grid; place-items: center; width: 30px; height: 30px; margin-bottom: 6px; border-radius: 50%; background: var(--blue-soft); color: var(--blue); font-size: 13px; }
.nbt-detail-stats .nbt-stat-seed i { background: #dcfce7; color: #16a34a; }
.nbt-detail-stats .nbt-stat-leech i { background: #fee2e2; color: #dc2626; }
.nbt-detail-stats .nbt-torrent-stat b { font-size: 20px; line-height: 1.1; }
.nbt-detail-stats .nbt-torrent-stat small { margin-top: 3px; font-size: 11px; }

.nbt-detail .nbt-panel { padding: 18px 20px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: 0 4px 16px rgba(30,64,175,.05); }
.nbt-detail .nbt-panel-head { margin-bottom: 14px; padding-bottom: 12px; }
.nbt-detail .nbt-panel-icon { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--blue-soft); font-size: 16px; }
.nbt-detail .nbt-panel-head h3 { font-size: 15px; letter-spacing: -.01em; }
.nbt-detail-grid .nbt-panel:first-child { background: var(--surface); }
.nbt-detail-poster-panel { text-align: center; }
.nbt-detail-poster-panel .nbt-panel-head { justify-content: center; }
.nbt-detail-poster-panel .nbt-detail-poster img { border: 0; border-radius: 12px; box-shadow: 0 14px 34px rgba(15,52,92,.28); }
.nbt-file-info dl > div { padding: 11px 4px; }
.nbt-file-info-hash code { border-radius: 8px; }
.nbt-snatchers .nbt-chip { padding: 5px 12px; border-radius: 999px; background: var(--surface-soft); border: 1px solid var(--border); }
.nbt-snatchers .nbt-chip:hover { background: var(--blue-soft); }

.nbt-peers > summary { padding-bottom: 0; }
.nbt-peer-list { border-radius: 12px; }
.nbt-peer { padding: 12px 15px; transition: background .12s ease; }
.nbt-peer:hover { background: var(--blue-soft) !important; }
.nbt-peer-group-title { padding-left: 2px; font-size: 14px; }

.nbt-comments-panel .nbt-comment { padding: 16px 18px; border-radius: 12px; }
.nbt-comments-panel .nbt-comment-avatar img { width: 48px; height: 48px; }
.nbt-comments-panel .nbt-comment-head { padding-bottom: 8px; margin-bottom: 8px; border-bottom: 1px dashed var(--border); }

@media (max-width: 760px) {
  .nbt-detail-stats { grid-template-columns: repeat(3, minmax(0,1fr)); }
  .nbt-detail .nbt-panel { padding: 15px 14px; }
  .nbt-detail-stats .nbt-torrent-stat:nth-child(4) { border-left: 1px solid var(--border); }
}

/* ===== BBCode output (details, comments, preview) ===== */
.nbt-detail-descr, .nbt-comment-text, .nbt-bb, .nbt-composer-preview-body { overflow-wrap: anywhere; }
.nbt-bb-center { text-align: center; }
.nbt-bb-left { text-align: left; }
.nbt-bb-right { text-align: right; }
.nbt-bb-hr { height: 1px; margin: 14px 0; border: 0; background: var(--border-strong); }
.nbt-bb-h1, .nbt-bb-h2, .nbt-bb-h3 { margin: 12px 0 6px; font-weight: 800; line-height: 1.3; color: var(--ink); }
.nbt-bb-h1 { font-size: 24px; } .nbt-bb-h2 { font-size: 19px; } .nbt-bb-h3 { font-size: 16px; }
.nbt-bb-img, .nbt-detail-descr img, .nbt-comment-text img:not([src*="smilies"]), .nbt-bb img:not([src*="smilies"]) { max-width: 100%; height: auto; border-radius: 8px; }
.nbt-bb-quote { margin: 10px 0; padding: 10px 14px; border: 1px solid var(--border); border-left: 4px solid var(--blue); border-radius: 8px; background: var(--surface-soft); color: var(--ink-soft); }
.nbt-bb-quote-by { margin-bottom: 4px; color: var(--blue-ink); font-size: 12px; font-weight: 700; }
.nbt-bb-code { margin: 10px 0; padding: 12px 14px; border-radius: 10px; background: #0f1b2d; color: #d7e6ff; font: 12px/1.6 ui-monospace, SFMono-Regular, Menlo, monospace; white-space: pre-wrap; overflow-x: auto; }
.nbt-bb-list { margin: 8px 0; padding-left: 24px; }
.nbt-bb-spoiler { margin: 8px 0; border: 1px solid var(--border); border-radius: 8px; background: var(--surface-soft); }
.nbt-bb-spoiler > summary { padding: 8px 12px; cursor: pointer; font-weight: 700; color: var(--blue-ink); }
.nbt-bb-spoiler[open] > summary { border-bottom: 1px solid var(--border); }
.nbt-bb-spoiler > *:not(summary) { padding: 0 12px; }

/* ===== Composer (comments / edit torrent / upload) ===== */
.nbt-composer { border-radius: 12px; }
.nbt-composer:focus-within { border-color: var(--blue); box-shadow: var(--focus); }
.nbt-composer-toolbar { align-items: center; gap: 6px; padding: 8px 10px; }
.nbt-composer-group { display: inline-flex; align-items: center; gap: 3px; padding-right: 8px; border-right: 1px solid var(--border-strong); }
.nbt-composer-group:last-of-type { border-right: 0; }
.nbt-composer-toolbar button { height: 34px; min-width: 34px; }
.nbt-composer-select select { height: 34px; padding: 0 6px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--ink-soft); font-size: 13px; cursor: pointer; }
.nbt-composer-color { position: relative; display: inline-flex; align-items: center; justify-content: center; width: 34px; height: 34px; border: 1px solid var(--border); border-radius: 8px; background: var(--surface); color: var(--ink-soft); cursor: pointer; }
.nbt-composer-color input { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.nbt-composer-template { border-color: #a78bfa !important; background: #f3efff !important; color: #6d28d9 !important; font-weight: 700; gap: 6px; }
.nbt-composer-preview-toggle { gap: 5px; font-weight: 600; }
.nbt-composer-preview-toggle[aria-expanded="true"] { border-color: var(--blue) !important; background: var(--blue-soft) !important; color: var(--blue-ink) !important; }
.nbt-composer-input { min-height: 200px; max-height: 640px; resize: vertical; font-family: inherit; }
.nbt-composer-preview { padding: 14px 16px; border-top: 1px dashed var(--border-strong); background: var(--surface-soft); }
.nbt-composer-preview-empty { margin: 0; color: var(--muted); font-size: 12px; }
.nbt-composer-foot { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px; padding: 8px 12px; border-top: 1px solid var(--border); background: var(--surface-soft); color: var(--muted); font-size: 11px; }
.nbt-composer-hint a { color: var(--blue); }

/* Comment add/edit page */
.nbt-comment-composer { max-width: 900px; padding: 22px; border-radius: 16px; box-shadow: 0 8px 28px rgba(30,64,175,.1); }
.nbt-comment-composer-head i { width: 42px; height: 42px; border-radius: 12px; font-size: 18px; }
.nbt-comment-form-actions { padding-top: 4px; }
.nbt-comment-form-actions > div { display: flex; flex-wrap: wrap; gap: 8px; }
.nbt-comment-form-actions .btn { min-height: 42px; border-radius: 999px; padding: 8px 20px; }

/* Edit torrent page */
.nbt-bank .nbt-form-field > label { margin-bottom: 5px; font-weight: 700; font-size: 13px; }
.nbt-bank .nbt-form-field small { display: block; margin-top: 6px; color: var(--muted); font-size: 12px; }
.nbt-bank input[type="text"], .nbt-bank select { min-height: 42px; border-radius: 10px; }
.nbt-bank .nbt-panel { padding: 18px 20px; border-radius: 14px; }

@media (max-width: 760px) {
  .nbt-composer-toolbar { gap: 6px 4px; padding: 8px; }
  .nbt-composer-group { padding-right: 4px; }
  .nbt-composer-toolbar button, .nbt-composer-color, .nbt-composer-select select { height: 40px; min-width: 40px; }
  .nbt-composer-emoji-toggle { margin-left: 0; }
  .nbt-composer-template span, .nbt-composer-emoji-toggle span, .nbt-composer-preview-toggle span { display: inline; }
  .nbt-composer-input { font-size: 16px; min-height: 180px; }
  .nbt-comment-composer { padding: 16px 14px; margin: 6px 0 14px; }
  .nbt-comment-form-actions { flex-direction: column-reverse; align-items: stretch; }
  .nbt-comment-form-actions > div { flex-direction: column-reverse; }
  .nbt-comment-form-actions .btn { width: 100%; }
  .nbt-comment-form-actions small { text-align: center; }
  .nbt-bank .nbt-form-row { flex-direction: column; }
  .nbt-bank .nbt-panel { padding: 15px 13px; }
  .nbt-bb-code { font-size: 11px; }
}

/* ===================== Browse page (nbt-bw) ===================== */
.nbt-bw, .nbt-bw-list { max-width: 1100px; margin-left: auto; margin-right: auto; }
.nbt-bw { display: flex; flex-direction: column; gap: 14px; }
.nbt-bw-hero { position: relative; isolation: isolate; display: flex; flex-direction: column; gap: 20px; padding: 26px 28px; overflow: hidden; border-radius: 20px; background: radial-gradient(circle at 88% 0%, rgba(56,189,248,.35), transparent 34%), linear-gradient(120deg, #0b2547 0%, #12406f 55%, #1d65a6 100%); color: #fff; box-shadow: 0 16px 38px rgba(11,37,71,.22); }
.nbt-bw-hero::after { position: absolute; z-index: -1; right: 6%; bottom: -150px; width: 320px; height: 320px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; box-shadow: 0 0 0 30px rgba(255,255,255,.03), 0 0 0 64px rgba(255,255,255,.02); content: ""; }
.nbt-bw-hero-top { display: flex; align-items: flex-end; justify-content: space-between; gap: 16px; }
.nbt-bw-eyebrow { color: #9fd0ff; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-bw-hero h1 { margin: 6px 0 4px; color: #fff; font-size: clamp(24px, 4vw, 34px); line-height: 1.15; letter-spacing: -.03em; }
.nbt-bw-hero p { margin: 0; color: rgba(235,245,255,.8); font-size: 14px; }
.nbt-bw-total { display: flex; flex: 0 0 auto; flex-direction: column; align-items: center; padding: 10px 18px; border: 1px solid rgba(255,255,255,.22); border-radius: 14px; background: rgba(255,255,255,.1); backdrop-filter: blur(8px); }
.nbt-bw-total strong { font-size: 26px; line-height: 1; font-variant-numeric: tabular-nums; }
.nbt-bw-total span { margin-top: 4px; color: rgba(235,245,255,.75); font-size: 11px; }
.nbt-bw-search { display: flex; align-items: center; gap: 10px; padding: 6px 6px 6px 16px; border-radius: 999px; background: #fff; box-shadow: 0 10px 28px rgba(0,0,0,.2); }
.nbt-bw-search > i { color: #64748b; }
.nbt-bw-search input[type="search"] { flex: 1 1 auto; min-width: 0; height: 42px; padding: 0 4px; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--ink); font-size: 15px; outline: none; }
.nbt-bw-search button { flex: 0 0 auto; height: 42px; padding: 0 24px; border: 0; border-radius: 999px; background: linear-gradient(135deg, #38bdf8, #2563eb); color: #fff; font-size: 14px; font-weight: 700; cursor: pointer; }
.nbt-bw-search button:hover { filter: brightness(1.08); }
.nbt-bw-clear { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: #eef2f7; color: #64748b !important; text-decoration: none !important; }

.nbt-bw-cats { display: flex; gap: 8px; padding: 2px 2px 6px; overflow-x: auto; scrollbar-width: thin; -webkit-overflow-scrolling: touch; }
.nbt-bw-cat { flex: 0 0 auto; padding: 8px 15px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--ink-soft) !important; font-size: 13px; font-weight: 600; text-decoration: none !important; white-space: nowrap; transition: all .15s ease; }
.nbt-bw-cat:hover { border-color: var(--blue); color: var(--blue) !important; }
.nbt-bw-cat.is-active { border-color: transparent; background: linear-gradient(135deg, #38bdf8, #2563eb); color: #fff !important; box-shadow: 0 6px 16px rgba(37,99,235,.3); }

.nbt-bw-tools { display: flex; flex-wrap: wrap; align-items: flex-start; justify-content: space-between; gap: 10px; }
.nbt-bw-status { display: inline-flex; padding: 4px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); }
.nbt-bw-status a { padding: 7px 14px; border-radius: 999px; color: var(--muted) !important; font-size: 13px; font-weight: 600; text-decoration: none !important; white-space: nowrap; }
.nbt-bw-status a.is-active { background: var(--blue-soft); color: var(--blue-ink) !important; }
.nbt-bw-multi { flex: 1 1 100%; order: 3; }
.nbt-bw-multi > summary { display: inline-flex; align-items: center; gap: 7px; padding: 7px 14px; border: 1px dashed var(--border-strong); border-radius: 999px; color: var(--muted); font-size: 13px; font-weight: 600; cursor: pointer; list-style: none; }
.nbt-bw-multi > summary::-webkit-details-marker { display: none; }
.nbt-bw-multi[open] > summary { border-style: solid; color: var(--blue-ink); background: var(--blue-soft); }
.nbt-bw-multi-form { margin-top: 10px; padding: 14px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); }
.nbt-bw-multi-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(160px, 1fr)); gap: 6px; margin-bottom: 12px; }
.nbt-bw-check { display: flex; align-items: center; gap: 8px; padding: 7px 10px; border: 1px solid var(--border); border-radius: 9px; font-size: 13px; cursor: pointer; }
.nbt-bw-check:has(input:checked) { border-color: var(--blue); background: var(--blue-soft); color: var(--blue-ink); font-weight: 700; }

.nbt-bw-context { flex-direction: row; align-items: baseline; flex-wrap: wrap; gap: 8px; margin-top: 6px; color: var(--muted); }
.nbt-bw-context strong { color: var(--ink); font-size: 18px; }
.nbt-bw-bar { flex-direction: row; align-items: center; justify-content: space-between; margin-top: 8px; }
.nbt-bw-bar > strong { font-size: 17px; }
.nbt-bw-bar > strong small { color: var(--muted); font-size: 12px; font-weight: 500; }
.nbt-bw-sort { display: flex; align-items: center; gap: 6px; }
.nbt-bw-sort label { color: var(--muted); }
.nbt-bw-sort select { min-height: 38px; padding: 4px 10px; border-radius: 10px; font-size: 13px; }

.nbt-bw-pager { max-width: 1100px; margin: 10px auto; }
.nbt-bw-pager p { margin: 4px 0; line-height: 2; }
.nbt-bw-pager a { display: inline-block; padding: 1px 9px; border-radius: 999px; text-decoration: none; }
.nbt-bw-pager a:hover { background: var(--blue-soft); }
.nbt-bw-pager font { color: inherit !important; }
.nbt-bw-pager b { font-weight: 700; }

.nbt-bw-list { display: flex; flex-direction: column; gap: 10px; }
.nbt-bw-item { position: relative; display: grid; grid-template-columns: 76px minmax(0, 1fr) auto auto; align-items: center; gap: 16px; padding: 12px 16px 12px 12px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); box-shadow: 0 3px 12px rgba(30,64,175,.05); transition: transform .15s ease, box-shadow .15s ease, border-color .15s ease; }
.nbt-bw-item:hover { transform: translateY(-2px); border-color: #b5cdf0; box-shadow: 0 12px 28px rgba(30,64,175,.13); }
.nbt-bw-item.is-dead { opacity: .82; }
.nbt-bw-item.is-nuked { border-color: #fca5a5; background: linear-gradient(90deg, #fff5f5, var(--surface) 40%); }
.nbt-bw-thumb { position: relative; display: block; width: 76px; height: 100px; overflow: hidden; border-radius: 11px; background: linear-gradient(145deg, #e8f1ff, #d3e4fb); }
.nbt-bw-thumb > img { position: absolute; inset: 0; z-index: 1; width: 100%; height: 100%; object-fit: cover; }
.nbt-bw-thumb-fallback { position: absolute; inset: 0; display: grid; place-items: center; color: #7aa2d6; font-size: 26px; }
.nbt-bw-thumb-fallback img { max-width: 44px; max-height: 44px; object-fit: contain; }
.nbt-bw-body { min-width: 0; }
.nbt-bw-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 5px; margin-bottom: 4px; }
.nbt-bw-catlink { padding: 2px 10px; border-radius: 999px; background: var(--blue-soft); color: var(--blue-ink) !important; font-size: 11px; font-weight: 700; text-decoration: none !important; }
.nbt-bw-tag { padding: 2px 9px; border-radius: 999px; background: #eef2f7; color: #475569; font-size: 11px; font-weight: 700; }
.nbt-bw-tag.is-new { background: #fee2e2; color: #b91c1c; }
.nbt-bw-tag.is-free { background: #fef3c7; color: #92400e; }
.nbt-bw-tag.is-up { background: #ede9fe; color: #6d28d9; }
.nbt-bw-tag.is-nuked { background: #dc2626; color: #fff; }
.nbt-bw-title { display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; color: var(--ink) !important; font-size: 16px; font-weight: 700; line-height: 1.4; text-decoration: none !important; overflow-wrap: anywhere; }
.nbt-bw-title:hover { color: var(--blue) !important; }
.nbt-bw-item.is-nuked .nbt-bw-title { text-decoration: line-through !important; color: #7f1d1d !important; }
.nbt-bw-meta { display: flex; flex-wrap: wrap; gap: 3px 14px; margin-top: 6px; color: var(--muted); font-size: 12px; }
.nbt-bw-meta i { margin-right: 4px; color: #8aa0bd; font-size: 11px; }
.nbt-bw-meta a { color: var(--ink-soft); text-decoration: none; }
.nbt-bw-meta a:hover { color: var(--blue); }
.nbt-bw-stats { display: flex; gap: 6px; }
.nbt-bw-stats span { display: flex; flex-direction: column; align-items: center; min-width: 52px; padding: 7px 8px; border-radius: 11px; background: var(--surface-soft); color: var(--muted); font-size: 11px; }
.nbt-bw-stats b { color: var(--ink); font-size: 16px; line-height: 1.2; font-variant-numeric: tabular-nums; }
.nbt-bw-stats .is-seed { background: #e8f9ee; color: #16a34a; } .nbt-bw-stats .is-seed b { color: #15803d; }
.nbt-bw-stats .is-leech { background: #fdecec; color: #dc2626; } .nbt-bw-stats .is-leech b { color: #b91c1c; }
.nbt-bw-dl { display: inline-flex; align-items: center; justify-content: center; gap: 7px; height: 44px; padding: 0 18px; border-radius: 999px; background: linear-gradient(135deg, #38bdf8, #2563eb); color: #fff !important; font-size: 13px; font-weight: 700; text-decoration: none !important; box-shadow: 0 6px 16px rgba(37,99,235,.3); white-space: nowrap; }
.nbt-bw-dl:hover { filter: brightness(1.08); }

@media (max-width: 860px) {
  .nbt-bw-item { grid-template-columns: 64px minmax(0, 1fr) 44px; grid-template-areas: "thumb body dl" "stats stats stats"; gap: 10px 12px; padding: 12px; }
  .nbt-bw-thumb { grid-area: thumb; width: 64px; height: 86px; }
  .nbt-bw-body { grid-area: body; }
  .nbt-bw-dl { grid-area: dl; align-self: start; width: 44px; padding: 0; }
  .nbt-bw-dl span { display: none; }
  .nbt-bw-stats { grid-area: stats; padding-top: 10px; border-top: 1px solid var(--border); }
  .nbt-bw-stats span { flex: 1 1 0; flex-direction: row; justify-content: center; gap: 6px; min-width: 0; }
}
@media (max-width: 560px) {
  .nbt-bw-hero { padding: 20px 16px; border-radius: 16px; gap: 16px; }
  .nbt-bw-hero-top { align-items: flex-start; }
  .nbt-bw-hero p { display: none; }
  .nbt-bw-total { padding: 8px 12px; } .nbt-bw-total strong { font-size: 20px; }
  .nbt-bw-search { padding-left: 14px; }
  .nbt-bw-search button { padding: 0 16px; }
  .nbt-bw-tools { flex-direction: column; align-items: stretch; }
  .nbt-bw-status { display: flex; } .nbt-bw-status a { flex: 1 1 0; text-align: center; padding: 8px 4px; font-size: 12px; }
  .nbt-bw-bar { flex-wrap: wrap; gap: 8px; }
  .nbt-bw-sort { width: 100%; } .nbt-bw-sort select { flex: 1 1 0; min-width: 0; }
  .nbt-bw-title { font-size: 15px; }
  .nbt-bw-meta span:nth-child(3) { display: none; }
  .nbt-bw-pager p { font-size: 12px; }
}

/* Browse: visible category checkboxes */
.nbt-bw-filter { padding: 16px 18px; border: 1px solid var(--border); border-radius: 16px; background: var(--surface); box-shadow: 0 4px 16px rgba(30,64,175,.06); }
.nbt-bw-filter-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 12px; font-weight: 700; font-size: 14px; }
.nbt-bw-filter-head small { color: var(--muted); font-weight: 500; }
.nbt-bw-filter-links { display: inline-flex; gap: 12px; font-size: 12px; font-weight: 600; }
.nbt-bw-filter-links a { color: var(--blue); text-decoration: none; }
.nbt-bw-filter .nbt-bw-multi-grid { margin-bottom: 14px; }
.nbt-bw-check { position: relative; min-height: 40px; transition: all .12s ease; }
.nbt-bw-check:hover { border-color: var(--blue); }
.nbt-bw-check input { width: 18px; height: 18px; flex: 0 0 18px; margin: 0; accent-color: var(--blue); }
.nbt-bw-filter-foot { display: flex; flex-wrap: wrap; align-items: center; justify-content: flex-end; gap: 8px; padding-top: 12px; border-top: 1px solid var(--border); }
.nbt-bw-filter-foot select { min-height: 42px; border-radius: 10px; }
.nbt-bw-filter-foot .btn { min-height: 42px; border-radius: 999px; padding: 8px 20px; }
@media (max-width: 560px) {
  .nbt-bw-filter { padding: 14px 12px; }
  .nbt-bw-multi-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nbt-bw-filter-foot { flex-direction: column; align-items: stretch; }
  .nbt-bw-filter-foot .btn, .nbt-bw-filter-foot select { width: 100%; justify-content: center; text-align: center; }
}

/* ===================== Header with grouped dropdowns (nbt-hd) ===================== */
.nbt-hd { position: sticky; top: 0; z-index: 1000; margin: 0 0 16px; border: 1px solid var(--border); border-radius: 16px; background: rgba(255,255,255,.92); box-shadow: 0 6px 22px rgba(30,64,175,.1); backdrop-filter: blur(14px); }
.nbt-hd-bar { display: flex; align-items: center; gap: 14px; padding: 8px 14px; }
.nbt-hd-logo { flex: 0 0 auto; display: block; line-height: 0; }
.nbt-hd-logo img { display: block; height: 40px; width: auto; }
.nbt-hd-burger { display: none; margin-left: auto; width: 42px; height: 42px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); color: var(--ink-soft); font-size: 18px; cursor: pointer; }
.nbt-hd-nav { display: flex; flex: 1 1 auto; align-items: center; gap: 2px; min-width: 0; }
.nbt-hd-group { position: relative; }
.nbt-hd-trigger { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 13px; border: 0; border-radius: 11px; background: transparent; color: var(--ink-soft); font: inherit; font-size: 14px; font-weight: 700; cursor: pointer; transition: background .15s ease, color .15s ease; }
.nbt-hd-trigger > i:first-child { color: #6b8bb8; font-size: 14px; }
.nbt-hd-caret { font-size: 10px; opacity: .6; transition: transform .18s ease; }
.nbt-hd-group:hover > .nbt-hd-trigger, .nbt-hd-group.is-open > .nbt-hd-trigger { background: var(--blue-soft); color: var(--blue-ink); }
.nbt-hd-group.is-current > .nbt-hd-trigger { color: var(--blue); }
.nbt-hd-group.is-current > .nbt-hd-trigger::after { position: absolute; left: 14px; right: 14px; bottom: 0; height: 3px; border-radius: 3px 3px 0 0; background: var(--blue); content: ""; }
.nbt-hd-group.is-open .nbt-hd-caret { transform: rotate(180deg); }
.nbt-hd-menu { position: absolute; top: 100%; left: 0; z-index: 20; display: none; min-width: 250px; padding: 8px; margin-top: 6px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: 0 18px 44px rgba(15,35,80,.2); }
.nbt-hd-menu::before { position: absolute; top: -8px; left: 0; right: 0; height: 8px; content: ""; }
@media (hover: hover) { .nbt-hd-group:hover > .nbt-hd-menu { display: block; } .nbt-hd-group:hover .nbt-hd-caret { transform: rotate(180deg); } }
.nbt-hd-group.is-open > .nbt-hd-menu { display: block; }
.nbt-hd-menu a { display: flex; align-items: center; gap: 12px; padding: 9px 11px; border-radius: 10px; color: var(--ink-soft) !important; font-size: 14px; font-weight: 600; text-decoration: none !important; }
.nbt-hd-menu a > i { display: grid; place-items: center; flex: 0 0 30px; width: 30px; height: 30px; border-radius: 9px; background: var(--blue-soft); color: var(--blue); font-size: 13px; }
.nbt-hd-menu a > span { flex: 1; min-width: 0; line-height: 1.25; }
.nbt-hd-menu a small { display: block; margin-top: 1px; color: var(--muted); font-size: 11px; font-weight: 500; }
.nbt-hd-menu a:hover, .nbt-hd-menu a:focus-visible { background: var(--blue-soft); color: var(--blue-ink) !important; outline: none; }
.nbt-hd-menu a.is-active { background: linear-gradient(135deg, #38bdf8, #2563eb); color: #fff !important; }
.nbt-hd-menu a.is-active > i { background: rgba(255,255,255,.22); color: #fff; }
.nbt-hd-menu a.is-active small { color: rgba(255,255,255,.8); }
.nbt-hd-menu em, .nbt-hd-icon em { min-width: 20px; padding: 1px 6px; border-radius: 999px; background: #ef4444; color: #fff; font-size: 11px; font-style: normal; font-weight: 800; text-align: center; }
.nbt-hd-actions { display: flex; flex: 0 0 auto; align-items: center; gap: 6px; margin-left: auto; }
.nbt-hd-icon { position: relative; display: grid; place-items: center; width: 40px; height: 40px; border-radius: 11px; color: var(--ink-soft) !important; font-size: 16px; text-decoration: none !important; }
.nbt-hd-icon:hover { background: var(--blue-soft); color: var(--blue) !important; }
.nbt-hd-icon em { position: absolute; top: 2px; right: 0; }
.nbt-hd-user { display: inline-flex; align-items: center; gap: 8px; height: 40px; padding: 0 12px 0 5px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface); color: var(--ink) !important; font-size: 13px; font-weight: 700; text-decoration: none !important; }
.nbt-hd-user:hover { border-color: var(--blue); }
.nbt-hd-avatar { display: grid; place-items: center; width: 30px; height: 30px; border-radius: 50%; background: linear-gradient(135deg, #38bdf8, #2563eb); color: #fff; font-size: 13px; font-weight: 800; }
.nbt-hd-uname { max-width: 110px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nbt-hd-logout:hover { background: #fee2e2; color: #dc2626 !important; }

@media (max-width: 1020px) {
  .nbt-hd-uname { display: none; }
  .nbt-hd-user { padding: 0 5px; }
  .nbt-hd-trigger { padding: 0 9px; }
  .nbt-hd-trigger > i:first-child { display: none; }
}
@media (max-width: 820px) {
  .nbt-hd { border-radius: 14px; }
  .nbt-hd-bar { flex-wrap: wrap; gap: 8px 10px; padding: 8px 10px; }
  .nbt-hd-logo img { height: 34px; }
  .nbt-hd-burger { display: grid; place-items: center; }
  .nbt-hd-actions { margin-left: 0; }
  .nbt-hd-nav { display: none; order: 5; flex: 1 1 100%; flex-direction: column; align-items: stretch; gap: 4px; padding: 8px 0 4px; border-top: 1px solid var(--border); }
  .nbt-hd.is-nav-open .nbt-hd-nav { display: flex; }
  .nbt-hd-trigger { width: 100%; height: 46px; padding: 0 12px; justify-content: flex-start; background: var(--surface-soft); }
  .nbt-hd-trigger > i:first-child { display: inline-block; }
  .nbt-hd-trigger span { flex: 1; text-align: left; }
  .nbt-hd-group.is-current > .nbt-hd-trigger::after { display: none; }
  .nbt-hd-menu { position: static; display: none; min-width: 0; margin: 4px 0 6px; padding: 4px; border: 0; border-left: 3px solid var(--blue-soft); border-radius: 0 10px 10px 0; box-shadow: none; }
  .nbt-hd-menu::before { display: none; }
  .nbt-hd-group:hover > .nbt-hd-menu { display: none; }
  .nbt-hd-group.is-open > .nbt-hd-menu { display: block; }
  .nbt-hd-menu a { padding: 11px 10px; }
}

/* =====================================================================
   PREMIUM LAYER — global polish (header / body / footer / mobile)
   ===================================================================== */
:root {
  --premium-shadow: 0 1px 2px rgba(15,35,80,.04), 0 8px 24px rgba(30,64,175,.07);
  --premium-shadow-lg: 0 2px 4px rgba(15,35,80,.05), 0 18px 44px rgba(30,64,175,.12);
  --grad-brand: linear-gradient(135deg, #38bdf8 0%, #2563eb 60%, #4f46e5 100%);
}
html { scroll-behavior: smooth; }
::selection { background: #bfdbfe; color: #0b2547; }
body { background:
  radial-gradient(900px 480px at 8% -8%, rgba(56,189,248,.14), transparent 60%),
  radial-gradient(900px 520px at 100% 0%, rgba(99,102,241,.1), transparent 55%),
  linear-gradient(180deg, #f2f6fd 0%, #eaf0fa 100%) fixed !important; }
::-webkit-scrollbar { width: 11px; height: 11px; }
::-webkit-scrollbar-thumb { border: 3px solid transparent; border-radius: 999px; background: #b8c9e3; background-clip: padding-box; }
::-webkit-scrollbar-thumb:hover { background: #8fa8cf; background-clip: padding-box; }
:focus-visible { outline: 3px solid rgba(37,99,235,.35); outline-offset: 2px; }

#container { width: min(1200px, calc(100% - 32px)); margin-top: 16px; }

/* ---- Header: never wrap, collapse to burger early ---- */
.nbt-hd { border-color: rgba(198,214,236,.8); box-shadow: var(--premium-shadow); }
.nbt-hd-bar { gap: 10px; padding: 8px 12px; }
.nbt-hd-trigger { flex: 0 0 auto; white-space: nowrap; padding: 0 11px; }
.nbt-hd-trigger span { white-space: nowrap; }
.nbt-hd-nav { flex-wrap: nowrap; }
.nbt-hd-actions { flex-shrink: 0; }
@media (max-width: 1240px) { .nbt-hd-trigger > i:first-child { display: none; } .nbt-hd-uname { display: none; } .nbt-hd-user { padding: 0 5px; } }
@media (max-width: 1060px) {
  .nbt-hd-bar { flex-wrap: wrap; }
  .nbt-hd-burger { display: grid; place-items: center; }
  .nbt-hd-actions { margin-left: 0; }
  .nbt-hd-nav { display: none; order: 5; flex: 1 1 100%; flex-direction: column; align-items: stretch; gap: 4px; padding: 8px 0 4px; border-top: 1px solid var(--border); }
  .nbt-hd.is-nav-open .nbt-hd-nav { display: flex; }
  .nbt-hd-trigger { width: 100%; height: 46px; padding: 0 12px; justify-content: flex-start; background: var(--surface-soft); }
  .nbt-hd-trigger > i:first-child { display: inline-block; }
  .nbt-hd-trigger span { flex: 1; text-align: left; }
  .nbt-hd-group.is-current > .nbt-hd-trigger::after { display: none; }
  .nbt-hd-menu { position: static; display: none; min-width: 0; margin: 4px 0 6px; padding: 4px; border: 0; border-left: 3px solid var(--blue-soft); border-radius: 0 10px 10px 0; box-shadow: none; }
  .nbt-hd-menu::before { display: none; }
  .nbt-hd-group:hover > .nbt-hd-menu { display: none; }
  .nbt-hd-group.is-open > .nbt-hd-menu { display: block; }
  .nbt-hd-menu a { padding: 11px 10px; }
  .nbt-hd-uname { display: inline; }
  .nbt-hd-user { padding: 0 12px 0 5px; }
}
@media (max-width: 480px) { .nbt-hd-uname { display: none; } .nbt-hd-user { padding: 0 5px; } }

/* ---- Status strip: clean card with pill stats ---- */
.nbt-status, table[style*="width:920px"] { margin: 0 auto 16px !important; border: 1px solid rgba(198,214,236,.8) !important; border-radius: 16px; background: linear-gradient(135deg, #fff, #f6f9ff); box-shadow: var(--premium-shadow); }
.nbt-status td { padding: 14px 18px; }
.nbt-welcome { display: block; margin-bottom: 8px; color: var(--ink-soft); font-size: 14px; }
.nbt-stat-line { display: flex; flex-wrap: wrap; gap: 6px 8px; margin-bottom: 8px; }
.nbt-stat-item { display: inline-flex; align-items: center; gap: 6px; padding: 4px 11px; border: 1px solid var(--border); border-radius: 999px; background: #fff; font-size: 12px; font-weight: 600; color: var(--ink-soft); }
.nbt-stat-key { font-size: 11px; font-weight: 700; letter-spacing: .02em; }
.nbt-stat-btn { display: inline-flex; align-items: center; gap: 5px; margin: 2px 4px 2px 0; padding: 5px 13px; border-radius: 999px; font-size: 12px; font-weight: 600; text-decoration: none !important; transition: transform .15s ease, box-shadow .15s ease; }
a.nbt-stat-btn:hover { transform: translateY(-1px); box-shadow: 0 6px 14px rgba(30,64,175,.14); text-decoration: none; }

/* ---- Main content surface ---- */
table.mainouter > tbody > tr > td.outer, td.outer { border: 1px solid rgba(198,214,236,.8); border-radius: 20px; background: var(--surface); box-shadow: var(--premium-shadow-lg); }
td.outer { padding: 28px clamp(14px, 2.8vw, 38px) 34px; }
h1 { letter-spacing: -.03em; }
h2 { border-left-width: 0; border-radius: 12px; background: linear-gradient(90deg, #eaf2ff, #f6f9ff 70%); box-shadow: inset 3px 0 0 var(--blue); }

/* ---- Buttons, inputs, tables, cards ---- */
a.btn, button.btn, input.btn[type="submit"], input.btn[type="button"], input.btn[type="reset"] { border-radius: 999px; background: var(--grad-brand); box-shadow: 0 6px 16px rgba(37,99,235,.28); transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; }
a.btn:hover, button.btn:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(37,99,235,.34); filter: brightness(1.05); text-decoration: none; }
a.btn:active, button.btn:active { transform: translateY(0); }
input[type="text"], input[type="password"], input[type="email"], input[type="number"], input[type="search"], select, textarea { border-radius: 10px; transition: border-color .15s ease, box-shadow .15s ease; }
input:focus, select:focus, textarea:focus { border-color: var(--blue) !important; box-shadow: 0 0 0 4px rgba(37,99,235,.12) !important; outline: none; }
.nbt-card, .nbt-panel { border-radius: 16px; box-shadow: var(--premium-shadow); }
.nbt-forumtable { overflow: hidden; }
.nbt-forumtable th { background: linear-gradient(180deg, #f0f6ff, #e6efff); color: var(--blue-ink); font-size: 12px; letter-spacing: .03em; }
.nbt-forumtable tbody tr { transition: background .12s ease; }
.nbt-forumtable tbody tr:hover td { background: #f3f8ff; }
.nbt-result { border-radius: 12px; }
.nbt-pm-notice { border-radius: 14px; }
img { image-rendering: auto; }

/* ---- Footer ---- */
.nbt-ft { max-width: 1200px; margin: 26px auto 0; padding: 22px 26px 16px; border-radius: 20px; background: linear-gradient(135deg, #0b2547 0%, #12406f 60%, #1d65a6 100%); color: rgba(235,245,255,.85); box-shadow: var(--premium-shadow-lg); text-align: left; }
.nbt-ft-top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 14px 24px; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,.14); }
.nbt-ft-brand { display: flex; flex-direction: column; gap: 2px; }
.nbt-ft-brand strong { color: #fff; font-size: 20px; letter-spacing: -.02em; }
.nbt-ft-brand span { font-size: 12px; color: rgba(235,245,255,.7); }
.nbt-ft-links { display: flex; flex-wrap: wrap; gap: 4px 6px; }
.nbt-ft-links a { padding: 6px 12px; border-radius: 999px; color: #dbeafe !important; font-size: 13px; font-weight: 600; text-decoration: none !important; }
.nbt-ft-links a:hover { background: rgba(255,255,255,.14); color: #fff !important; }
.nbt-ft-bottom { display: flex; flex-wrap: wrap; justify-content: space-between; gap: 6px 16px; padding-top: 12px; font-size: 12px; color: rgba(235,245,255,.65); }

/* ---- Mobile ---- */
@media (max-width: 760px) {
  #container { width: calc(100% - 20px); margin-top: 10px; }
  .nbt-hd { border-radius: 14px; margin-bottom: 12px; }
  td.outer { padding: 18px 12px 24px; border-radius: 16px; }
  .nbt-status td { padding: 12px 12px; }
  .nbt-stat-line { justify-content: center; }
  .nbt-ft { margin-top: 18px; padding: 18px 16px 14px; border-radius: 16px; }
  .nbt-ft-top { flex-direction: column; align-items: flex-start; }
  .nbt-ft-bottom { flex-direction: column; }
  h1 { font-size: 20px; }
  input, select, textarea { font-size: 16px; }
}
@media (prefers-reduced-motion: reduce) { * { transition: none !important; scroll-behavior: auto !important; } }

/* ===================== Auth pages (login / signup / recover) ===================== */
body:has(.nbt-auth) #top { display: none; }
body:has(.nbt-auth) #container { width: min(1120px, calc(100% - 28px)); margin-top: 28px; }
body:has(.nbt-auth) table.mainouter > tbody > tr > td.outer { padding: 0; border: 0; background: transparent; box-shadow: none; }
body:has(.nbt-auth) h1 { text-align: left; }
.nbt-auth { display: grid; grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr); min-height: 640px; overflow: hidden; border-radius: 26px; background: var(--surface); box-shadow: 0 30px 70px rgba(15,35,80,.22), 0 0 0 1px rgba(198,214,236,.7); }
.nbt-auth-brand { position: relative; isolation: isolate; display: flex; flex-direction: column; gap: 26px; padding: 38px 40px; overflow: hidden; background: radial-gradient(circle at 100% 0%, rgba(56,189,248,.4), transparent 38%), radial-gradient(circle at 0% 100%, rgba(129,140,248,.35), transparent 42%), linear-gradient(150deg, #0a2142 0%, #12406f 55%, #1d65a6 100%); color: #fff; }
.nbt-auth-brand::before, .nbt-auth-brand::after { position: absolute; z-index: -1; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; content: ""; }
.nbt-auth-brand::before { right: -120px; bottom: -120px; width: 380px; height: 380px; box-shadow: 0 0 0 36px rgba(255,255,255,.025), 0 0 0 76px rgba(255,255,255,.018); }
.nbt-auth-brand::after { left: -90px; top: 38%; width: 220px; height: 220px; }
.nbt-auth-logo { align-self: flex-start; padding: 8px 14px; border-radius: 14px; background: rgba(255,255,255,.96); line-height: 0; box-shadow: 0 8px 22px rgba(0,0,0,.18); }
.nbt-auth-logo img { display: block; height: 36px; width: auto; }
.nbt-auth-pitch { margin-top: 8px; }
.nbt-auth-eyebrow { color: #9fd0ff; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-auth-brand h2 { margin: 10px 0 10px; padding: 0; border: 0; background: none; box-shadow: none; color: #fff; font-size: clamp(26px, 3.4vw, 38px); line-height: 1.2; letter-spacing: -.03em; text-align: left; }
.nbt-auth-brand p { margin: 0; max-width: 420px; color: rgba(235,245,255,.8); font-size: 14px; line-height: 1.75; }
.nbt-auth-features { display: flex; flex-direction: column; gap: 12px; margin: 0; padding: 0; list-style: none; }
.nbt-auth-features li { display: flex; align-items: center; gap: 12px; color: rgba(235,245,255,.88); font-size: 13px; }
.nbt-auth-features li i { display: grid; place-items: center; flex: 0 0 38px; width: 38px; height: 38px; border: 1px solid rgba(255,255,255,.18); border-radius: 12px; background: rgba(255,255,255,.1); color: #7dd3fc; backdrop-filter: blur(6px); }
.nbt-auth-features b { color: #fff; }
.nbt-auth-stats { display: flex; gap: 12px; margin-top: auto; }
.nbt-auth-stats > div { flex: 1; padding: 12px 16px; border: 1px solid rgba(255,255,255,.18); border-radius: 14px; background: rgba(255,255,255,.08); backdrop-filter: blur(8px); }
.nbt-auth-stats strong { display: block; font-size: 22px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.nbt-auth-stats span { color: rgba(235,245,255,.7); font-size: 11px; }

.nbt-auth-card { display: flex; flex-direction: column; justify-content: center; padding: 38px clamp(22px, 4vw, 52px); background: linear-gradient(180deg, #fff, #f8fbff); }
.nbt-auth-tabs { display: inline-flex; align-self: flex-start; gap: 2px; margin-bottom: 22px; padding: 4px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-soft); }
.nbt-auth-tabs a { padding: 8px 20px; border-radius: 999px; color: var(--muted) !important; font-size: 13px; font-weight: 700; text-decoration: none !important; }
.nbt-auth-tabs a.is-active { background: var(--grad-brand); color: #fff !important; box-shadow: 0 6px 14px rgba(37,99,235,.3); }
.nbt-auth-card h1 { margin: 0 0 6px; font-size: clamp(24px, 3vw, 30px); letter-spacing: -.03em; }
.nbt-auth-sub { margin: 0 0 22px; color: var(--muted); font-size: 14px; }
.nbt-auth-alert { margin-bottom: 16px; padding: 11px 14px; border: 1px solid #fcd34d; border-radius: 12px; background: #fffbeb; color: #92400e; font-size: 13px; font-weight: 600; }
.nbt-auth-form { display: flex; flex-direction: column; gap: 16px; }
.nbt-auth-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 14px; }
.nbt-auth-field label { display: flex; align-items: center; justify-content: space-between; margin-bottom: 6px; color: var(--ink-soft); font-size: 13px; font-weight: 700; }
.nbt-auth-field small { display: block; margin-top: 5px; color: var(--muted); font-size: 12px; }
.nbt-auth-forgot { font-size: 12px; font-weight: 600; }
.nbt-auth-input { position: relative; display: flex; align-items: center; border: 1px solid var(--border-strong); border-radius: 12px; background: #fff; transition: border-color .15s ease, box-shadow .15s ease; }
.nbt-auth-input:focus-within { border-color: var(--blue); box-shadow: 0 0 0 4px rgba(37,99,235,.12); }
.nbt-auth-input > i { flex: 0 0 44px; text-align: center; color: #7a93b6; font-size: 14px; }
.nbt-auth-input input { flex: 1; min-width: 0; height: 48px; padding: 0 12px 0 0 !important; border: 0 !important; border-radius: 0 12px 12px 0 !important; background: transparent !important; box-shadow: none !important; color: var(--ink); font-size: 15px; }
.nbt-auth-input input:focus { outline: none; box-shadow: none !important; }
.nbt-auth-eye { flex: 0 0 44px; height: 48px; border: 0; background: transparent; color: #7a93b6; font-size: 15px; cursor: pointer; }
.nbt-auth-eye:hover { color: var(--blue); }
.nbt-auth-submit { display: inline-flex; align-items: center; justify-content: center; gap: 10px; height: 52px; margin-top: 4px; border: 0; border-radius: 14px; background: var(--grad-brand); color: #fff; font: inherit; font-size: 16px; font-weight: 800; cursor: pointer; box-shadow: 0 12px 26px rgba(37,99,235,.35); transition: transform .15s ease, box-shadow .15s ease, filter .15s ease; }
.nbt-auth-submit:hover { transform: translateY(-2px); box-shadow: 0 16px 32px rgba(37,99,235,.42); filter: brightness(1.05); }
.nbt-auth-submit:active { transform: translateY(0); }
.nbt-auth-alt { margin: 20px 0 0; color: var(--muted); font-size: 14px; text-align: center; }
.nbt-auth-alt a { font-weight: 700; }
.nbt-auth-captcha { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin-bottom: 8px; }
.nbt-auth-captcha img { border: 1px solid var(--border); border-radius: 10px; background: #fff; }
.nbt-auth-refresh { display: inline-flex; align-items: center; gap: 6px; height: 38px; padding: 0 14px; border: 1px solid var(--border-strong); border-radius: 999px; background: #fff; color: var(--ink-soft); font: inherit; font-size: 12px; font-weight: 700; cursor: pointer; }
.nbt-auth-refresh:hover { border-color: var(--blue); color: var(--blue); }
.nbt-auth-terms { display: flex; flex-direction: column; gap: 8px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.nbt-auth-check { display: flex; align-items: flex-start; gap: 10px; margin: 0 !important; color: var(--ink-soft); font-size: 13px; font-weight: 500 !important; justify-content: flex-start !important; cursor: pointer; }
.nbt-auth-check input { flex: 0 0 18px; width: 18px; height: 18px; margin: 2px 0 0; accent-color: var(--blue); }
.nbt-auth-form .nbt-pw-meter { margin-top: -6px; }
.nbt-hp { position: absolute; left: -9999px; width: 1px; height: 1px; overflow: hidden; }

@media (max-width: 900px) {
  .nbt-auth { grid-template-columns: minmax(0, 1fr); min-height: 0; border-radius: 22px; }
  .nbt-auth-brand { gap: 14px; padding: 22px 22px 24px; }
  .nbt-auth-features, .nbt-auth-brand p { display: none; }
  .nbt-auth-brand h2 { font-size: 24px; margin-bottom: 0; }
  .nbt-auth-stats { margin-top: 4px; }
  .nbt-auth-stats > div { padding: 8px 12px; } .nbt-auth-stats strong { font-size: 18px; }
  .nbt-auth-card { padding: 24px 20px 28px; }
}
@media (max-width: 520px) {
  body:has(.nbt-auth) #container { width: calc(100% - 16px); margin-top: 8px; }
  .nbt-auth { border-radius: 18px; }
  .nbt-auth-grid { grid-template-columns: minmax(0, 1fr); }
  .nbt-auth-tabs { align-self: stretch; } .nbt-auth-tabs a { flex: 1; text-align: center; padding: 9px 8px; }
  .nbt-auth-input input { font-size: 16px; }
}

/* Signup: stop the two password fields overflowing their column */
.nbt-auth-card, .nbt-auth-form, .nbt-auth-field { min-width: 0; max-width: 100%; }
.nbt-auth-grid { grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr)); }
.nbt-auth-grid > .nbt-auth-field { min-width: 0; }
.nbt-auth-input { width: 100%; min-width: 0; overflow: hidden; }
.nbt-auth-input input { width: 100%; min-width: 0 !important; max-width: 100%; text-overflow: ellipsis; }
.nbt-auth-field label { flex-wrap: wrap; gap: 4px 8px; }
.nbt-auth-card { overflow: hidden; }

/* =====================================================================
   UNIFIED DESIGN SYSTEM — one look for every page
   Tokens: radius 16/12/pill · brand gradient · soft layered shadows
   ===================================================================== */
:root { --r-card: 16px; --r-field: 12px; --line: rgba(198,214,236,.85); }

/* ---- Page title: the same blue banner used by details / browse / home ---- */
td.outer > h1, .nbt-page-title {
  position: relative; isolation: isolate; overflow: hidden;
  margin: 0 0 18px; padding: 20px 26px;
  border-radius: 18px; text-align: left; color: #fff !important;
  font-size: clamp(20px, 3vw, 27px); line-height: 1.3; letter-spacing: -.02em;
  background: radial-gradient(circle at 92% 0%, rgba(56,189,248,.38), transparent 38%), linear-gradient(120deg, #0b2547 0%, #12406f 58%, #1d65a6 100%);
  box-shadow: 0 12px 28px rgba(11,37,71,.18);
}
td.outer > h1::after, .nbt-page-title::after { position: absolute; z-index: -1; right: 6%; bottom: -90px; width: 200px; height: 200px; border: 1px solid rgba(255,255,255,.12); border-radius: 50%; box-shadow: 0 0 0 22px rgba(255,255,255,.03); content: ""; }
td.outer > h1 a, td.outer > h1 a:link, td.outer > h1 a:visited, .nbt-page-title a { color: #bfe3ff !important; text-decoration: underline; text-underline-offset: 4px; }
td.outer > h1 font { color: inherit !important; }

/* ---- Light page heads (pets, directory, bank, tickets) ---- */
.nbt-pet-page-head, .nbt-directory-head, .nbt-bank-hero, .nbt-ticket-hero {
  padding: 20px 24px; border: 1px solid var(--line); border-left: 5px solid var(--blue);
  border-radius: 18px; background: linear-gradient(120deg, #fff 0%, #f4f8ff 100%);
  box-shadow: var(--premium-shadow);
}

/* ---- Cards & panels ---- */
.nbt-card, .nbt-panel, .nbt-profile-head, .nbt-comment-recent { border: 1px solid var(--line); border-radius: var(--r-card); background: var(--surface); box-shadow: var(--premium-shadow); }
.nbt-card, .nbt-panel { padding: 18px 20px; }
.nbt-card-head, .nbt-panel-head { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; margin: 0 0 14px; padding: 0 0 12px; border-bottom: 1px solid var(--border); }
.nbt-card-head h2, .nbt-panel-head h3 { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--ink); font-size: 16px; font-weight: 800; letter-spacing: -.01em; text-align: left; }
.nbt-panel-icon { display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: var(--blue-soft); font-size: 16px; }
.nbt-card-action, .nbt-card-head > a { margin-left: auto; font-size: 13px; font-weight: 700; }
.nbt-empty-card { padding: 38px 20px; border: 1px dashed var(--border-strong); border-radius: 18px; background: linear-gradient(145deg, #fff, var(--surface-soft)); }
.nbt-login-note, .nbt-empty-text { color: var(--muted); font-size: 13px; }

/* ---- Alerts ---- */
.nbt-result { display: flex; align-items: center; gap: 10px; padding: 13px 16px; border: 1px solid var(--border); border-left-width: 5px; border-radius: 12px; background: var(--surface-soft); box-shadow: 0 3px 10px rgba(30,64,175,.05); }
.nbt-result.win { border-color: #86efac; border-left-color: #16a34a; background: #f0fdf4; color: #14532d; }
.nbt-result.loss, .nbt-result.error, .nbt-result.lose { border-color: #fca5a5; border-left-color: #dc2626; background: #fef2f2; color: #7f1d1d; }

/* ---- Forms ---- */
.nbt-form-field > label, .nbt-field > label { margin-bottom: 6px; color: var(--ink-soft); font-size: 13px; font-weight: 700; }
.nbt-form-field input[type="text"], .nbt-form-field input[type="password"], .nbt-form-field input[type="number"], .nbt-form-field input[type="email"], .nbt-form-field input[type="url"], .nbt-form-field input[type="search"], .nbt-form-field select, .nbt-field input[type="text"], .nbt-field input[type="number"], .nbt-field select { min-height: 44px; padding: 0 14px; border: 1px solid var(--border-strong); border-radius: var(--r-field); background: #fff; }
.nbt-form-field textarea, .nbt-field textarea { padding: 12px 14px; border: 1px solid var(--border-strong); border-radius: var(--r-field); background: #fff; line-height: 1.7; }
.nbt-form-field small, .nbt-field small, .nbt-login-hint { color: var(--muted); font-size: 12px; }
.nbt-form-actions { display: flex; flex-wrap: wrap; gap: 8px; }
.nbt-check, .nbt-radio { display: flex; align-items: center; gap: 10px; padding: 9px 12px; border: 1px solid var(--border); border-radius: 11px; background: #fff; cursor: pointer; }
.nbt-check:has(input:checked), .nbt-radio:has(input:checked) { border-color: var(--blue); background: var(--blue-soft); color: var(--blue-ink); }
input[type="checkbox"], input[type="radio"] { accent-color: var(--blue); }
.nbt-btn-ghost, a.btn.btn-ghost, button.btn.btn-ghost, input.btn-ghost { border-radius: 999px; }
.nbt-btn-danger, button.nbt-btn-danger, a.nbt-btn-danger { border-radius: 999px; background: linear-gradient(135deg, #f87171, #dc2626) !important; box-shadow: 0 6px 16px rgba(220,38,38,.28); }

/* ---- Tables (new + legacy) ---- */
.nbt-forumtable, .nbt-reqtable { width: 100%; border: 1px solid var(--line); border-radius: 14px; overflow: hidden; background: #fff; box-shadow: var(--premium-shadow); }
.nbt-forumtable td, .nbt-reqtable td { border-color: var(--border); }
.mainouter table[border], .mainouter table.main { border-color: var(--line) !important; }
.mainouter table[border] td, .mainouter table.main td { border-color: var(--border); }
td.outer > table { display: block; max-width: 100%; overflow-x: auto; -webkit-overflow-scrolling: touch; }
td.colhead { background: linear-gradient(180deg, #f0f6ff, #e4eeff); color: var(--blue-ink); font-size: 12px; letter-spacing: .03em; }
td.rowhead { background: var(--surface-soft); }

/* ---- Pager, chips, misc ---- */
.nbt-pager p { margin: 4px 0; line-height: 2.1; }
.nbt-pager a { display: inline-block; padding: 1px 10px; border-radius: 999px; text-decoration: none !important; }
.nbt-pager a:hover { background: var(--blue-soft); }
.nbt-pager font { color: inherit !important; }
.nbt-chip { border-radius: 999px; }
.nbt-faq-item, .nbt-rules-list > li { border-radius: 14px; }
hr { border-top-color: var(--border); }
fieldset { padding: 14px 16px; border: 1px solid var(--line); border-radius: var(--r-card); }
legend { padding: 0 8px; color: var(--ink-soft); font-weight: 800; }
blockquote { margin: 10px 0; padding: 10px 14px; border-left: 4px solid var(--blue); border-radius: 0 10px 10px 0; background: var(--surface-soft); }
img[src*="smilies"] { vertical-align: middle; }

/* ---- Mobile ---- */
@media (max-width: 760px) {
  td.outer > h1, .nbt-page-title { padding: 16px 18px; border-radius: 14px; margin-bottom: 14px; }
  .nbt-card, .nbt-panel { padding: 15px 14px; border-radius: 14px; }
  .nbt-pet-page-head, .nbt-directory-head, .nbt-bank-hero, .nbt-ticket-hero { flex-wrap: wrap; padding: 16px 16px; border-radius: 14px; }
  .nbt-form-row { flex-direction: column; }
  .nbt-form-actions .btn, .nbt-form-actions button { flex: 1 1 auto; justify-content: center; }
  .nbt-result { padding: 11px 13px; }
}

/* One shared width: header, status strip, body and footer all follow #container */
table.mainouter, .nbt-status, .nbt-ft, .nbt-hd { width: 100% !important; max-width: 100% !important; margin-left: 0 !important; margin-right: 0 !important; }
table.mainouter { margin-top: 0 !important; margin-bottom: 0 !important; }

/* ===================== Message cards (stdmsg / stderr / success.php) ===================== */
.nbt-msg-card { --msg: var(--blue); --msg-soft: var(--blue-soft); position: relative; max-width: 620px; margin: 28px auto; padding: 38px 32px 30px; overflow: hidden; border: 1px solid var(--line); border-top: 5px solid var(--msg); border-radius: 22px; background: linear-gradient(180deg, #fff, #f8fbff); box-shadow: var(--premium-shadow-lg); text-align: center; }
.nbt-msg-card.is-success { --msg: #16a34a; --msg-soft: #dcfce7; }
.nbt-msg-card.is-error { --msg: #dc2626; --msg-soft: #fee2e2; }
.nbt-msg-icon { display: grid; place-items: center; width: 68px; height: 68px; margin: 0 auto 16px; border-radius: 50%; background: var(--msg-soft); color: var(--msg); font-size: 30px; box-shadow: 0 0 0 8px color-mix(in srgb, var(--msg) 10%, transparent); }
.nbt-msg-card h2 { margin: 0 0 12px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--ink); font-size: clamp(20px, 3vw, 25px); font-weight: 800; letter-spacing: -.02em; text-align: center; }
.nbt-msg-body { color: var(--ink-soft); font-size: 15px; line-height: 1.8; overflow-wrap: anywhere; }
.nbt-msg-body p { margin: 8px 0; color: inherit; font-size: inherit; }
.nbt-msg-body code { padding: 3px 8px; border-radius: 8px; background: var(--surface-soft); font-size: 12px; }
.nbt-msg-actions, .nbt-msg-body .nbt-msg-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin-top: 22px; }
.nbt-msg-actions .btn { min-height: 44px; padding: 8px 22px; }
.nbt-msg-body > p:has(> a.btn:only-child) { margin-top: 20px; }
@media (max-width: 560px) {
  .nbt-msg-card { margin: 14px auto; padding: 28px 18px 22px; border-radius: 18px; }
  .nbt-msg-icon { width: 58px; height: 58px; font-size: 25px; }
  .nbt-msg-actions { flex-direction: column; } .nbt-msg-actions .btn { width: 100%; }
}

/* Browse: hover poster preview */
.nbt-bw-thumb[data-preview] { cursor: zoom-in; }
.nbt-bw-preview { position: fixed; z-index: 3000; padding: 6px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: 0 24px 60px rgba(11,37,71,.38); opacity: 0; transform: scale(.96); transition: opacity .15s ease, transform .15s ease; pointer-events: none; }
.nbt-bw-preview.is-on { opacity: 1; transform: scale(1); }
.nbt-bw-preview img { display: block; max-width: min(340px, 40vw); max-height: min(480px, 80vh); border-radius: 11px; }
@media (hover: none) { .nbt-bw-preview { display: none !important; } }
.nbt-bw-title { margin-bottom: 6px; }
.nbt-bw-tags { margin: 0 0 2px; }

/* Header avatar: photo on top of the initial fallback */
.nbt-hd-avatar { position: relative; overflow: hidden; flex: 0 0 30px; }
.nbt-hd-avatar b { font-weight: 800; }
.nbt-hd-avatar img { position: absolute; inset: 0; width: 100%; height: 100%; max-width: none; object-fit: cover; border-radius: 50%; }

/* User profile: seeding / leeching tables */
.nbt-usertorrents { table-layout: auto; }
.nbt-usertorrents th, .nbt-usertorrents td { padding: 11px 14px; white-space: nowrap; }
.nbt-usertorrents td:first-child, .nbt-usertorrents th:first-child { white-space: normal; min-width: 220px; }
.nbt-ut-name { display: flex; align-items: center; gap: 12px; color: var(--ink) !important; font-weight: 700; text-decoration: none !important; }
.nbt-ut-name:hover span { color: var(--blue); }
.nbt-ut-name img { flex: 0 0 40px; width: 40px; height: 40px; object-fit: cover; border-radius: 10px; box-shadow: 0 3px 8px rgba(30,64,175,.18); }
.nbt-ut-name span { overflow-wrap: anywhere; }
.nbt-ut-seed, .nbt-ut-leech { display: inline-block; min-width: 34px; padding: 2px 10px; border-radius: 999px; text-align: center; }
.nbt-ut-seed { background: #e8f9ee; color: #15803d; }
.nbt-ut-leech { background: #fdecec; color: #b91c1c; }
.nbt-ratio-chip { display: inline-block; padding: 2px 11px; border-radius: 999px; font-size: 12px; font-variant-numeric: tabular-nums; }
.nbt-ratio-chip.is-good { background: #dcfce7; color: #166534; }
.nbt-ratio-chip.is-mid { background: #fef3c7; color: #92400e; }
.nbt-ratio-chip.is-low { background: #fee2e2; color: #991b1b; }
.nbt-muted { color: var(--muted); }
.nbt-card > .nbt-table-scroll { margin: 0 -4px; }
@media (max-width: 760px) {
  .nbt-usertorrents td:first-child { min-width: 0; }
  .nbt-usertorrents td { white-space: normal; }
}

/* ===================== Free Leech manager (nbt-fl) ===================== */
.nbt-fl { display: flex; flex-direction: column; gap: 16px; max-width: 920px; margin: 0 auto; }
.nbt-fl-hero { position: relative; isolation: isolate; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; padding: 26px 28px; overflow: hidden; border-radius: 20px; background: radial-gradient(circle at 92% 0%, rgba(251,191,36,.4), transparent 36%), linear-gradient(120deg, #0b2547 0%, #12406f 58%, #1d65a6 100%); color: #fff; box-shadow: 0 14px 34px rgba(11,37,71,.2); }
.nbt-fl-eyebrow { color: #fcd34d; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-fl-hero h1, td.outer .nbt-fl-hero h1 { all: unset; display: block; margin: 6px 0 4px; color: #fff; font-size: clamp(24px, 4vw, 32px); font-weight: 800; letter-spacing: -.03em; }
.nbt-fl-hero p { margin: 0; color: rgba(235,245,255,.8); font-size: 14px; max-width: 460px; }
.nbt-fl-stats { display: flex; gap: 10px; }
.nbt-fl-stats > div { min-width: 110px; padding: 11px 16px; border: 1px solid rgba(255,255,255,.22); border-radius: 14px; background: rgba(255,255,255,.1); backdrop-filter: blur(8px); text-align: center; }
.nbt-fl-stats strong { display: block; font-size: 24px; line-height: 1.1; font-variant-numeric: tabular-nums; }
.nbt-fl-stats span { color: rgba(235,245,255,.75); font-size: 11px; }
.nbt-fl-form { display: flex; flex-direction: column; gap: 16px; }
.nbt-fl-hint { margin-left: auto; color: var(--muted); font-size: 12px; }
.nbt-fl-choice { display: grid; grid-template-columns: repeat(auto-fit, minmax(240px, 1fr)); gap: 12px; }
.nbt-fl-option, .nbt-fl-size { position: relative; cursor: pointer; }
.nbt-fl-option input, .nbt-fl-size input { position: absolute; opacity: 0; pointer-events: none; }
.nbt-fl-option > span { display: grid; grid-template-columns: 44px 1fr; grid-template-rows: auto auto; column-gap: 12px; align-items: center; padding: 16px; border: 2px solid var(--border); border-radius: 16px; background: #fff; transition: all .15s ease; }
.nbt-fl-option > span > i { grid-row: 1 / 3; display: grid; place-items: center; width: 44px; height: 44px; border-radius: 13px; background: var(--surface-soft); color: var(--muted); font-size: 18px; }
.nbt-fl-option b { color: var(--ink); font-size: 15px; }
.nbt-fl-option small { color: var(--muted); font-size: 12px; }
.nbt-fl-option:hover > span { border-color: var(--blue); }
.nbt-fl-option.is-on input:checked + span { border-color: #f59e0b; background: #fffbeb; box-shadow: 0 8px 20px rgba(245,158,11,.2); }
.nbt-fl-option.is-on input:checked + span > i { background: #f59e0b; color: #fff; }
.nbt-fl-option.is-off input:checked + span { border-color: #64748b; background: #f1f5f9; box-shadow: 0 8px 20px rgba(100,116,139,.18); }
.nbt-fl-option.is-off input:checked + span > i { background: #475569; color: #fff; }
.nbt-fl-sizes { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 10px; }
.nbt-fl-size > span { display: flex; flex-direction: column; gap: 1px; padding: 12px 14px; border: 2px solid var(--border); border-radius: 13px; background: #fff; transition: all .15s ease; }
.nbt-fl-size b { color: var(--ink); font-size: 14px; }
.nbt-fl-size small { color: var(--muted); font-size: 12px; }
.nbt-fl-size:hover > span { border-color: var(--blue); }
.nbt-fl-size input:checked + span { border-color: var(--blue); background: var(--blue-soft); box-shadow: 0 6px 16px rgba(37,99,235,.18); }
.nbt-fl-size input:checked + span b { color: var(--blue-ink); }
.nbt-fl-option input:focus-visible + span, .nbt-fl-size input:focus-visible + span { outline: 3px solid rgba(37,99,235,.35); outline-offset: 2px; }
.nbt-fl-submitbar { position: sticky; bottom: 12px; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.95); box-shadow: 0 12px 32px rgba(16,35,63,.16); backdrop-filter: blur(12px); }
.nbt-fl-summary { flex: 1 1 240px; color: var(--ink-soft); font-size: 14px; }
.nbt-fl-submitbar .btn { min-height: 46px; padding: 8px 24px; }
.nbt-fl-list { display: flex; flex-direction: column; margin: 0; padding: 0; list-style: none; }
.nbt-fl-list li { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 4px 14px; padding: 11px 2px; border-bottom: 1px solid var(--border); }
.nbt-fl-list li:last-child { border-bottom: 0; }
.nbt-fl-list a { display: flex; align-items: center; gap: 10px; min-width: 0; color: var(--ink) !important; text-decoration: none !important; }
.nbt-fl-list a b { overflow-wrap: anywhere; } .nbt-fl-list a:hover b { color: var(--blue); }
.nbt-fl-badge { flex: 0 0 auto; padding: 2px 10px; border-radius: 999px; background: #fef3c7; color: #92400e; font-size: 11px; font-weight: 800; }
.nbt-fl-meta { color: var(--muted); font-size: 12px; white-space: nowrap; }
@media (max-width: 600px) {
  .nbt-fl-hero { padding: 20px 18px; border-radius: 16px; }
  .nbt-fl-stats { width: 100%; } .nbt-fl-stats > div { flex: 1; min-width: 0; }
  .nbt-fl-sizes { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .nbt-fl-submitbar { flex-direction: column; align-items: stretch; bottom: 6px; } .nbt-fl-submitbar .btn { width: 100%; justify-content: center; }
  .nbt-fl-hint { display: none; }
}

/* ===================== Home: statistics polish ===================== */
.nbt-stats { gap: 14px; }
.nbt-stat-card { --ac: var(--blue); --ac-soft: var(--blue-soft); position: relative; gap: 14px; padding: 16px 16px 16px 18px; overflow: hidden; border: 1px solid var(--line); border-radius: 16px; background: linear-gradient(145deg, #fff 55%, var(--ac-soft)); box-shadow: 0 2px 10px rgba(30,64,175,.06); transition: transform .18s ease, box-shadow .18s ease; }
.nbt-stat-card::before { position: absolute; inset: 0 auto 0 0; width: 4px; background: var(--ac); content: ""; }
.nbt-stat-card::after { position: absolute; right: -22px; bottom: -26px; width: 86px; height: 86px; border-radius: 50%; background: var(--ac); opacity: .07; content: ""; }
.nbt-stat-card:hover { transform: translateY(-3px); box-shadow: 0 14px 28px rgba(30,64,175,.14); }
.nbt-stat-card .nbt-stat-icon { width: 46px; height: 46px; border-radius: 14px; background: var(--ac) !important; color: #fff !important; box-shadow: 0 8px 16px color-mix(in srgb, var(--ac) 35%, transparent); }
.nbt-stat-card .nbt-stat-icon i { font-size: 18px; }
.nbt-stat-label { color: var(--muted); font-size: 12px; font-weight: 600; }
.nbt-stat-value { color: var(--ink) !important; font-size: 24px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.nbt-stat-sub { font-size: 11px; }
.nbt-accent-blue { --ac: #2563eb; --ac-soft: #e8f0ff; } .nbt-accent-green { --ac: #16a34a; --ac-soft: #e6f8ec; }
.nbt-accent-amber { --ac: #d97706; --ac-soft: #fff4de; } .nbt-accent-red { --ac: #dc2626; --ac-soft: #feebeb; }
.nbt-accent-orange { --ac: #ea580c; --ac-soft: #ffeedf; } .nbt-accent-purple { --ac: #7c3aed; --ac-soft: #f0e9ff; }
.nbt-accent-cyan { --ac: #0891b2; --ac-soft: #e2f6fb; } .nbt-accent-brown { --ac: #b45309; --ac-soft: #fbeedd; }
.nbt-accent-gray { --ac: #64748b; --ac-soft: #eef1f5; }

/* Online statistics */
.nbt-online-dot { position: relative; width: 10px; height: 10px; }
.nbt-online-dot::after { position: absolute; inset: -4px; border-radius: 50%; background: var(--green); opacity: .35; animation: nbt-pulse 1.8s ease-out infinite; content: ""; }
@keyframes nbt-pulse { 0% { transform: scale(.6); opacity: .5; } 100% { transform: scale(1.8); opacity: 0; } }
.nbt-online-toggle { padding: 7px 14px; border: 1px solid var(--border-strong); border-radius: 999px; background: #fff; color: var(--blue-ink); font-size: 12px; font-weight: 700; transition: all .15s ease; }
.nbt-online-toggle:hover, .nbt-online-toggle[aria-expanded="true"] { border-color: var(--blue); background: var(--blue-soft); }
.nbt-online-list { margin-top: 18px; padding: 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-soft); }
.nbt-online-summary { margin-bottom: 12px; font-size: 13px; }
.nbt-online-summary strong { color: var(--blue-ink); }
.nbt-activeusers { display: flex; flex-wrap: wrap; gap: 6px; margin-top: 0; padding-top: 0; border-top: 0; line-height: 1.4; }
.nbt-activeusers a { display: inline-block; padding: 4px 12px; border: 1px solid var(--border); border-radius: 999px; background: #fff; box-shadow: 0 1px 3px rgba(30,64,175,.06); text-decoration: none !important; transition: all .12s ease; }
.nbt-activeusers a:hover { border-color: var(--blue); background: var(--blue-soft); transform: translateY(-1px); }
.nbt-activeusers nobr { display: contents; }

/* News list */
.nbt-news li { gap: 18px; }
.nbt-news-date { flex: 0 0 auto; align-self: flex-start; padding: 4px 11px; border-radius: 999px; background: var(--blue-soft); color: var(--blue-ink); font-size: 11px; font-weight: 700; white-space: nowrap; }
.nbt-news-body { font-size: 14px; line-height: 1.8; }
.nbt-news-body a { text-decoration: underline; text-underline-offset: 3px; }
.nbt-news-edit { padding: 1px 9px; border-radius: 999px; background: var(--surface-soft); }
@media (max-width: 600px) { .nbt-news li { flex-direction: column; gap: 8px; } .nbt-stat-value { font-size: 21px; } }

/* ===================== Top 10 (nbt-tt) ===================== */
.nbt-tt { display: flex; flex-direction: column; gap: 18px; }
.nbt-tt-hero { position: relative; isolation: isolate; display: flex; flex-wrap: wrap; align-items: flex-end; justify-content: space-between; gap: 18px; padding: 26px 28px; overflow: hidden; border-radius: 20px; background: radial-gradient(circle at 90% 0%, rgba(251,191,36,.42), transparent 36%), linear-gradient(120deg, #0b2547 0%, #12406f 58%, #1d65a6 100%); color: #fff; box-shadow: 0 14px 34px rgba(11,37,71,.2); }
.nbt-tt-hero::after { position: absolute; z-index: -1; right: 24%; bottom: -120px; width: 260px; height: 260px; border: 1px solid rgba(255,255,255,.1); border-radius: 50%; box-shadow: 0 0 0 26px rgba(255,255,255,.025); content: ""; }
.nbt-tt-eyebrow { color: #fcd34d; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-tt-hero h1 { all: unset; display: block; margin: 6px 0 4px; color: #fff; font-size: clamp(24px, 4vw, 33px); font-weight: 800; letter-spacing: -.03em; }
.nbt-tt-hero p { margin: 0; color: rgba(235,245,255,.8); font-size: 14px; }
.nbt-tt-hero .nbt-toptabs { margin: 0; justify-content: flex-end; gap: 6px; padding: 5px; border: 1px solid rgba(255,255,255,.2); border-radius: 999px; background: rgba(255,255,255,.1); backdrop-filter: blur(8px); }
.nbt-tt-hero .nbt-toptab { display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px; border: 0; background: transparent; color: rgba(235,245,255,.85) !important; font-size: 13px; text-decoration: none !important; }
.nbt-tt-hero .nbt-toptab:hover { background: rgba(255,255,255,.16); color: #fff !important; }
.nbt-tt-hero .nbt-toptab.active { background: #fff; color: var(--blue-ink) !important; box-shadow: 0 6px 14px rgba(0,0,0,.18); }

.nbt-tt-card { padding: 20px 22px; border: 1px solid var(--line); border-radius: 18px; background: var(--surface); box-shadow: var(--premium-shadow); }
.nbt-tt-title { display: flex; flex-wrap: wrap; align-items: center; gap: 6px 10px; margin: 0 0 14px; padding: 0 0 12px; border: 0; border-bottom: 1px solid var(--border); border-radius: 0; background: none; box-shadow: none; color: var(--ink); font-size: 17px; font-weight: 800; letter-spacing: -.01em; text-align: left; }
.nbt-tt-title::before { content: "🏆"; display: inline-grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #fef3c7; font-size: 17px; }
.nbt-tt-title .nbt-small { color: var(--muted); font-size: 12px; font-weight: 500; }
.nbt-tt-title .nbt-small a { padding: 1px 9px; border: 1px solid var(--border-strong); border-radius: 999px; background: #fff; font-weight: 700; text-decoration: none !important; }
.nbt-tt-title .nbt-small a:hover { background: var(--blue-soft); }
.nbt-tt-table { box-shadow: none; border-radius: 12px; }
.nbt-tt-table th:first-child, .nbt-tt-table td:first-child { width: 64px; text-align: center; }
.nbt-tt-table tbody tr:nth-child(-n+3) td { background: linear-gradient(90deg, #fffbeb, #fff 60%); }
.nbt-tt-table tbody tr:nth-child(2) td { background: linear-gradient(90deg, #f4f6f9, #fff 60%); }
.nbt-tt-table tbody tr:nth-child(3) td { background: linear-gradient(90deg, #fdf3ea, #fff 60%); }
.nbt-tt-table tr.nbt-me td { background: var(--blue-soft) !important; box-shadow: inset 0 0 0 9999px transparent; }
.nbt-tt-table tr.nbt-me td:first-child { box-shadow: inset 4px 0 0 var(--blue); }
.nbt-tt-rank { display: inline-grid; place-items: center; min-width: 30px; height: 30px; padding: 0 6px; border-radius: 9px; background: var(--surface-soft); color: var(--muted); font-size: 13px; font-weight: 800; font-variant-numeric: tabular-nums; }
.nbt-tt-rank.is-top { background: none; font-size: 22px; line-height: 1; }
.nbt-tt-table td a b { color: var(--ink); }
.nbt-tt-foot { text-align: center; color: var(--muted); }
@media (max-width: 760px) {
  .nbt-tt-hero { align-items: flex-start; padding: 20px 18px; border-radius: 16px; }
  .nbt-tt-hero .nbt-toptabs { width: 100%; justify-content: stretch; } .nbt-tt-hero .nbt-toptab { flex: 1; justify-content: center; padding: 9px 6px; font-size: 12px; }
  .nbt-tt-card { padding: 16px 14px; border-radius: 14px; }
  .nbt-tt-table th:first-child, .nbt-tt-table td:first-child { width: auto; text-align: left; }
}

/* Donor / VIP star badge (source GIF is 64px for crisp scaling) */
img[src$="star.gif"] { width: 16px; height: 16px; vertical-align: -3px; filter: drop-shadow(0 1px 1px rgba(176,96,6,.35)); }

/* ---- Mobile header: logo + actions + burger on one row ---- */
@media (max-width: 1060px) {
  .nbt-hd-bar { flex-wrap: wrap; align-items: center; }
  .nbt-hd-logo { order: 1; margin-right: auto; }
  .nbt-hd-actions { order: 2; margin-left: 0; gap: 2px; }
  .nbt-hd-burger { order: 3; margin-left: 4px; width: 42px; height: 42px; }
  .nbt-hd-nav { order: 5; }
}
@media (max-width: 480px) {
  .nbt-hd-icon, .nbt-hd-user { height: 40px; }
  .nbt-hd-actions .nbt-hd-logout { display: none; }
  .nbt-hd-uname { display: none; }
}

/* ---- Mobile footer ---- */
@media (max-width: 760px) {
  .nbt-ft { margin: 20px 0 8px; padding: 22px 18px 16px; border-radius: 18px; text-align: center; }
  .nbt-ft-top { flex-direction: column; align-items: center; gap: 16px; padding-bottom: 16px; }
  .nbt-ft-brand { align-items: center; }
  .nbt-ft-brand strong { font-size: 22px; }
  .nbt-ft-links { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; width: 100%; }
  .nbt-ft-links a { display: block; padding: 10px 8px; border: 1px solid rgba(255,255,255,.16); border-radius: 12px; background: rgba(255,255,255,.07); text-align: center; font-size: 13px; }
  .nbt-ft-bottom { flex-direction: column; align-items: center; gap: 4px; padding-top: 14px; text-align: center; }
}
@media (max-width: 360px) { .nbt-ft-links { grid-template-columns: minmax(0, 1fr); } }

/* Mobile header: keep logo, mail, avatar and burger on ONE row */
@media (max-width: 760px) {
  .nbt-hd-bar { gap: 6px; padding: 8px 10px; }
  .nbt-hd-logo { flex: 1 1 auto; min-width: 0; }
  .nbt-hd-logo img { height: 32px; }
  .nbt-hd-actions { flex: 0 0 auto; gap: 4px; }
  .nbt-hd-uname, .nbt-hd-actions .nbt-hd-logout { display: none; }
  .nbt-hd-user { width: 44px; height: 44px; padding: 0; justify-content: center; border-radius: 50%; }
  .nbt-hd-icon { width: 44px; height: 44px; }
  .nbt-hd-burger { flex: 0 0 44px; width: 44px; height: 44px; margin: 0; padding: 0; display: grid; place-items: center; line-height: 1; }
  .nbt-hd-burger i { display: block; margin: 0; }
}

/* Header logo: always flush left (the page wrapper centres text) */
.nbt-hd-logo { display: flex; align-items: center; justify-content: flex-start; text-align: left; }
.nbt-hd-logo img { margin: 0 !important; margin-right: auto !important; flex: 0 0 auto; width: auto; max-width: none; }
@media (max-width: 760px) { .nbt-hd-logo { flex: 1 1 auto; } .nbt-hd-logo img { max-width: 100%; } }

/* Status strip: collapsible on phones (name only until opened) */
.nbt-status-toggle { display: none; }
@media (max-width: 760px) {
  .nbt-status td { padding: 8px 12px; }
  .nbt-status .nbt-welcome { display: inline-block; margin: 0; padding: 4px 0; font-size: 15px; text-align: left; }
  .nbt-status td.bottom:first-child { position: relative; text-align: left !important; }
  .nbt-status-toggle { position: absolute; top: 4px; right: 4px; display: inline-flex; align-items: center; gap: 7px; height: 38px; padding: 0 14px; border: 1px solid var(--border-strong); border-radius: 999px; background: #fff; color: var(--blue-ink); font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
  .nbt-status-toggle i { font-size: 11px; transition: transform .18s ease; }
  .nbt-status.is-open .nbt-status-toggle { background: var(--blue-soft); border-color: var(--blue); }
  .nbt-status.is-open .nbt-status-toggle i { transform: rotate(180deg); }
  .nbt-status .nbt-status-body, .nbt-status td[align="right"] { display: none !important; }
  .nbt-status.is-open .nbt-status-body { display: block !important; margin-top: 8px; padding-top: 10px; border-top: 1px solid var(--border); }
  .nbt-status.is-open td[align="right"] { display: block !important; padding-top: 0; border-top: 1px solid var(--border); text-align: center !important; }
  .nbt-status.is-open .nbt-stat-line, .nbt-status.is-open .nbt-stat-btn { text-align: center; }
  .nbt-status table, .nbt-status > tbody > tr > td { margin-bottom: 0; }
}

/* ===================== Port checker (nbt-pc) ===================== */
.nbt-pc { display: flex; flex-direction: column; gap: 16px; max-width: 820px; margin: 0 auto; }
.nbt-pc-hero { position: relative; isolation: isolate; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 18px; padding: 26px 28px; overflow: hidden; border-radius: 20px; background: radial-gradient(circle at 92% 0%, rgba(56,189,248,.4), transparent 36%), linear-gradient(120deg, #0b2547 0%, #12406f 58%, #1d65a6 100%); color: #fff; box-shadow: 0 14px 34px rgba(11,37,71,.2); }
.nbt-pc-eyebrow { color: #9fd0ff; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-pc-hero h1 { all: unset; display: block; margin: 6px 0 4px; color: #fff; font-size: clamp(24px, 4vw, 32px); font-weight: 800; letter-spacing: -.03em; }
.nbt-pc-hero p { margin: 0; max-width: 460px; color: rgba(235,245,255,.8); font-size: 14px; }
.nbt-pc-ip { padding: 11px 18px; border: 1px solid rgba(255,255,255,.22); border-radius: 14px; background: rgba(255,255,255,.1); backdrop-filter: blur(8px); text-align: center; }
.nbt-pc-ip span { display: block; color: rgba(235,245,255,.75); font-size: 11px; }
.nbt-pc-ip strong { font-size: 18px; font-variant-numeric: tabular-nums; overflow-wrap: anywhere; }
.nbt-pc-result { display: flex; align-items: flex-start; gap: 18px; padding: 22px 24px; border: 1px solid var(--line); border-left: 6px solid var(--pc, #16a34a); border-radius: 18px; background: linear-gradient(120deg, var(--pc-soft, #f0fdf4), #fff 70%); box-shadow: var(--premium-shadow); }
.nbt-pc-result.is-open { --pc: #16a34a; --pc-soft: #ecfdf3; }
.nbt-pc-result.is-closed { --pc: #dc2626; --pc-soft: #fef2f2; }
.nbt-pc-icon { display: grid; flex: 0 0 56px; place-items: center; width: 56px; height: 56px; border-radius: 50%; background: var(--pc); color: #fff; font-size: 26px; box-shadow: 0 8px 18px color-mix(in srgb, var(--pc) 35%, transparent); }
.nbt-pc-result h2 { margin: 0 0 4px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--ink); font-size: 19px; }
.nbt-pc-result p { margin: 2px 0; color: var(--ink-soft); font-size: 14px; }
.nbt-pc-result code { padding: 2px 8px; border-radius: 7px; background: rgba(15,35,80,.07); font-size: 13px; }
.nbt-pc-tips { margin: 10px 0 0; padding-left: 20px; color: var(--ink-soft); font-size: 13px; line-height: 1.8; }
.nbt-pc-good { color: #166534 !important; }
.nbt-pc-form { display: grid; grid-template-columns: minmax(0, 1fr) auto; gap: 12px; align-items: end; }
.nbt-pc-form .nbt-form-field:nth-child(2):not(:last-of-type) { grid-column: 1; }
.nbt-pc-form .btn { min-height: 44px; padding: 8px 24px; }
.nbt-pc-quick { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-top: 14px; color: var(--muted); font-size: 13px; }
.nbt-pc-chip { height: 34px; padding: 0 16px; border: 1px solid var(--border-strong); border-radius: 999px; background: #fff; color: var(--blue-ink); font: inherit; font-weight: 700; font-variant-numeric: tabular-nums; cursor: pointer; transition: all .15s ease; }
.nbt-pc-chip:hover { border-color: var(--blue); background: var(--blue-soft); }
.nbt-pc-help p { margin: 0; color: var(--ink-soft); font-size: 14px; line-height: 1.8; }
@media (max-width: 600px) {
  .nbt-pc-hero { padding: 20px 18px; border-radius: 16px; } .nbt-pc-ip { width: 100%; }
  .nbt-pc-result { flex-direction: column; padding: 18px 16px; }
  .nbt-pc-form { grid-template-columns: minmax(0, 1fr); } .nbt-pc-form .btn { width: 100%; justify-content: center; }
}

/* =====================================================================
   LEGACY MODERNIZER — gives every old-style page the new look
   (tables with border=, class=main/tableb, <font>, centered blocks)
   ===================================================================== */
.mainouter table[border]:not([border="0"]):not(.nbt-forumtable),
.mainouter table.main:not(.nbt-forumtable):not([border="0"]),
.mainouter table.tableoutborder, .mainouter table#torrenttable {
  border-collapse: separate; border-spacing: 0; width: auto; max-width: 100%;
  border: 1px solid var(--line) !important; border-radius: 14px; overflow: hidden;
  background: #fff; box-shadow: var(--premium-shadow);
}
.mainouter table[border]:not([border="0"]) > tbody > tr > td,
.mainouter table[border]:not([border="0"]) > tr > td,
.mainouter table[border]:not([border="0"]) > thead > tr > th,
.mainouter table[border]:not([border="0"]) > tbody > tr > th,
.mainouter table.tableoutborder td, .mainouter table#torrenttable td {
  padding: 10px 14px; border: 0; border-bottom: 1px solid var(--border); border-right: 1px solid var(--border);
}
.mainouter table[border]:not([border="0"]) tr > td:last-child,
.mainouter table[border]:not([border="0"]) tr > th:last-child { border-right: 0; }
.mainouter table[border]:not([border="0"]) tr:last-child > td { border-bottom: 0; }
.mainouter table td.colhead, .mainouter table th, td.tabletitle { background: linear-gradient(180deg, #f0f6ff, #e4eeff); color: var(--blue-ink); font-size: 12px; font-weight: 800; letter-spacing: .03em; }
.mainouter table td.rowhead { background: var(--surface-soft); color: var(--ink-soft); font-weight: 700; }
.mainouter td.tableb, .mainouter td.tablea { background: #fff; }
.mainouter table:has(td.colhead) tbody tr:hover > td:not(.colhead), .mainouter table:has(td.colhead) > tr:hover > td:not(.colhead) { background: #f3f8ff; }

/* Old fixed-width / centred blocks should never overflow */
.mainouter table[width], .mainouter div[style*="width"] { max-width: 100%; }
.mainouter img { max-width: 100%; height: auto; }
.mainouter center > table, .mainouter p[align="center"] > table { margin-left: auto; margin-right: auto; }
.mainouter font[color="red"], .mainouter font[color="#ff0000"] { font-weight: 700; }
.mainouter textarea { width: 100%; max-width: 100%; }
.mainouter input[type="text"], .mainouter input[type="password"], .mainouter input[type="email"], .mainouter input[type="number"], .mainouter input[type="url"], .mainouter select { max-width: 100%; min-height: 40px; border-radius: 10px; }
.mainouter td.embedded { border: 0 !important; padding: 0; background: transparent; }
.mainouter p.error, .mainouter .error { padding: 12px 16px; border: 1px solid #fca5a5; border-left: 5px solid #dc2626; border-radius: 12px; background: #fef2f2; color: #7f1d1d; }

/* JS wraps wide legacy tables so phones scroll sideways instead of overflowing */
.nbt-legacy-scroll { max-width: 100%; margin: 10px 0; overflow-x: auto; -webkit-overflow-scrolling: touch; }
.nbt-legacy-scroll > table { margin: 0 !important; }
@media (max-width: 760px) {
  .mainouter table[border]:not([border="0"]) > tbody > tr > td, .mainouter table[border]:not([border="0"]) > tr > td { padding: 9px 10px; font-size: 13px; }
  td.outer { overflow-x: hidden; }
}

/* ===================== Staff tools (nbt-ad) ===================== */
.nbt-ad-hero { display: flex; align-items: center; gap: 18px; margin: 0 0 18px; padding: 22px 26px; border-radius: 18px; background: radial-gradient(circle at 94% 0%, rgba(56,189,248,.35), transparent 40%), linear-gradient(120deg, #0b2547 0%, #12406f 58%, #1d65a6 100%); color: #fff; box-shadow: 0 12px 28px rgba(11,37,71,.18); }
.nbt-ad-heroicon { display: grid; flex: 0 0 56px; place-items: center; width: 56px; height: 56px; border: 1px solid rgba(255,255,255,.25); border-radius: 16px; background: rgba(255,255,255,.12); font-size: 24px; color: #bfe3ff; }
.nbt-ad-eyebrow { color: #9fd0ff; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-ad-hero h1 { all: unset; display: block; margin: 3px 0 2px; color: #fff; font-size: clamp(21px, 3.4vw, 28px); font-weight: 800; letter-spacing: -.02em; }
.nbt-ad-hero p { margin: 0; color: rgba(235,245,255,.8); font-size: 14px; }
.nbt-ad-grid { display: grid; grid-template-columns: minmax(0, 1.3fr) minmax(0, 1fr); gap: 16px; align-items: start; }
.nbt-ad-card { margin-bottom: 0; }
.nbt-ad-form { display: flex; flex-direction: column; gap: 14px; }
.nbt-ad-two { display: grid; grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; }
.nbt-ad-form .btn { align-self: flex-start; min-height: 44px; padding: 8px 26px; }
.nbt-ad-ops { display: grid; grid-template-columns: repeat(3, 1fr); gap: 8px; }
.nbt-ad-ops label { cursor: pointer; }
.nbt-ad-ops input { position: absolute; opacity: 0; pointer-events: none; }
.nbt-ad-ops span { display: flex; align-items: center; justify-content: center; gap: 7px; height: 44px; border: 2px solid var(--border); border-radius: 12px; background: #fff; color: var(--ink-soft); font-size: 13px; font-weight: 700; transition: all .15s ease; }
.nbt-ad-ops label:hover span { border-color: var(--blue); }
.nbt-ad-ops input:checked + span { border-color: var(--blue); background: var(--blue-soft); color: var(--blue-ink); box-shadow: 0 5px 14px rgba(37,99,235,.18); }
.nbt-ad-ops input:focus-visible + span { outline: 3px solid rgba(37,99,235,.35); outline-offset: 2px; }
.nbt-ad-bulk { border-top: 4px solid #f59e0b; background: linear-gradient(180deg, #fffdf6, #fff); }
.nbt-ad-note { margin: 0 0 14px; color: var(--ink-soft); font-size: 14px; line-height: 1.7; }
.nbt-ad-bulk form { display: flex; flex-wrap: wrap; gap: 8px; }
.nbt-ad-secret { display: flex; align-items: flex-start; gap: 16px; margin-bottom: 16px; padding: 20px 22px; border: 1px solid #86efac; border-left: 6px solid #16a34a; border-radius: 16px; background: linear-gradient(120deg, #ecfdf3, #fff 70%); box-shadow: var(--premium-shadow); }
.nbt-ad-secret-icon { display: grid; flex: 0 0 48px; place-items: center; width: 48px; height: 48px; border-radius: 50%; background: #16a34a; color: #fff; font-size: 21px; }
.nbt-ad-secret h2 { margin: 0 0 4px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; font-size: 18px; }
.nbt-ad-secret p { margin: 0 0 10px; color: var(--ink-soft); font-size: 14px; }
.nbt-ad-secret-code { display: flex; flex-wrap: wrap; align-items: center; gap: 10px; }
.nbt-ad-secret-code code { padding: 8px 16px; border: 1px dashed #16a34a; border-radius: 10px; background: #fff; font-size: 20px; font-weight: 800; letter-spacing: .08em; color: #14532d; }
@media (max-width: 760px) {
  .nbt-ad-grid { grid-template-columns: minmax(0, 1fr); }
  .nbt-ad-hero { padding: 18px 16px; border-radius: 16px; gap: 14px; }
  .nbt-ad-heroicon { flex-basis: 46px; width: 46px; height: 46px; font-size: 20px; }
  .nbt-ad-form .btn { width: 100%; align-self: stretch; justify-content: center; }
  .nbt-ad-secret { flex-direction: column; }
}

/* Staff tools: a lone card sits centred instead of leaving an empty column */
.nbt-ad-grid.is-single, .nbt-ad-grid:has(> :only-child) { grid-template-columns: minmax(0, 600px); justify-content: center; }
.nbt-ad-grid.is-single .nbt-ad-card { box-shadow: var(--premium-shadow-lg); padding: 24px 26px; }
.nbt-ad-hero { max-width: 100%; }
@media (max-width: 760px) { .nbt-ad-grid.is-single, .nbt-ad-grid:has(> :only-child) { grid-template-columns: minmax(0, 1fr); } .nbt-ad-grid.is-single .nbt-ad-card { padding: 18px 16px; } }

/* MySQL status page */
.nbt-ms-bar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin-bottom: 14px; }
.nbt-ms-bar > span:last-child { display: flex; flex-wrap: wrap; gap: 8px; }
.nbt-ms-time { color: var(--muted); font-size: 13px; }
.nbt-ms-stats { margin-bottom: 18px; }
.nbt-ms-panel { margin-bottom: 16px; }
.nbt-ms-bar-track { display: block; min-width: 120px; height: 8px; border-radius: 999px; background: #e3ebf5; overflow: hidden; }
.nbt-ms-bar-track span { display: block; height: 100%; border-radius: inherit; background: linear-gradient(90deg, var(--blue), var(--cyan)); }
.nbt-ms-note { margin-top: 8px; color: var(--muted); text-align: center; }
@media (max-width: 600px) { .nbt-ms-bar .btn { flex: 1 1 auto; justify-content: center; } }

/* ===================== Upload page (nbt-up) ===================== */
.nbt-up-hero { display: flex; align-items: center; gap: 18px; max-width: 1100px; margin: 0 auto 18px; padding: 24px 28px; border-radius: 20px; background: radial-gradient(circle at 94% 0%, rgba(56,189,248,.38), transparent 40%), linear-gradient(120deg, #0b2547 0%, #12406f 58%, #1d65a6 100%); color: #fff; box-shadow: 0 14px 34px rgba(11,37,71,.2); }
.nbt-up-heroicon { display: grid; flex: 0 0 60px; place-items: center; width: 60px; height: 60px; border: 1px solid rgba(255,255,255,.25); border-radius: 18px; background: rgba(255,255,255,.12); color: #bfe3ff; font-size: 26px; }
.nbt-up-eyebrow { color: #9fd0ff; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-up-hero h1 { all: unset; display: block; margin: 3px 0 2px; color: #fff; font-size: clamp(22px, 3.6vw, 30px); font-weight: 800; letter-spacing: -.02em; }
.nbt-up-hero p { margin: 0; color: rgba(235,245,255,.8); font-size: 14px; }
.nbt-up-layout { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 18px; align-items: start; max-width: 1100px; margin: 0 auto; }
.nbt-up-main { display: flex; flex-direction: column; gap: 16px; }
.nbt-up-side { position: sticky; top: 90px; display: flex; flex-direction: column; gap: 16px; }
.nbt-up-num { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: var(--grad-brand); color: #fff; font-weight: 800; font-size: 14px; box-shadow: 0 6px 14px rgba(37,99,235,.3); }
.nbt-panel-head h3 small { color: var(--muted); font-weight: 500; font-size: 12px; background: none; padding: 0; }
.nbt-up-drop { position: relative; display: flex; flex-direction: column; align-items: center; gap: 6px; padding: 34px 20px; border: 2px dashed var(--border-strong); border-radius: 16px; background: linear-gradient(145deg, #fff, var(--surface-soft)); text-align: center; cursor: pointer; transition: all .15s ease; }
.nbt-up-drop:hover, .nbt-up-drop.is-drag { border-color: var(--blue); background: var(--blue-soft); transform: translateY(-1px); }
.nbt-up-drop.has-file { border-style: solid; border-color: #16a34a; background: linear-gradient(145deg, #f0fdf4, #fff); }
.nbt-up-drop.is-bad { border-color: #dc2626; background: #fef2f2; }
.nbt-up-drop input[type="file"] { position: absolute; inset: 0; width: 100%; height: 100%; opacity: 0; cursor: pointer; }
.nbt-up-drop-icon { display: grid; place-items: center; width: 60px; height: 60px; border-radius: 18px; background: var(--blue-soft); color: var(--blue); font-size: 26px; }
.nbt-up-drop.has-file .nbt-up-drop-icon { background: #dcfce7; color: #16a34a; }
.nbt-up-drop-title { color: var(--ink); font-size: 16px; font-weight: 800; overflow-wrap: anywhere; }
.nbt-up-drop-sub { color: var(--muted); font-size: 13px; }
.nbt-up-fields { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 14px; }
.nbt-up-full { grid-column: 1 / -1; }
.nbt-up-poster { display: flex; align-items: center; gap: 14px; padding: 10px 12px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-soft); }
.nbt-up-poster img { width: 72px; height: 100px; object-fit: cover; border-radius: 9px; box-shadow: 0 6px 16px rgba(30,64,175,.2); }
.nbt-up-poster span { color: var(--muted); font-size: 13px; }
.nbt-up-submitbar { position: sticky; bottom: 12px; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 12px; padding: 12px 16px; border: 1px solid var(--line); border-radius: 16px; background: rgba(255,255,255,.95); box-shadow: 0 12px 32px rgba(16,35,63,.16); backdrop-filter: blur(12px); }
.nbt-up-status { color: var(--muted); font-size: 14px; }
.nbt-up-status.is-ready { color: #15803d; font-weight: 700; }
.nbt-up-submitbar .btn { min-height: 48px; padding: 8px 30px; font-size: 15px; }
.nbt-up-tips ul { display: flex; flex-direction: column; gap: 10px; margin: 0; padding: 0; list-style: none; }
.nbt-up-tips li { display: flex; gap: 10px; color: var(--ink-soft); font-size: 13px; line-height: 1.6; }
.nbt-up-tips li i { flex: 0 0 18px; margin-top: 3px; color: var(--blue); }
.nbt-up-tips li:last-child i { color: #d97706; }
@media (max-width: 900px) {
  .nbt-up-layout { grid-template-columns: minmax(0, 1fr); }
  .nbt-up-side { position: static; order: -1; }
}
@media (max-width: 600px) {
  .nbt-up-hero { padding: 18px 16px; border-radius: 16px; gap: 14px; } .nbt-up-heroicon { flex-basis: 48px; width: 48px; height: 48px; font-size: 21px; }
  .nbt-up-fields { grid-template-columns: minmax(0, 1fr); }
  .nbt-up-drop { padding: 26px 14px; }
  .nbt-up-submitbar { flex-direction: column; align-items: stretch; bottom: 6px; } .nbt-up-submitbar .btn { width: 100%; justify-content: center; }
}

/* ===================== Shoutbox v2 (chat bubbles) ===================== */
.nbt-sb-hero { display: flex; align-items: center; gap: 16px; margin: 0 0 16px; padding: 20px 24px; border-radius: 18px; background: radial-gradient(circle at 94% 0%, rgba(56,189,248,.38), transparent 40%), linear-gradient(120deg, #0b2547 0%, #12406f 58%, #1d65a6 100%); color: #fff; box-shadow: 0 12px 28px rgba(11,37,71,.18); }
.nbt-sb-heroicon { display: grid; flex: 0 0 52px; place-items: center; width: 52px; height: 52px; border: 1px solid rgba(255,255,255,.25); border-radius: 15px; background: rgba(255,255,255,.12); color: #bfe3ff; font-size: 22px; }
.nbt-sb-eyebrow { color: #9fd0ff; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-sb-hero h1 { all: unset; display: block; margin: 2px 0 1px; color: #fff; font-size: clamp(21px, 3.4vw, 28px); font-weight: 800; letter-spacing: -.02em; }
.nbt-sb-hero p { margin: 0; color: rgba(235,245,255,.8); font-size: 13px; }
.nbt-sb-online { display: inline-flex; align-items: center; gap: 8px; margin-left: auto; padding: 9px 16px; border: 1px solid rgba(255,255,255,.22); border-radius: 999px; background: rgba(255,255,255,.12); font-size: 13px; white-space: nowrap; }
.nbt-sb-online .nbt-online-dot { margin: 0; }
.nbt-sb-online b { font-size: 16px; font-variant-numeric: tabular-nums; }

.nbt-shout { position: relative; display: flex; flex-direction: column; gap: 14px; }
.nbt-shout-list { gap: 8px; height: min(62vh, 560px); max-height: none; padding: 14px; border: 1px solid var(--line); border-radius: 18px; background: linear-gradient(180deg, #f7faff, #eef4fd); box-shadow: inset 0 2px 8px rgba(30,64,175,.05); scroll-behavior: smooth; }
.nbt-shout-msg { display: flex; flex-wrap: nowrap; align-items: flex-start; gap: 10px; max-width: 92%; padding: 0; background: none !important; }
.nbt-shout-msg:nth-child(even) { background: none; }
.nbt-shout-avatar { display: grid; flex: 0 0 36px; place-items: center; width: 36px; height: 36px; border-radius: 50%; color: #fff; font-size: 14px; font-weight: 800; box-shadow: 0 3px 8px rgba(15,35,80,.2); text-shadow: 0 1px 1px rgba(0,0,0,.25); }
.nbt-shout-body { min-width: 0; padding: 8px 13px 9px; border: 1px solid var(--border); border-radius: 4px 16px 16px 16px; background: #fff; box-shadow: 0 2px 6px rgba(30,64,175,.06); }
.nbt-shout-head { display: flex; align-items: baseline; gap: 8px; margin-bottom: 1px; }
.nbt-shout-user { font-size: 13px; }
.nbt-shout-time { color: var(--muted); font-size: 11px; }
.nbt-shout-text { flex: none; color: var(--ink); font-size: 14px; line-height: 1.55; }
.nbt-shout-text img { max-width: 100%; vertical-align: middle; }
.nbt-shout-del, .nbt-shout-head form { margin-left: auto; }
.nbt-shout-msg.is-me { flex-direction: row-reverse; margin-left: auto; }
.nbt-shout-msg.is-me .nbt-shout-body { border-color: #bcd3ff; border-radius: 16px 4px 16px 16px; background: linear-gradient(135deg, #e3eeff, #d6e6ff); }
.nbt-shout-msg.is-me .nbt-shout-head { flex-direction: row-reverse; }
.nbt-shout-sys { max-width: 100%; }
.nbt-shout-sys .nbt-shout-body { border-color: #f3dc8a; background: #fff9de; }
.nbt-shout-jump { position: absolute; left: 50%; bottom: 120px; z-index: 4; display: inline-flex; align-items: center; gap: 8px; padding: 9px 18px; border: 0; border-radius: 999px; background: var(--grad-brand); color: #fff; font: inherit; font-size: 13px; font-weight: 700; box-shadow: 0 10px 24px rgba(37,99,235,.4); transform: translateX(-50%); cursor: pointer; }
.nbt-shout-jump[hidden] { display: none; }
.nbt-shout-form { padding: 10px; border: 1px solid var(--line); border-radius: 16px; background: #fff; box-shadow: var(--premium-shadow); }
.nbt-shout-row { display: flex; gap: 8px; }
.nbt-shout-row input { min-height: 46px; border-radius: 999px !important; padding: 0 18px !important; }
.nbt-shout-row button { height: 46px; border-radius: 999px; }
.nbt-shout-meta { display: flex; justify-content: space-between; padding: 6px 14px 0; color: var(--muted); font-size: 11px; }

.nbt-streak { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 6px; margin: 0 0 14px; }
.nbt-streak-dot { display: flex; flex-direction: column; align-items: center; gap: 1px; padding: 8px 2px; border: 2px solid var(--border); border-radius: 12px; background: #fff; color: var(--muted); }
.nbt-streak-dot b { font-size: 15px; line-height: 1.1; } .nbt-streak-dot small { font-size: 10px; }
.nbt-streak-dot.is-done { border-color: #16a34a; background: linear-gradient(145deg, #ecfdf3, #fff); color: #15803d; }
.nbt-streak-dot.is-done b::after { content: " ✓"; font-size: 11px; }
.nbt-streak-dot.is-next { border-color: #f59e0b; background: #fffbeb; color: #b45309; box-shadow: 0 6px 14px rgba(245,158,11,.25); animation: nbt-pop 1.6s ease-in-out infinite; }
@keyframes nbt-pop { 50% { transform: translateY(-2px); } }
.nbt-checkin-btn { border-radius: 14px; }

@media (max-width: 760px) {
  .nbt-sb-hero { padding: 16px; border-radius: 16px; gap: 12px; flex-wrap: wrap; } .nbt-sb-heroicon { flex-basis: 44px; width: 44px; height: 44px; }
  .nbt-sb-online { margin-left: 0; }
  .nbt-shout-list { height: 56vh; padding: 10px; }
  .nbt-shout-msg { max-width: 100%; }
  .nbt-shout-jump { bottom: 130px; }
  .nbt-shout-row { flex-wrap: wrap; } .nbt-shout-row input { flex: 1 1 100%; }
  .nbt-shout-row .nbt-smile-toggle, .nbt-shout-row button { flex: 1 1 auto; }
  .nbt-streak { gap: 4px; } .nbt-streak-dot small { display: none; }
}
@media (prefers-reduced-motion: reduce) { .nbt-streak-dot.is-next { animation: none; } .nbt-shout-list { scroll-behavior: auto; } }

/* Shoutbox: back to the compact one-line style (override of the bubble layout) */
.nbt-shout-list { gap: 3px; height: auto; max-height: 60vh; padding: 6px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface); box-shadow: none; }
.nbt-shout-msg, .nbt-shout-msg.is-me { display: flex; flex-direction: row; flex-wrap: wrap; align-items: baseline; gap: 6px; max-width: 100%; margin: 0; padding: 5px 10px; border-radius: 8px; font-size: 13px; line-height: 1.6; background: #f4f6fa !important; }
.nbt-shout-msg:nth-child(even) { background: #eef1f7 !important; }
.nbt-shout-msg.is-me { background: #e4eeff !important; }
.nbt-shout-sys, .nbt-shout-sys:nth-child(even) { background: #fdf6d8 !important; }
.nbt-shout-avatar { flex: 0 0 auto; align-self: center; width: 10px; height: 10px; border-radius: 2px; font-size: 0; box-shadow: none; text-shadow: none; order: 2; }
.nbt-shout-body { display: contents; }
.nbt-shout-head { display: contents; }
.nbt-shout-time { order: 1; color: var(--muted); font-size: 12px; white-space: nowrap; font-variant-numeric: tabular-nums; }
.nbt-shout-time::before { content: "("; } .nbt-shout-time::after { content: ")"; }
.nbt-shout-user { order: 3; font-size: 13px; font-weight: 700; white-space: nowrap; }
.nbt-shout-text { order: 4; flex: 1 1 160px; min-width: 0; color: var(--ink-soft); font-size: 13px; line-height: 1.6; }
.nbt-shout-text img { max-height: 22px; width: auto; vertical-align: middle; }
.nbt-shout-del, .nbt-shout-msg form { order: 5; margin-left: auto; }
.nbt-shout-msg.is-me .nbt-shout-head { flex-direction: row; }
@media (max-width: 760px) { .nbt-shout-list { height: auto; max-height: 56vh; padding: 6px; } }

/* Shoutbox: input sits right under the message list; "clear all" at the very bottom */
.nbt-shout { gap: 0; }
.nbt-shout > .nbt-checkin-inline { margin-bottom: 14px; }
.nbt-shout-list { margin-bottom: 8px; }
.nbt-shout-jump { bottom: 96px; }
.nbt-shout-clear { margin: 14px 0 0; text-align: right; }

/* ===================== Forums v2 ===================== */
.nbt-fm-hero { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; margin: 0 0 18px; padding: 24px 28px; border-radius: 20px; background: radial-gradient(circle at 94% 0%, rgba(56,189,248,.38), transparent 40%), linear-gradient(120deg, #0b2547 0%, #12406f 58%, #1d65a6 100%); color: #fff; box-shadow: 0 14px 34px rgba(11,37,71,.2); }
.nbt-fm-hero-main { min-width: 0; flex: 1 1 320px; }
.nbt-fm-eyebrow { color: #9fd0ff; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-fm-hero h1 { all: unset; display: block; margin: 4px 0 4px; color: #fff; font-size: clamp(22px, 3.6vw, 31px); font-weight: 800; line-height: 1.25; letter-spacing: -.02em; overflow-wrap: anywhere; }
.nbt-fm-hero p { margin: 0; color: rgba(235,245,255,.82); font-size: 14px; }
.nbt-fm-hero p b { color: #fff; }
.nbt-fm-crumbs { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; color: rgba(235,245,255,.75); font-size: 12px; font-weight: 600; }
.nbt-fm-crumbs a { color: #bfe3ff !important; text-decoration: none !important; } .nbt-fm-crumbs a:hover { color: #fff !important; }
.nbt-fm-crumbs i { font-size: 9px; opacity: .7; }
.nbt-fm-hero-actions { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.nbt-fm-search { display: flex; align-items: center; gap: 8px; min-width: min(100%, 320px); padding: 5px 5px 5px 14px; border-radius: 999px; background: #fff; box-shadow: 0 10px 24px rgba(0,0,0,.2); }
.nbt-fm-search > i { color: #64748b; }
.nbt-fm-search input[type="search"] { flex: 1; min-width: 0; height: 38px; border: 0 !important; background: transparent !important; box-shadow: none !important; color: var(--ink); font-size: 14px; outline: none; }
.nbt-fm-search button { height: 38px; padding: 0 18px; border: 0; border-radius: 999px; background: var(--grad-brand); color: #fff; font-weight: 700; cursor: pointer; }
.nbt-fm-newbtn { background: #fff !important; color: var(--blue-ink) !important; box-shadow: 0 8px 18px rgba(0,0,0,.2) !important; }

.nbt-forum-row { padding: 16px 18px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--premium-shadow); transition: transform .15s ease, box-shadow .15s ease; }
.nbt-forum-row:hover { transform: translateY(-2px); box-shadow: var(--premium-shadow-lg); }
.nbt-forum-row.has-new { border-left: 5px solid var(--blue); }
.nbt-forum-name { font-size: 16px; font-weight: 800; letter-spacing: -.01em; }
.nbt-badge-new { margin-left: 6px; padding: 1px 9px; border-radius: 999px; background: #ef4444; color: #fff; font-size: 10px; font-weight: 800; vertical-align: middle; }
.nbt-forum-lastpost { display: flex; flex-direction: column; gap: 2px; min-width: 0; font-size: 12px; }
.nbt-fm-lp-title { overflow: hidden; color: var(--ink) !important; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.nbt-fm-lp-meta { color: var(--muted); }

.nbt-topiccard { border: 1px solid var(--line); border-radius: 14px; box-shadow: 0 2px 8px rgba(30,64,175,.05); transition: transform .12s ease, box-shadow .12s ease; }
.nbt-topiccard:hover { transform: translateY(-1px); box-shadow: 0 10px 22px rgba(30,64,175,.12); }
.nbt-topiccard.has-new { border-left: 5px solid var(--blue); background: linear-gradient(90deg, #f3f8ff, #fff 45%); }
.nbt-topiccard.is-sticky { border-left: 5px solid #f59e0b; background: linear-gradient(90deg, #fffbeb, #fff 45%); }
.nbt-topiccard-subject { font-weight: 800; }

.nbt-forum-actions { display: flex; flex-wrap: wrap; justify-content: center; gap: 10px; margin: 16px 0; }
.nbt-forum-actions form { margin: 0; }
.nbt-fm-jump { display: flex; flex-wrap: wrap; align-items: center; justify-content: center; gap: 8px; margin: 14px 0; padding: 10px 14px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); }
.nbt-fm-jump label { color: var(--ink-soft); font-size: 13px; font-weight: 700; }
.nbt-fm-jump select { min-height: 40px; border-radius: 10px; max-width: 100%; }
.nbt-fm-jump .btn { min-height: 40px; }
.nbt-forum-empty { padding: 18px; border: 1px dashed var(--border-strong); border-radius: 14px; background: var(--surface-soft); color: var(--muted); text-align: center; }

.nbt-topic-wrap { margin: 14px 0; }
.nbt-post { border: 1px solid var(--line); border-radius: 16px; overflow: hidden; background: var(--surface); box-shadow: var(--premium-shadow); margin-bottom: 14px; }
.nbt-post-head { padding: 9px 14px; border-bottom: 1px solid var(--border); background: linear-gradient(180deg, #f6f9ff, #eef4ff); }
.nbt-post-side { background: var(--surface-soft); }
.nbt-post-side-avatar img { border-radius: 50%; box-shadow: 0 4px 12px rgba(30,64,175,.2); }
.nbt-post-content { font-size: 14px; line-height: 1.8; overflow-wrap: anywhere; }

.nbt-fm-mod { margin-top: 16px; border-top: 4px solid #f59e0b; }
.nbt-fm-mod-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(300px, 1fr)); gap: 12px; }
.nbt-fm-mod-item { display: flex; flex-direction: column; gap: 6px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.nbt-fm-mod-label { color: var(--ink-soft); font-size: 12px; font-weight: 800; }
.nbt-fm-mod-ctl { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; }
.nbt-fm-mod-ctl input[type="text"], .nbt-fm-mod-ctl select { flex: 1 1 160px; min-width: 0; min-height: 40px; border-radius: 10px; }
.nbt-fm-mod-ctl .btn { min-height: 40px; padding: 6px 16px; }
.nbt-fm-mod-danger { border-color: #fca5a5; background: #fff5f5; }

@media (max-width: 760px) {
  .nbt-fm-hero { padding: 18px 16px; border-radius: 16px; }
  .nbt-fm-hero-actions, .nbt-fm-search { width: 100%; }
  .nbt-fm-newbtn { width: 100%; justify-content: center; }
  .nbt-forum-row { padding: 14px; }
  .nbt-fm-lp-title { white-space: normal; }
  .nbt-forum-actions .btn { flex: 1 1 auto; justify-content: center; }
  .nbt-fm-mod-grid { grid-template-columns: minmax(0, 1fr); }
}

/* Forums: compose / edit / search / admin */
.nbt-fm-compose { display: flex; flex-direction: column; gap: 16px; max-width: 900px; margin: 0 auto; }
.nbt-fm-composeform .nbt-panel { display: flex; flex-direction: column; gap: 14px; }
.nbt-fm-composebar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding-top: 12px; border-top: 1px solid var(--border); }
.nbt-fm-composebar .btn { min-height: 44px; padding: 8px 22px; }
.nbt-fm-hint { color: var(--muted); font-size: 13px; }
.nbt-fm-recentpost { display: flex; gap: 12px; padding: 12px 0; border-bottom: 1px solid var(--border); }
.nbt-fm-recentpost:last-child { border-bottom: 0; }
.nbt-fm-recentpost > img { flex: 0 0 44px; width: 44px; height: 44px; border-radius: 50%; object-fit: cover; }
.nbt-fm-recentpost > div { min-width: 0; flex: 1; }
.nbt-fm-recenthead { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 10px; margin-bottom: 3px; }
.nbt-fm-recenthead span { color: var(--muted); font-size: 11px; }
.nbt-fm-recentbody { color: var(--ink-soft); font-size: 13px; line-height: 1.7; overflow-wrap: anywhere; max-height: 220px; overflow: auto; }
.nbt-fm-bigsearch { display: flex; align-items: center; gap: 10px; max-width: 720px; margin: 0 auto 18px; padding: 6px 6px 6px 18px; border: 1px solid var(--line); border-radius: 999px; background: #fff; box-shadow: var(--premium-shadow); }
.nbt-fm-bigsearch > i { color: #64748b; }
.nbt-fm-bigsearch input[type="search"] { flex: 1; min-width: 0; height: 44px; border: 0 !important; background: transparent !important; box-shadow: none !important; font-size: 15px; outline: none; }
.nbt-fm-bigsearch .btn { min-height: 44px; padding: 6px 26px; }
.nbt-fm-found { text-align: center; color: var(--ink-soft); }
.nbt-fm-pager { text-align: center; margin: 10px 0; }
.nbt-fm-pager a { display: inline-block; padding: 4px 14px; border: 1px solid var(--border-strong); border-radius: 999px; background: #fff; font-weight: 700; text-decoration: none !important; }
.nbt-ef-bar { display: flex; flex-wrap: wrap; gap: 8px; margin-bottom: 14px; }
.nbt-ef-btn { min-height: 34px !important; padding: 5px 14px !important; font-size: 12px !important; }
.nbt-ef-table td:last-child { white-space: nowrap; }
@media (max-width: 760px) {
  .nbt-fm-composebar { flex-direction: column; align-items: stretch; } .nbt-fm-composebar > div { display: flex; flex-direction: column-reverse; gap: 8px; } .nbt-fm-composebar .btn { width: 100%; justify-content: center; }
  .nbt-fm-bigsearch { padding-left: 14px; } .nbt-fm-bigsearch .btn { padding: 6px 16px; }
  .nbt-ef-table td:last-child { white-space: normal; }
}

/* Donor star: fixed small size everywhere (incl. flex lists like the online users) */
img[src*="star.gif"], .nbt-activeusers img, .nbt-online-users img[src*="star"], .nbt-shout-user img[src*="star"] {
  width: 16px !important; height: 16px !important; min-width: 0; max-width: 16px !important;
  flex: 0 0 16px; align-self: center; vertical-align: -3px; margin: 0 2px;
}
.nbt-activeusers img[src*="warned"] { width: 14px !important; height: 12px !important; max-width: 14px !important; flex-basis: 14px; }

/* Online users: one pill per member, donor/warned icons INSIDE the pill after the name */
.nbt-activeusers a { display: inline; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; transform: none !important; }
.nbt-au { display: inline-flex; align-items: center; gap: 5px; padding: 4px 12px; border: 1px solid var(--border); border-radius: 999px; background: #fff; box-shadow: 0 1px 3px rgba(30,64,175,.06); transition: all .12s ease; }
.nbt-au:hover { border-color: var(--blue); background: var(--blue-soft); transform: translateY(-1px); }
.nbt-au img { margin: 0; }

/* ===================== Info pages: rules / faq / staff / users / log ===================== */
.nbt-casino-hero, .nbt-casino-game-head, .nbt-pokdeng-head { border: 0 !important; border-radius: 20px; background: radial-gradient(circle at 94% 0%, rgba(56,189,248,.38), transparent 40%), linear-gradient(120deg, #0b2547 0%, #12406f 58%, #1d65a6 100%) !important; color: #fff; box-shadow: 0 14px 34px rgba(11,37,71,.2) !important; }
.nbt-pg-hero, .nbt-pg-hero-dir { position: relative; isolation: isolate; display: flex; align-items: center; gap: 18px; max-width: 100%; margin: 0 0 18px; padding: 24px 28px; border: 0 !important; border-radius: 20px; background: radial-gradient(circle at 94% 0%, rgba(56,189,248,.38), transparent 40%), linear-gradient(120deg, #0b2547 0%, #12406f 58%, #1d65a6 100%) !important; color: #fff; box-shadow: 0 14px 34px rgba(11,37,71,.2) !important; overflow: hidden; }
.nbt-pg-heroicon { display: grid; flex: 0 0 58px; place-items: center; width: 58px; height: 58px; border: 1px solid rgba(255,255,255,.25); border-radius: 17px; background: rgba(255,255,255,.12); color: #bfe3ff; font-size: 25px; }
.nbt-pg-eyebrow, .nbt-pg-hero-dir .nbt-pet-eyebrow { color: #9fd0ff !important; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-pg-hero h1, .nbt-pg-hero-dir h1 { all: unset; display: block; margin: 3px 0 3px; color: #fff; font-size: clamp(22px, 3.6vw, 30px); font-weight: 800; letter-spacing: -.02em; }
.nbt-pg-hero p, .nbt-pg-hero-dir p:not(.nbt-pet-eyebrow) { margin: 0; color: rgba(235,245,255,.82) !important; font-size: 14px; }
.nbt-pg-hero-dir > div:first-of-type { flex: 1; min-width: 0; }
.nbt-pg-hero-dir .nbt-directory-stat { border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.12); backdrop-filter: blur(8px); }
.nbt-pg-hero-dir .nbt-directory-stat span { color: rgba(235,245,255,.8); } .nbt-pg-hero-dir .nbt-directory-stat strong { color: #fff; }
.nbt-pg-hero-dir .nbt-staff-tools { display: flex; flex-wrap: wrap; gap: 8px; }
.nbt-pg-hero-dir .nbt-staff-tools .btn-ghost { border-color: rgba(255,255,255,.35) !important; background: rgba(255,255,255,.12) !important; color: #fff !important; }

/* Rules */
.nbt-rules { counter-reset: rule-sec; gap: 18px; }
.nbt-rules .nbt-card { counter-increment: rule-sec; counter-reset: rule; border-top: 4px solid var(--blue); }
.nbt-rules .nbt-card-head h2::before { content: counter(rule-sec); display: inline-grid; place-items: center; width: 30px; height: 30px; margin-right: 10px; border-radius: 50%; background: var(--grad-brand); color: #fff; font-size: 14px; font-weight: 800; vertical-align: middle; }
.nbt-rules-list li { counter-increment: rule; display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; padding: 12px 0 12px 38px; font-size: 14px; }
.nbt-rules-list li::before { content: counter(rule); display: grid; place-items: center; left: 0; top: 11px; width: 26px; height: 26px; border-radius: 8px; background: var(--blue-soft); color: var(--blue-ink); font-size: 12px; font-weight: 800; }
.nbt-penalty { margin-left: 0; background: #fff1f0; border: 1px solid #fecaca; color: #b91c1c; }
.nbt-penalty::before { content: "⚠ "; }

/* FAQ */
.nbt-faq { max-width: 900px; margin: 0 auto; }
.nbt-faq-tools { position: sticky; top: 86px; z-index: 6; margin-bottom: 14px; padding: 10px; border: 1px solid var(--line); border-radius: 18px; background: rgba(255,255,255,.95); box-shadow: var(--premium-shadow); backdrop-filter: blur(12px); }
.nbt-faq-searchbox { display: flex; align-items: center; gap: 10px; padding: 0 14px; border: 1px solid var(--border-strong); border-radius: 999px; background: #fff; }
.nbt-faq-searchbox:focus-within { border-color: var(--blue); box-shadow: var(--focus); }
.nbt-faq-searchbox > i { color: #64748b; }
.nbt-faq-searchbox input { flex: 1; min-width: 0; height: 44px; border: 0 !important; background: transparent !important; box-shadow: none !important; font-size: 15px; outline: none; }
.nbt-faq-chips { display: flex; gap: 6px; margin-top: 8px; overflow-x: auto; scrollbar-width: none; }
.nbt-faq-chips::-webkit-scrollbar { display: none; }
.nbt-faq-chip { flex: 0 0 auto; padding: 5px 13px; border: 1px solid var(--border); border-radius: 999px; background: var(--surface-soft); color: var(--ink-soft) !important; font-size: 12px; font-weight: 700; text-decoration: none !important; white-space: nowrap; }
.nbt-faq-chip:hover { border-color: var(--blue); background: var(--blue-soft); color: var(--blue-ink) !important; }
.nbt-faq-cat { scroll-margin-top: 170px; margin-bottom: 18px; }
.nbt-faq-cat > h2 { margin: 0 0 10px; }
.nbt-faq-item { margin-bottom: 8px; border: 1px solid var(--line); background: var(--surface); box-shadow: 0 2px 8px rgba(30,64,175,.05); transition: box-shadow .15s ease, border-color .15s ease; }
.nbt-faq-item:hover { border-color: #b5cdf0; }
.nbt-faq-item[open] { border-color: var(--blue); box-shadow: 0 10px 24px rgba(30,64,175,.12); }
.nbt-faq-item > summary { font-weight: 700; }
.nbt-faq-a { line-height: 1.85; }

/* Staff / Users / Log cards */
.nbt-staff-card, .nbt-dir-card, .nbt-log-item { border-color: var(--line); box-shadow: 0 2px 8px rgba(30,64,175,.05); }
.nbt-staff-card { border-radius: 16px; transition: transform .15s ease, box-shadow .15s ease; }
.nbt-staff-card:hover { transform: translateY(-2px); box-shadow: var(--premium-shadow-lg); }
.nbt-dir-card { border-radius: 16px; } .nbt-dir-card:hover { box-shadow: var(--premium-shadow-lg); }
.nbt-staff-section-head { border-radius: 14px; }
.nbt-directory-filter { border-radius: 16px; box-shadow: var(--premium-shadow); }
.nbt-alpha { padding: 8px; border: 1px solid var(--line); border-radius: 14px; background: var(--surface); box-shadow: var(--premium-shadow); }
.nbt-alpha a { width: 34px; height: 34px; border-radius: 10px; }
.nbt-alpha a.is-active { background: var(--grad-brand); border-color: transparent; box-shadow: 0 5px 12px rgba(37,99,235,.3); }
.nbt-log-item { border-radius: 14px; } .nbt-log-search { padding: 14px 16px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--premium-shadow); }

@media (max-width: 760px) {
  .nbt-pg-hero, .nbt-pg-hero-dir { flex-wrap: wrap; padding: 18px 16px; border-radius: 16px; gap: 14px; }
  .nbt-pg-heroicon { flex-basis: 46px; width: 46px; height: 46px; font-size: 20px; }
  .nbt-faq-tools { top: 72px; }
  .nbt-rules-list li { padding-left: 36px; }
}

/* Browse thumbnails: poster fills the box; the category icon only shows when there is no poster */
.nbt-bw-thumb > img { position: absolute; inset: 0; width: 100% !important; height: 100% !important; max-width: none !important; object-fit: cover; }
.nbt-bw-thumb:has(> img) .nbt-bw-thumb-fallback { display: none; }

/* Browse: category icon column before the cover */
.nbt-bw-item { grid-template-columns: 46px 76px minmax(0, 1fr) auto auto; gap: 14px; }
.nbt-bw-caticon { display: grid; place-items: center; align-self: start; width: 46px; height: 46px; border: 1px solid var(--border); border-radius: 13px; background: linear-gradient(145deg, #f4f8ff, #e8f0fc); color: #7aa2d6; font-size: 20px; text-decoration: none !important; transition: border-color .15s ease, transform .15s ease; }
.nbt-bw-caticon:hover { border-color: var(--blue); transform: translateY(-1px); }
.nbt-bw-caticon img { width: 32px; height: 32px; max-width: none; object-fit: contain; }
.nbt-bw-thumb-fallback { display: none !important; }
.nbt-bw-thumb:not(:has(> img)) .nbt-bw-thumb-fallback { display: grid !important; }
@media (max-width: 860px) {
  .nbt-bw-item { grid-template-columns: 38px 64px minmax(0, 1fr) 44px; grid-template-areas: "icon thumb body dl" "stats stats stats stats"; gap: 10px; }
  .nbt-bw-caticon { grid-area: icon; width: 38px; height: 38px; border-radius: 11px; } .nbt-bw-caticon img { width: 26px; height: 26px; }
}

/* ===== Browse card layout v3 (definitive) ===== */
.nbt-bw-item { display: grid; grid-template-columns: 46px 80px minmax(0, 1fr) auto auto; grid-template-areas: "icon thumb tags stats dl" "icon thumb body stats dl"; column-gap: 14px; row-gap: 4px; align-items: center; padding: 14px 16px 14px 14px; }
.nbt-bw-caticon { grid-area: icon; align-self: start; }
.nbt-bw-thumb { grid-area: thumb; align-self: start; width: 80px; height: 108px; }
.nbt-bw-tags { grid-area: tags; align-self: end; margin: 0; }
.nbt-bw-body { grid-area: body; align-self: start; }
.nbt-bw-stats { grid-area: stats; }
.nbt-bw-dl { grid-area: dl; }
.nbt-bw-tags .nbt-bw-catlink { max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nbt-bw-title { margin-bottom: 4px; }

@media (max-width: 860px) {
  .nbt-bw-item { grid-template-columns: 76px minmax(0, 1fr) 44px; grid-template-areas: "icon tags dl" "thumb body body" "stats stats stats"; column-gap: 12px; row-gap: 10px; padding: 14px; align-items: start; }
  .nbt-bw-caticon { grid-area: icon; width: 42px; height: 42px; align-self: center; justify-self: start; }
  .nbt-bw-tags { grid-area: tags; align-self: center; flex-wrap: wrap; }
  .nbt-bw-dl { grid-area: dl; align-self: center; width: 44px; height: 44px; padding: 0; }
  .nbt-bw-thumb { grid-area: thumb; width: 76px; height: 104px; }
  .nbt-bw-body { grid-area: body; align-self: start; }
  .nbt-bw-stats { grid-area: stats; padding-top: 10px; border-top: 1px solid var(--border); }
  .nbt-bw-title { font-size: 16px; -webkit-line-clamp: 3; }
}

/* Browse: larger, nicer category icon */
.nbt-bw-caticon { width: 60px; height: 60px; border-radius: 18px; border: 1px solid #cfe0f7; background: linear-gradient(145deg, #ffffff 0%, #e3eefd 100%); box-shadow: 0 6px 14px rgba(30,64,175,.14), inset 0 1px 0 #fff; font-size: 26px; }
.nbt-bw-caticon img { width: 42px; height: 42px; filter: drop-shadow(0 2px 3px rgba(30,64,175,.2)); }
.nbt-bw-caticon:hover { box-shadow: 0 10px 20px rgba(30,64,175,.22), inset 0 1px 0 #fff; }
.nbt-bw-item { grid-template-columns: 60px 80px minmax(0, 1fr) auto auto; }
@media (max-width: 860px) {
  .nbt-bw-item { grid-template-columns: 76px minmax(0, 1fr) 44px; }
  .nbt-bw-caticon { width: 56px; height: 56px; border-radius: 17px; font-size: 24px; }
  .nbt-bw-caticon img { width: 38px; height: 38px; }
}

/* Browse: file name always on top */
.nbt-bw-item { grid-template-areas: "icon thumb title stats dl" "icon thumb tags stats dl" "icon thumb body stats dl"; grid-template-rows: auto auto 1fr; row-gap: 6px; }
.nbt-bw-title { grid-area: title; align-self: end; margin: 0; }
.nbt-bw-tags { align-self: center; }
.nbt-bw-body { align-self: start; }
@media (max-width: 860px) {
  .nbt-bw-item { grid-template-columns: 76px minmax(0, 1fr) 44px; grid-template-rows: auto auto auto auto; grid-template-areas: "icon title dl" "thumb tags tags" "thumb body body" "stats stats stats"; row-gap: 10px; }
  .nbt-bw-title { align-self: center; -webkit-line-clamp: 3; }
  .nbt-bw-caticon { align-self: start; }
  .nbt-bw-dl { align-self: start; }
  .nbt-bw-tags { align-self: start; }
  .nbt-bw-thumb { align-self: start; }
}

/* Browse mobile: compact, tidy card (no stretched gaps) */
@media (max-width: 860px) {
  .nbt-bw-item { grid-template-columns: 84px minmax(0, 1fr) 46px; grid-template-rows: auto auto minmax(0, 1fr) auto; grid-template-areas: "icon title dl" "thumb tags tags" "thumb body body" "stats stats stats"; column-gap: 12px; row-gap: 8px; padding: 14px; }
  .nbt-bw-caticon { width: 58px; height: 58px; align-self: center; }
  .nbt-bw-title { align-self: center; font-size: 17px; line-height: 1.35; -webkit-line-clamp: 3; }
  .nbt-bw-dl { align-self: center; width: 46px; height: 46px; }
  .nbt-bw-thumb { width: 84px; height: 116px; align-self: start; box-shadow: 0 6px 14px rgba(30,64,175,.2); }
  .nbt-bw-tags { align-self: start; gap: 5px; }
  .nbt-bw-body { align-self: start; margin-top: 0; }
  .nbt-bw-meta { flex-direction: column; gap: 5px; margin-top: 2px; font-size: 12.5px; }
  .nbt-bw-meta span, .nbt-bw-meta a { display: inline-flex; align-items: center; gap: 6px; }
  .nbt-bw-stats { margin-top: 2px; }
}

/* Browse mobile: category icon sits left of the cover, vertically centred */
@media (max-width: 860px) {
  .nbt-bw-item { grid-template-columns: 56px 84px minmax(0, 1fr) 46px; grid-template-rows: auto auto minmax(0, 1fr) auto; grid-template-areas: "title title title dl" "icon thumb tags tags" "icon thumb body body" "stats stats stats stats"; column-gap: 10px; }
  .nbt-bw-title { align-self: center; }
  .nbt-bw-caticon { width: 56px; height: 56px; align-self: center; justify-self: center; }
  .nbt-bw-caticon img { width: 38px; height: 38px; }
  .nbt-bw-dl { align-self: start; }
}

/* Browse mobile: file name centred */
@media (max-width: 860px) {
  .nbt-bw-title { text-align: center; justify-self: stretch; padding: 0 4px; }
}

/* Browse desktop: everything vertically centred in the card, like the download button */
@media (min-width: 861px) {
  .nbt-bw-item { grid-template-rows: 1fr auto auto auto 1fr; grid-template-areas: "icon thumb . stats dl" "icon thumb title stats dl" "icon thumb tags stats dl" "icon thumb body stats dl" "icon thumb . stats dl"; align-items: center; row-gap: 6px; }
  .nbt-bw-caticon, .nbt-bw-thumb, .nbt-bw-stats, .nbt-bw-dl { align-self: center; }
  .nbt-bw-title, .nbt-bw-tags, .nbt-bw-body { align-self: center; }
}

/* Upload: readable tips + poster preview hidden until a valid URL is typed */
.nbt-up-poster[hidden] { display: none !important; }
.nbt-up-tips .nbt-up-tipgroup { margin-bottom: 14px; }
.nbt-up-tips h4 { display: flex; align-items: center; gap: 8px; margin: 0 0 8px; color: var(--ink); font-size: 14px; font-weight: 800; }
.nbt-up-tips h4 i { color: var(--blue); font-size: 13px; }
.nbt-up-tips ul { display: flex; flex-direction: column; gap: 6px; margin: 0; padding: 0; list-style: none; }
.nbt-up-tips li { display: grid; grid-template-columns: 34px minmax(0, 1fr); align-items: start; gap: 10px; padding: 9px 11px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); color: var(--ink-soft); font-size: 13.5px; line-height: 1.65; }
.nbt-up-tips li > i { display: grid; place-items: center; width: 34px; height: 34px; margin: 0; border-radius: 10px; background: var(--blue-soft); color: var(--blue); font-size: 14px; }
.nbt-up-tips li > span { display: block; min-width: 0; padding-top: 5px; }
.nbt-up-tips li b { color: var(--ink); }
.nbt-up-tipwarn { display: grid; grid-template-columns: 34px minmax(0, 1fr); gap: 10px; align-items: start; padding: 11px; border: 1px solid #fcd34d; border-radius: 12px; background: #fffbeb; color: #78350f; font-size: 13.5px; line-height: 1.65; }
.nbt-up-tipwarn > i { display: grid; place-items: center; width: 34px; height: 34px; border-radius: 10px; background: #fef3c7; color: #d97706; }
.nbt-up-tipwarn > span { padding-top: 5px; }
.nbt-up-tipwarn a { font-weight: 700; text-decoration: underline; }

/* ===================== Requests + My torrents ===================== */
.nbt-rq-newbtn { margin-left: auto; background: #fff !important; color: var(--blue-ink) !important; box-shadow: 0 8px 18px rgba(0,0,0,.2) !important; }
.nbt-rq-tabs { display: inline-flex; flex-wrap: wrap; gap: 4px; margin-bottom: 14px; padding: 4px; border: 1px solid var(--line); border-radius: 999px; background: var(--surface); box-shadow: var(--premium-shadow); }
.nbt-rq-tabs a { display: inline-flex; align-items: center; gap: 7px; padding: 8px 16px; border-radius: 999px; color: var(--muted) !important; font-size: 13px; font-weight: 700; text-decoration: none !important; }
.nbt-rq-tabs a.is-active { background: var(--grad-brand); color: #fff !important; box-shadow: 0 6px 14px rgba(37,99,235,.3); }
.nbt-rq-search { display: flex; flex-wrap: wrap; align-items: center; gap: 8px; margin-bottom: 12px; padding: 10px; border: 1px solid var(--line); border-radius: 16px; background: var(--surface); box-shadow: var(--premium-shadow); }
.nbt-rq-search-inline { padding: 0; border: 0; box-shadow: none; background: none; margin: 0; }
.nbt-rq-searchbox { display: flex; flex: 1 1 240px; align-items: center; gap: 10px; min-width: 0; padding: 0 14px; border: 1px solid var(--border-strong); border-radius: 999px; background: #fff; }
.nbt-rq-searchbox:focus-within { border-color: var(--blue); box-shadow: var(--focus); }
.nbt-rq-searchbox > i { color: #64748b; }
.nbt-rq-searchbox input { flex: 1; min-width: 0; height: 42px; border: 0 !important; background: transparent !important; box-shadow: none !important; outline: none; }
.nbt-rq-search select { min-height: 42px; border-radius: 999px; }
.nbt-rq-search .btn { min-height: 42px; }
.nbt-rq-count { margin: 4px 2px 8px; color: var(--muted); font-size: 13px; }
.nbt-rq-list { display: flex; flex-direction: column; gap: 10px; }
.nbt-rq-card { position: relative; display: flex; align-items: center; gap: 14px; padding: 14px 16px; border: 1px solid var(--line); border-left: 5px solid #f59e0b; border-radius: 16px; background: var(--surface); box-shadow: 0 3px 12px rgba(30,64,175,.05); transition: transform .15s ease, box-shadow .15s ease; }
.nbt-rq-card.is-filled { border-left-color: #16a34a; }
.nbt-rq-card:hover { transform: translateY(-2px); box-shadow: var(--premium-shadow-lg); }
.nbt-rq-votes { display: flex; flex: 0 0 62px; flex-direction: column; align-items: center; gap: 1px; padding: 9px 4px; border-radius: 14px; background: var(--blue-soft); color: var(--blue-ink) !important; text-decoration: none !important; }
.nbt-rq-votes i { font-size: 14px; } .nbt-rq-votes b { font-size: 19px; line-height: 1.1; font-variant-numeric: tabular-nums; } .nbt-rq-votes small { font-size: 10px; }
.nbt-rq-main { min-width: 0; flex: 1; }
.nbt-rq-title { display: block; color: var(--ink) !important; font-size: 16px; font-weight: 800; line-height: 1.4; text-decoration: none !important; overflow-wrap: anywhere; }
.nbt-rq-title:hover { color: var(--blue) !important; }
.nbt-rq-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; margin: 6px 0; }
.nbt-rq-badge { display: inline-flex; align-items: center; gap: 5px; padding: 2px 10px; border-radius: 999px; font-size: 11px; font-weight: 800; text-decoration: none !important; }
.nbt-rq-badge.is-done { background: #dcfce7; color: #166534 !important; } .nbt-rq-badge.is-open { background: #fef3c7; color: #92400e !important; }
.nbt-rq-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; color: var(--muted); font-size: 12px; }
.nbt-rq-meta i { margin-right: 4px; color: #8aa0bd; font-size: 11px; }
.nbt-rq-meta a { color: var(--ink-soft); }
.nbt-rq-del { flex: 0 0 auto; cursor: pointer; }
.nbt-rq-del input { position: absolute; opacity: 0; }
.nbt-rq-del span { display: grid; place-items: center; width: 38px; height: 38px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface-soft); color: var(--muted); }
.nbt-rq-del input:checked + span { border-color: #dc2626; background: #fee2e2; color: #dc2626; }
.nbt-req-delete { margin: 14px 0; text-align: right; }
.nbt-rq-steps { display: flex; flex-direction: column; gap: 16px; max-width: 820px; margin: 0 auto; }
.nbt-rq-formbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding-top: 12px; border-top: 1px solid var(--border); color: var(--muted); font-size: 13px; }
.nbt-rq-formbar .btn { min-height: 44px; padding: 8px 24px; }
.nbt-mt-stats { margin-bottom: 14px; }
.nbt-bw-acts { grid-area: dl; display: flex; flex-direction: column; gap: 8px; }
.nbt-bw-acts .nbt-bw-dl { grid-area: auto; height: 38px; padding: 0 16px; font-size: 12px; }
.nbt-bw-dl-ghost { background: var(--surface) !important; color: var(--blue-ink) !important; border: 1px solid var(--border-strong); box-shadow: none !important; }
@media (max-width: 860px) {
  .nbt-bw-acts { flex-direction: row; justify-self: end; align-self: start; }
  .nbt-bw-acts .nbt-bw-dl { width: 42px; height: 42px; padding: 0; } .nbt-bw-acts .nbt-bw-dl span { display: none; }
}
@media (max-width: 700px) {
  .nbt-rq-card { align-items: flex-start; padding: 12px; gap: 10px; }
  .nbt-rq-votes { flex-basis: 54px; }
  .nbt-rq-tabs { display: flex; } .nbt-rq-tabs a { flex: 1 1 auto; justify-content: center; padding: 8px 6px; font-size: 12px; }
  .nbt-rq-newbtn { margin-left: 0; width: 100%; justify-content: center; }
  .nbt-rq-formbar { flex-direction: column; align-items: stretch; } .nbt-rq-formbar .btn { width: 100%; justify-content: center; }
}

/* White hero buttons: need higher specificity than the global a.btn { color:#fff !important } */
a.btn.nbt-rq-newbtn, a.btn.nbt-fm-newbtn { background: #fff !important; color: var(--blue-ink) !important; border: 0 !important; box-shadow: 0 8px 18px rgba(0,0,0,.2) !important; }
a.btn.nbt-rq-newbtn:hover, a.btn.nbt-fm-newbtn:hover { background: #eaf2ff !important; color: var(--blue-ink) !important; }

/* Request delete selection (staff) — visible checkboxes */
.nbt-rq-del { display: inline-flex; align-items: center; gap: 8px; align-self: center; padding: 8px 12px; border: 1px solid var(--border-strong); border-radius: 12px; background: var(--surface-soft); color: var(--ink-soft); font-size: 12px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.nbt-rq-del input { position: static !important; opacity: 1 !important; width: 20px; height: 20px; margin: 0; accent-color: #dc2626; cursor: pointer; }
.nbt-rq-del span { display: inline !important; width: auto !important; height: auto !important; border: 0 !important; background: none !important; color: inherit !important; }
.nbt-rq-del:has(input:checked) { border-color: #dc2626; background: #fee2e2; color: #b91c1c; }
.nbt-rq-card.is-selected { border-color: #fca5a5; background: linear-gradient(90deg, #fff5f5, #fff 55%); }
.nbt-rq-bulkbar { position: sticky; top: 76px; z-index: 5; display: flex; flex-wrap: wrap; align-items: center; gap: 10px 14px; margin-bottom: 12px; padding: 10px 14px; border: 1px solid #fecaca; border-radius: 14px; background: rgba(255,247,247,.97); box-shadow: var(--premium-shadow); }
.nbt-rq-selcount { flex: 1; color: var(--ink-soft); font-size: 13px; font-weight: 700; }
.nbt-rq-bulkbar .btn { min-height: 40px; }
.nbt-rq-bulkbar .btn:disabled { opacity: .45; cursor: not-allowed; }
@media (max-width: 700px) { .nbt-rq-card { flex-wrap: wrap; } .nbt-rq-del { width: 100%; justify-content: center; } .nbt-rq-bulkbar { top: 64px; } }

/* ===================== Market pages: bank / transfer / bonus ===================== */
.nbt-bank-hero { grid-template-columns: repeat(auto-fit, minmax(200px, 1fr)); gap: 14px; padding: 0; border: 0; background: none; box-shadow: none; }
.nbt-bank-hero > .nbt-bank-stat, .nbt-bank-hero > .nbt-bank-rate { padding: 16px 18px; border: 1px solid var(--line); border-radius: 16px; background: linear-gradient(145deg, #fff 55%, var(--blue-soft)); box-shadow: var(--premium-shadow); }
.nbt-bank-stat-label { font-weight: 700; }
.nbt-bank-stat-value { font-size: 26px; font-weight: 800; letter-spacing: -.02em; font-variant-numeric: tabular-nums; }
.nbt-bank-rate { display: flex; align-items: center; background: linear-gradient(145deg, #fffbeb, #fff) !important; border-color: #fcd34d !important; color: #78350f; font-size: 14px; }
.nbt-bank .nbt-panel { border-radius: 16px; }
.nbt-exchange-row { gap: 10px; }
.nbt-exchange-row input { flex: 1; min-width: 0; min-height: 48px; padding: 0 16px; border-radius: 12px; font-size: 18px; font-weight: 700; }
.nbt-exchange-row button { min-height: 48px; padding: 0 24px; border: 0; border-radius: 999px; background: var(--grad-brand); color: #fff; font-weight: 800; cursor: pointer; box-shadow: 0 6px 14px rgba(37,99,235,.3); }
.nbt-exchange-preview { min-height: 22px; margin: 10px 2px 0; color: var(--ink-soft); font-size: 13px; }
.nbt-exchange-preview b { color: var(--blue-ink); }
.nbt-bank-list { display: flex; flex-direction: column; gap: 8px; margin: 0; padding: 0; list-style: none; }
.nbt-bank-list li { position: relative; padding: 9px 12px 9px 34px; border: 1px solid var(--border); border-radius: 11px; background: var(--surface-soft); font-size: 13.5px; line-height: 1.65; }
.nbt-bank-list li::before { content: "✓"; position: absolute; left: 11px; top: 9px; color: #16a34a; font-weight: 800; }

/* Seed bonus: reward cards in a grid */
.nbt-bonus { display: grid; grid-template-columns: repeat(auto-fill, minmax(320px, 1fr)); gap: 14px; }
.nbt-bonus > .nbt-bank-hero, .nbt-bonus > .nbt-bank-note { grid-column: 1 / -1; }
.nbt-bonus .nbt-bonus-item { display: flex; flex-direction: column; margin: 0 !important; transition: transform .15s ease, box-shadow .15s ease; }
.nbt-bonus .nbt-bonus-item:hover { transform: translateY(-3px); box-shadow: var(--premium-shadow-lg); }
.nbt-bonus .nbt-bonus-item.is-locked { opacity: .65; filter: grayscale(.4); }
.nbt-bonus-desc { flex: 1; margin: 0 0 12px; color: var(--ink-soft); font-size: 13.5px; line-height: 1.7; }
.nbt-bonus-foot { display: flex; align-items: center; justify-content: space-between; gap: 10px; margin-top: 12px; padding-top: 12px; border-top: 1px solid var(--border); }
.nbt-bonus-foot .btn { min-height: 42px; padding: 6px 22px; }
.nbt-bonus-locked { padding: 6px 14px; border-radius: 999px; background: #f1f5f9; color: var(--muted); font-size: 12px; font-weight: 700; }
@media (max-width: 760px) { .nbt-bonus { grid-template-columns: minmax(0, 1fr); } .nbt-bank-stat-value { font-size: 22px; } .nbt-exchange-row { flex-wrap: wrap; } .nbt-exchange-row button { width: 100%; } }

/* Bookmarks */
.nbt-inline-form-btn { display: inline-flex; margin: 0; }
.nbt-detail-hero .nbt-detail-actions button.nbt-bm-btn, button.btn.btn-ghost.nbt-bm-btn { border-radius: 999px; min-height: 40px; padding: 8px 16px; font-size: 13px; cursor: pointer; }
.nbt-detail-hero .nbt-detail-actions button.btn.nbt-bm-btn { border: 1px solid rgba(255,255,255,.4) !important; background: rgba(255,255,255,.14) !important; color: #fff !important; backdrop-filter: blur(6px); }
.nbt-detail-hero .nbt-detail-actions button.btn.nbt-bm-btn.is-on { background: #fbbf24 !important; border-color: #fbbf24 !important; color: #422006 !important; }
.nbt-bw-unmark { display: contents; }
.nbt-bw-acts button.nbt-bw-dl { cursor: pointer; font: inherit; }

/* Personal pages polish */
.nbt-inbox .nbt-request-actions, .nbt-inbox .nbt-toptabs { margin-bottom: 14px; }
.nbt-msg { border: 1px solid var(--line); border-radius: 16px; box-shadow: 0 2px 8px rgba(30,64,175,.05); }
.nbt-msg-head { border-radius: 16px 16px 0 0; }
.nbt-profile-hero { border-radius: 20px; box-shadow: var(--premium-shadow-lg); }
.nbt-profile-head, .nbt-group-hero { border-radius: 20px; }
.nbt-group-hero { box-shadow: var(--premium-shadow-lg); overflow: hidden; }
.nbt-toptabs { margin-bottom: 14px; }
@media (max-width: 760px) { .nbt-inbox .nbt-pg-hero .btn { width: 100%; justify-content: center; } }

/* Header dropdown: text hugs the icon on the left (wrapper centres text by default) */
.nbt-hd-menu a, .nbt-hd-menu a > span { text-align: left; }
.nbt-hd-menu a { justify-content: flex-start; }
.nbt-hd-menu a > span { flex: 1; }

/* ===================== Pets v2: header, mood, quests, arena board ===================== */
/* All pet pages share the blue hero header */
.nbt-pet-page-head { position: relative; isolation: isolate; overflow: hidden; display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 16px; padding: 24px 28px !important; border: 0 !important; border-radius: 20px !important; background: radial-gradient(circle at 94% 0%, rgba(251,191,36,.35), transparent 40%), linear-gradient(120deg, #0b2547 0%, #12406f 58%, #1d65a6 100%) !important; color: #fff; box-shadow: 0 14px 34px rgba(11,37,71,.2) !important; }
.nbt-pet-page-head .nbt-pet-eyebrow { color: #fcd34d !important; font-size: 10px; font-weight: 800; letter-spacing: .18em; }
.nbt-pet-page-head h1 { all: unset; display: block; margin: 4px 0 3px; color: #fff; font-size: clamp(22px, 3.6vw, 30px); font-weight: 800; letter-spacing: -.02em; }
.nbt-pet-page-head p:not(.nbt-pet-eyebrow) { margin: 0; color: rgba(235,245,255,.85) !important; font-size: 14px; }
.nbt-pet-page-head .nbt-pet-wallet { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 10px 16px; border: 1px solid rgba(255,255,255,.22); border-radius: 14px; background: rgba(255,255,255,.12); color: #fff; backdrop-filter: blur(8px); }
.nbt-pet-page-head .nbt-pet-wallet span { width: 100%; color: rgba(235,245,255,.75); font-size: 11px; }
.nbt-pet-page-head .nbt-pet-wallet strong { color: #fff; font-size: 15px; }
.nbt-pet-page-head a.btn.btn-ghost { border: 1px solid rgba(255,255,255,.4) !important; background: rgba(255,255,255,.14) !important; color: #fff !important; }

/* Pet spotlight: speech bubble + idle animation */
.nbt-pet-spotlight-image { position: relative; }
.nbt-pet-bubble { position: absolute; z-index: 3; top: -6px; left: 50%; max-width: 92%; padding: 8px 14px; border: 2px solid #bcd3ff; border-radius: 16px; background: #fff; color: var(--ink); font-size: 13px; font-weight: 700; line-height: 1.4; text-align: center; box-shadow: 0 8px 20px rgba(30,64,175,.18); transform: translate(-50%, -100%); animation: nbt-bubble-in .5s ease both; }
.nbt-pet-bubble::after { position: absolute; left: 50%; bottom: -9px; width: 14px; height: 14px; border-right: 2px solid #bcd3ff; border-bottom: 2px solid #bcd3ff; background: #fff; transform: translateX(-50%) rotate(45deg); content: ""; }
.nbt-pet-bubble.is-hungry, .nbt-pet-bubble.is-dirty, .nbt-pet-bubble.is-sick { border-color: #fcd34d; background: #fffbeb; } .nbt-pet-bubble.is-hungry::after, .nbt-pet-bubble.is-dirty::after, .nbt-pet-bubble.is-sick::after { border-color: #fcd34d; background: #fffbeb; }
.nbt-pet-bob { animation: nbt-bob 2.6s ease-in-out infinite; transform-origin: 50% 100%; }
.nbt-pet-bob.is-happy { animation-duration: 1.4s; }
.nbt-pet-bob.is-hungry, .nbt-pet-bob.is-sick { animation-duration: 4s; filter: saturate(.75); }
@keyframes nbt-bob { 0%, 100% { transform: translateY(0) scale(1); } 50% { transform: translateY(-6px) scale(1.02); } }
@keyframes nbt-bubble-in { from { opacity: 0; transform: translate(-50%, -85%) scale(.9); } to { opacity: 1; transform: translate(-50%, -100%) scale(1); } }
.nbt-pet-spotlight { padding-top: 54px; }
.nbt-pet-rank { display: inline-block; margin-left: 6px; padding: 2px 10px; border-radius: 999px; background: linear-gradient(135deg, #fef3c7, #fde68a); color: #92400e; font-size: 12px; font-weight: 800; vertical-align: middle; }

/* Daily quests */
.nbt-quest-progress { margin: 0 0 14px; padding: 12px 14px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-soft); }
.nbt-quest-progress > div { display: flex; justify-content: space-between; margin-bottom: 6px; color: var(--ink-soft); font-size: 13px; font-weight: 700; }
.nbt-quest-progress b { color: var(--blue-ink); }
.nbt-pet-meter i.exp { background: linear-gradient(90deg, #8b5cf6, #3b82f6); }
.nbt-pet-quest { transition: transform .15s ease, box-shadow .15s ease; }
.nbt-pet-quest:hover { transform: translateY(-1px); }
.nbt-pet-quest-bonus { border: 1px dashed #fcd34d; background: #fffdf3; }
.nbt-pet-quest-bonus.is-ready { border-style: solid; background: linear-gradient(135deg, #fffbeb, #fef3c7); box-shadow: 0 8px 22px rgba(245,158,11,.28); animation: nbt-pop 1.6s ease-in-out infinite; }

/* Arena hall of fame */
.nbt-arena-board { margin-top: 16px; }
.nbt-arena-boardrow { display: flex; align-items: center; gap: 12px; padding: 9px 4px; border-bottom: 1px solid var(--border); }
.nbt-arena-boardrow:last-child { border-bottom: 0; }
.nbt-arena-rank { flex: 0 0 34px; text-align: center; font-size: 22px; font-weight: 800; color: var(--muted); }
.nbt-arena-boardrow img { flex: 0 0 44px; width: 44px; height: 44px; object-fit: cover; border-radius: 12px; box-shadow: 0 3px 8px rgba(30,64,175,.18); }
.nbt-arena-boardname { display: flex; flex: 1; min-width: 0; flex-direction: column; }
.nbt-arena-boardname small { color: var(--muted); font-size: 12px; }
.nbt-arena-boardwins { font-weight: 800; color: #b45309; white-space: nowrap; }
.nbt-arena-boardwins small { color: var(--muted); font-weight: 500; }

@media (max-width: 760px) {
  .nbt-pet-page-head { padding: 18px 16px !important; border-radius: 16px !important; }
  .nbt-pet-bubble { font-size: 12px; max-width: 86%; }
  .nbt-pet-spotlight { padding-top: 50px; }
}
@media (prefers-reduced-motion: reduce) { .nbt-pet-bob, .nbt-pet-bubble, .nbt-pet-quest-bonus.is-ready { animation: none !important; } }

/* Mobile: stacked form rows must not keep their 200px "flex-basis" (it became a 200px HEIGHT in column direction) */
@media (max-width: 760px) {
  .nbt-form-row { flex-direction: column; gap: 0; }
  .nbt-form-row .nbt-form-field, .nbt-bank .nbt-form-row .nbt-form-field { flex: 0 0 auto; width: 100%; }
  .nbt-directory-filter .nbt-directory-field, .nbt-ban-form .nbt-directory-field { flex: 0 0 auto; width: 100%; }
}

/* ===================== Staff panel + uploader panel ===================== */
.nbt-sp-stats { margin-bottom: 18px; }
a.nbt-stat-card { color: inherit !important; text-decoration: none !important; }
.nbt-sp-section { margin-bottom: 18px; }
.nbt-sp-head { display: flex; flex-wrap: wrap; align-items: center; gap: 12px; margin-bottom: 12px; }
.nbt-sp-head h2 { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; font-size: 18px; font-weight: 800; }
.nbt-sp-icon { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: var(--sp, var(--blue)); color: #fff; font-size: 17px; box-shadow: 0 6px 14px color-mix(in srgb, var(--sp, var(--blue)) 35%, transparent); }
.nbt-sp-red { --sp: #dc2626; } .nbt-sp-purple { --sp: #7c3aed; } .nbt-sp-blue { --sp: #2563eb; }
.nbt-sp-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(240px, 1fr)); gap: 12px; }
.nbt-sp-tile { position: relative; display: flex; align-items: stretch; border: 1px solid var(--line); border-left: 5px solid var(--sp, var(--blue)); border-radius: 14px; background: var(--surface); box-shadow: 0 2px 8px rgba(30,64,175,.05); transition: transform .15s ease, box-shadow .15s ease; }
.nbt-sp-tile:hover { transform: translateY(-2px); box-shadow: var(--premium-shadow-lg); }
.nbt-sp-tilemain { display: flex; flex: 1; min-width: 0; flex-direction: column; justify-content: center; gap: 2px; padding: 13px 14px; color: var(--ink) !important; text-decoration: none !important; }
.nbt-sp-tilemain b { font-size: 15px; } .nbt-sp-tilemain small { color: var(--muted); font-size: 12px; line-height: 1.5; }
.nbt-sp-tilemenu { display: flex; flex-direction: column; justify-content: center; gap: 4px; padding: 6px; }
.nbt-sp-tilemenu a, .nbt-sp-tilemenu button { display: grid; place-items: center; width: 30px; height: 30px; border: 1px solid var(--border); border-radius: 9px; background: var(--surface-soft); color: var(--muted) !important; font-size: 12px; cursor: pointer; }
.nbt-sp-tilemenu form { margin: 0; display: contents; }
.nbt-sp-tilemenu a:hover { border-color: var(--blue); color: var(--blue) !important; } .nbt-sp-tilemenu button:hover { border-color: #dc2626; background: #fee2e2; color: #dc2626 !important; }
.nbt-sp-add > summary { list-style: none; cursor: pointer; margin-bottom: 0; } .nbt-sp-add > summary::-webkit-details-marker { display: none; }
.nbt-sp-add[open] > summary { margin-bottom: 14px; }
.nbt-sp-add { margin-bottom: 18px; }
.nbt-sp-gauges { display: grid; grid-template-columns: repeat(auto-fit, minmax(260px, 1fr)); gap: 14px; }
.nbt-sp-gauge { padding: 14px 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-soft); }
.nbt-sp-gauge-top { display: flex; justify-content: space-between; margin-bottom: 8px; font-weight: 700; color: var(--ink-soft); } .nbt-sp-gauge-top b { font-size: 20px; color: var(--ink); }
.nbt-sp-gauge .nbt-pet-meter i { background: #16a34a; } .nbt-sp-gauge.is-warn .nbt-pet-meter i { background: #f59e0b; } .nbt-sp-gauge.is-bad .nbt-pet-meter i { background: #dc2626; }
.nbt-sp-gauge small { display: block; margin-top: 8px; color: var(--muted); font-size: 12px; }
.nbt-up-stale { color: #b45309; font-weight: 700; }
@media (max-width: 760px) { .nbt-sp-grid { grid-template-columns: minmax(0, 1fr); } }

/* ===================== Announcements ===================== */
.nbt-ann-bar { display: flex; align-items: center; gap: 14px; margin: 0 0 16px; padding: 12px 16px; border: 1px solid #fcd34d; border-radius: 16px; background: linear-gradient(120deg, #fffbeb, #fef3c7); color: #78350f !important; text-decoration: none !important; box-shadow: 0 8px 22px rgba(245,158,11,.22); animation: nbt-ann-in .5s ease both; }
.nbt-ann-bar:hover { box-shadow: 0 12px 28px rgba(245,158,11,.34); }
.nbt-ann-bar-icon { display: grid; flex: 0 0 40px; place-items: center; width: 40px; height: 40px; border-radius: 12px; background: #f59e0b; color: #fff; font-size: 17px; animation: nbt-ring 2.4s ease-in-out infinite; transform-origin: 50% 20%; }
.nbt-ann-bar-text { display: flex; flex: 1; min-width: 0; flex-direction: column; gap: 1px; }
.nbt-ann-bar-text b { font-size: 13px; } .nbt-ann-bar-text > span { overflow: hidden; color: #92400e; font-size: 14px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.nbt-ann-bar-cta { flex: 0 0 auto; padding: 7px 16px; border-radius: 999px; background: #f59e0b; color: #fff; font-size: 13px; font-weight: 800; white-space: nowrap; }
@keyframes nbt-ann-in { from { opacity: 0; transform: translateY(-8px); } to { opacity: 1; transform: none; } }
@keyframes nbt-ring { 0%, 70%, 100% { transform: rotate(0); } 75% { transform: rotate(14deg); } 80% { transform: rotate(-12deg); } 85% { transform: rotate(8deg); } 90% { transform: rotate(-6deg); } }
.nbt-ann-tools { display: flex; flex-wrap: wrap; gap: 8px; margin-left: auto; }
.nbt-ann-tools form { margin: 0; }
button.btn.nbt-ann-hbtn { border: 1px solid rgba(255,255,255,.4) !important; background: rgba(255,255,255,.14) !important; color: #fff !important; box-shadow: none !important; }
.nbt-ann-form { margin-bottom: 18px; }
.nbt-ann-formbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; padding-top: 12px; border-top: 1px solid var(--border); color: var(--muted); font-size: 13px; }
.nbt-ann-formbar .btn { min-height: 44px; padding: 8px 24px; }
.nbt-ann-list { display: flex; flex-direction: column; gap: 14px; }
.nbt-ann-card { border: 1px solid var(--line); border-left: 5px solid var(--blue); border-radius: 18px; background: var(--surface); box-shadow: var(--premium-shadow); overflow: hidden; }
.nbt-ann-card.is-latest { border-left-color: #f59e0b; box-shadow: 0 10px 28px rgba(245,158,11,.18); }
.nbt-ann-head { padding: 16px 20px 10px; border-bottom: 1px solid var(--border); background: linear-gradient(180deg, #f8fbff, #fff); }
.nbt-ann-titlewrap { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 10px; }
.nbt-ann-head h2 { margin: 0; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; font-size: 19px; font-weight: 800; letter-spacing: -.01em; text-align: left; overflow-wrap: anywhere; }
.nbt-ann-badge { padding: 2px 11px; border-radius: 999px; background: #f59e0b; color: #fff; font-size: 11px; font-weight: 800; }
.nbt-ann-meta { display: flex; flex-wrap: wrap; gap: 4px 16px; margin-top: 6px; color: var(--muted); font-size: 12px; }
.nbt-ann-meta i { margin-right: 4px; color: #8aa0bd; }
.nbt-ann-body { padding: 16px 20px; color: var(--ink-soft); font-size: 14px; line-height: 1.85; overflow-wrap: anywhere; }
.nbt-ann-actions { display: flex; flex-wrap: wrap; gap: 8px; padding: 10px 20px 14px; border-top: 1px dashed var(--border); }
.nbt-ann-actions form { margin: 0; }
@media (max-width: 700px) { .nbt-ann-bar { flex-wrap: wrap; padding: 12px; } .nbt-ann-bar-cta { width: 100%; text-align: center; } .nbt-ann-tools { margin-left: 0; width: 100%; } .nbt-ann-tools .btn { flex: 1; justify-content: center; } .nbt-ann-head, .nbt-ann-body { padding-left: 14px; padding-right: 14px; } }
@media (prefers-reduced-motion: reduce) { .nbt-ann-bar, .nbt-ann-bar-icon { animation: none; } }

/* Latest announcement card on the home page (always visible, independent of the unread flag) */
.nbt-ann-home { display: flex; align-items: center; gap: 14px; padding: 14px 18px; border: 1px solid #fcd34d; border-left: 6px solid #f59e0b; border-radius: 16px; background: linear-gradient(120deg, #fffbeb, #fff 70%); color: var(--ink) !important; text-decoration: none !important; box-shadow: 0 6px 18px rgba(245,158,11,.14); transition: transform .15s ease, box-shadow .15s ease; }
.nbt-ann-home:hover { transform: translateY(-2px); box-shadow: 0 12px 26px rgba(245,158,11,.26); }
.nbt-ann-home .nbt-ann-bar-text b { color: #92400e; font-size: 12px; }
.nbt-ann-home .nbt-ann-bar-text > span { color: var(--ink); font-size: 16px; white-space: normal; }
.nbt-ann-home .nbt-ann-bar-text em { color: var(--muted); font-size: 13px; font-style: normal; line-height: 1.6; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }
@media (max-width: 700px) { .nbt-ann-home { flex-wrap: wrap; } .nbt-ann-home .nbt-ann-bar-cta { width: 100%; text-align: center; } }

/* Warned / IP check / Bans */
.nbt-wn-check { display: inline-flex; align-items: center; gap: 7px; padding: 6px 11px; border: 1px solid var(--border-strong); border-radius: 10px; background: var(--surface-soft); font-size: 12px; font-weight: 700; cursor: pointer; white-space: nowrap; }
.nbt-wn-check input { width: 18px; height: 18px; margin: 0; }
.nbt-wn-check.is-ok input { accent-color: #16a34a; } .nbt-wn-check.is-bad input { accent-color: #dc2626; }
.nbt-wn-check:has(input:checked).is-ok { border-color: #16a34a; background: #dcfce7; color: #166534; }
.nbt-wn-check:has(input:checked).is-bad { border-color: #dc2626; background: #fee2e2; color: #b91c1c; }
.nbt-ipc-group { margin-bottom: 16px; padding: 14px 16px; border: 1px solid var(--line); border-left: 5px solid #f59e0b; border-radius: 16px; background: var(--surface); box-shadow: var(--premium-shadow); }
.nbt-ipc-head { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 8px; margin-bottom: 10px; }
.nbt-ipc-ip { font-size: 17px; font-weight: 800; font-variant-numeric: tabular-nums; } .nbt-ipc-ip i { color: #f59e0b; margin-right: 6px; }
.nbt-bans-layout { display: grid; grid-template-columns: minmax(0, 1.5fr) minmax(280px, 1fr); gap: 16px; align-items: start; }
.nbt-bans-layout .nbt-ban-list { display: flex; flex-direction: column; gap: 8px; }
.nbt-bans-layout .nbt-ban-item { display: flex; flex-wrap: wrap; align-items: center; gap: 8px 14px; padding: 11px 14px; border: 1px solid var(--border); border-left: 4px solid #dc2626; border-radius: 12px; background: var(--surface-soft); }
.nbt-bans-layout .nbt-ban-range { display: flex; flex-direction: column; min-width: 150px; font-variant-numeric: tabular-nums; } .nbt-bans-layout .nbt-ban-range span { color: var(--muted); font-size: 12px; }
.nbt-bans-layout .nbt-ban-info { flex: 1 1 200px; min-width: 0; } .nbt-bans-layout .nbt-ban-info p { margin: 0; font-size: 13.5px; overflow-wrap: anywhere; } .nbt-bans-layout .nbt-ban-info small { color: var(--muted); }
.nbt-bans-layout .nbt-ban-item form { margin: 0; }
@media (max-width: 860px) { .nbt-bans-layout { grid-template-columns: minmax(0, 1fr); } .nbt-bans-add { order: -1; } }
.nbt-ann-back { margin: 0 0 12px; }

/* Home announcement: static random card with full text, no "read more" */
section.nbt-ann-home { align-items: flex-start; cursor: default; }
section.nbt-ann-home:hover { transform: none; box-shadow: 0 6px 18px rgba(245,158,11,.14); }
.nbt-ann-home-main { min-width: 0; flex: 1; }
.nbt-ann-home-label { display: block; color: #92400e; font-size: 12px; }
.nbt-ann-home h2 { margin: 2px 0 6px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--ink); font-size: 18px; font-weight: 800; text-align: left; overflow-wrap: anywhere; }
.nbt-ann-home-body { color: var(--ink-soft); font-size: 14px; line-height: 1.8; overflow-wrap: anywhere; }

/* ===================== Styled dialogs (nbt-dialog.js) ===================== */
.nbt-dlg { position: fixed; inset: 0; z-index: 10000; display: grid; place-items: center; padding: 20px; background: rgba(8,24,52,.5); backdrop-filter: blur(4px); opacity: 0; transition: opacity .16s ease; }
.nbt-dlg[hidden] { display: none; }
.nbt-dlg.is-open { opacity: 1; }
.nbt-dlg-card { width: min(100%, 400px); padding: 26px 24px 20px; border-radius: 22px; background: #fff; box-shadow: 0 30px 70px rgba(8,24,52,.35); text-align: center; transform: translateY(10px) scale(.96); transition: transform .18s cubic-bezier(.2,.9,.3,1.2); }
.nbt-dlg.is-open .nbt-dlg-card { transform: none; }
.nbt-dlg-icon { display: grid; place-items: center; width: 62px; height: 62px; margin: 0 auto 12px; border-radius: 50%; background: var(--blue-soft); color: var(--blue); font-size: 26px; box-shadow: 0 0 0 7px rgba(37,99,235,.08); }
.nbt-dlg-card.is-danger .nbt-dlg-icon { background: #fef3c7; color: #d97706; box-shadow: 0 0 0 7px rgba(245,158,11,.12); }
.nbt-dlg-title { margin: 0 0 6px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; color: var(--ink); font-size: 19px; font-weight: 800; text-align: center; }
.nbt-dlg-msg { margin: 0 0 18px; color: var(--ink-soft); font-size: 15px; line-height: 1.7; overflow-wrap: anywhere; white-space: pre-line; }
.nbt-dlg-input { width: 100%; margin: 0 0 18px; min-height: 46px; padding: 0 14px; border: 1px solid var(--border-strong); border-radius: 12px; font-size: 15px; }
.nbt-dlg-input[hidden] { display: none; }
.nbt-dlg-actions { display: flex; gap: 10px; }
.nbt-dlg-btn { flex: 1; min-height: 46px; padding: 0 16px; border: 1px solid var(--border-strong); border-radius: 999px; background: #fff; color: var(--ink-soft); font: inherit; font-size: 15px; font-weight: 800; cursor: pointer; transition: transform .12s ease, box-shadow .12s ease, filter .12s ease; }
.nbt-dlg-btn:hover { transform: translateY(-1px); }
.nbt-dlg-btn:focus-visible { outline: 3px solid rgba(37,99,235,.35); outline-offset: 2px; }
.nbt-dlg-ok { border: 0; background: var(--grad-brand); color: #fff; box-shadow: 0 8px 18px rgba(37,99,235,.32); }
.nbt-dlg-card.is-danger .nbt-dlg-ok { background: linear-gradient(135deg, #f87171, #dc2626); box-shadow: 0 8px 18px rgba(220,38,38,.32); }
html.nbt-dlg-lock { overflow: hidden; }
@media (max-width: 480px) { .nbt-dlg { place-items: end center; padding: 12px; } .nbt-dlg-card { border-radius: 22px 22px 18px 18px; } }
@media (prefers-reduced-motion: reduce) { .nbt-dlg, .nbt-dlg-card { transition: none; } }

/* Delete account / mass mail / categories */
.nbt-del-user { padding: 14px 16px; margin-bottom: 12px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-soft); }
.nbt-del-name { font-size: 20px; font-weight: 800; text-decoration: none !important; }
.nbt-del-user ul { margin: 10px 0 0; padding: 0; list-style: none; display: grid; gap: 6px; }
.nbt-del-user li { display: flex; justify-content: space-between; gap: 12px; padding: 6px 0; border-bottom: 1px dashed var(--border); font-size: 13.5px; } .nbt-del-user li:last-child { border-bottom: 0; }
.nbt-del-user li span { color: var(--muted); }
.nbt-mm-target { display: flex; flex-wrap: wrap; gap: 8px; } .nbt-mm-target select { flex: 1 1 160px; min-height: 44px; border-radius: 12px; }
.nbt-cat-layout { display: grid; grid-template-columns: minmax(0, 1.6fr) minmax(300px, 1fr); gap: 16px; align-items: start; }
.nbt-cat-ico { width: 40px; height: 40px; object-fit: contain; border: 1px solid var(--border); border-radius: 11px; background: #fff; padding: 3px; }
.nbt-cat-picker { display: grid; grid-template-columns: repeat(auto-fill, minmax(48px, 1fr)); gap: 6px; max-height: 220px; overflow: auto; padding: 8px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.nbt-cat-pick { display: grid; place-items: center; aspect-ratio: 1; padding: 3px; border: 2px solid transparent; border-radius: 10px; background: #fff; cursor: pointer; }
.nbt-cat-pick img { max-width: 100%; max-height: 100%; object-fit: contain; }
.nbt-cat-pick:hover { border-color: var(--blue); } .nbt-cat-pick.is-on { border-color: var(--blue); background: var(--blue-soft); box-shadow: 0 4px 10px rgba(37,99,235,.2); }
.nbt-btn-danger:disabled { opacity: .4; cursor: not-allowed; }
@media (max-width: 860px) { .nbt-cat-layout { grid-template-columns: minmax(0, 1fr); } .nbt-cat-form { order: -1; } }

/* footer: brand centered, no link row */
.nbt-ft .nbt-ft-top{justify-content:center;text-align:center}
.nbt-ft .nbt-ft-brand{display:flex;flex-direction:column;align-items:center;gap:4px;text-align:center}
.nbt-ft .nbt-ft-bottom{justify-content:center;text-align:center;gap:6px 18px;flex-wrap:wrap}
.nbt-ft .nbt-ft-copy{opacity:.7;font-size:.85em;margin-top:2px}

/* ===== solo casino games: dice / slots / hi-lo ===== */
.nbt-cg-panel{max-width:620px;margin:16px auto 0;padding:22px;border:1px solid var(--casino-line,#2c3d36);border-radius:17px;background:linear-gradient(160deg,#13261f,#0b1714);color:#f4f3ea;text-align:center}
.nbt-cg-dice,.nbt-cg-reels{display:flex;justify-content:center;gap:14px;font-size:76px;line-height:1.1;margin:4px 0 18px}
.nbt-cg-reels span{min-width:96px;padding:8px 0;border-radius:14px;background:rgba(255,255,255,.07);border:1px solid rgba(255,255,255,.12);font-size:56px}
.nbt-cg-dice span,.nbt-cg-reels span{animation:nbt-cg-pop .35s ease-out}
@keyframes nbt-cg-pop{from{transform:translateY(-10px) scale(.85);opacity:.3}to{transform:none;opacity:1}}
.nbt-cg-card{display:inline-flex;flex-direction:column;align-items:center;justify-content:center;width:112px;height:158px;margin:4px 0 18px;border-radius:12px;background:#fff;color:#111;box-shadow:0 8px 24px rgba(0,0,0,.4);animation:nbt-cg-pop .35s ease-out}
.nbt-cg-card.is-red{color:#c1121f}.nbt-cg-card b{font-size:46px;line-height:1}.nbt-cg-card span{font-size:34px}
.nbt-cg-form{display:grid;gap:12px;text-align:left}
.nbt-cg-choices{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:10px}
.nbt-cg-choice{display:block;cursor:pointer}.nbt-cg-choice input{position:absolute;opacity:0}
.nbt-cg-choice span{display:block;padding:12px;border:1px solid rgba(255,255,255,.16);border-radius:12px;background:rgba(255,255,255,.05);text-align:center}
.nbt-cg-choice small{display:block;opacity:.75;margin-top:2px}
.nbt-cg-choice input:checked+span{border-color:#d7b86b;background:rgba(215,184,107,.16)}
.nbt-cg-choice.is-off{opacity:.4;cursor:not-allowed}
.nbt-cg-bet{display:grid;gap:6px}.nbt-cg-bet input{padding:12px;border-radius:10px;border:1px solid rgba(255,255,255,.2);background:rgba(0,0,0,.35);color:#fff;font-size:18px}
.nbt-cg-chips{display:flex;gap:8px;flex-wrap:wrap}.nbt-cg-chips button{padding:6px 14px;border-radius:999px;border:1px solid rgba(255,255,255,.2);background:rgba(255,255,255,.08);color:#fff;cursor:pointer}
.nbt-cg-go{padding:14px;border:0;border-radius:12px;background:linear-gradient(135deg,#d7b86b,#b08d3c);color:#1a1405;font-size:17px;font-weight:800;cursor:pointer}
.nbt-cg-go:disabled{opacity:.45;cursor:not-allowed}
.nbt-cg-pay{margin:18px auto 0;border-collapse:collapse;font-size:14px;opacity:.9}.nbt-cg-pay caption{caption-side:top;padding-bottom:6px;opacity:.75}
.nbt-cg-pay td{padding:3px 14px;border-bottom:1px solid rgba(255,255,255,.1)}
@media (max-width:520px){.nbt-cg-dice{font-size:60px}.nbt-cg-reels span{min-width:76px;font-size:44px}}

/* ===== casino & games: same look as the rest of the site (theme tokens, no green/gold palette) ===== */
.nbt-casino-floor, .nbt-casino-game, .nbt-pokdeng { --casino-ink: #fff; --casino-muted: rgba(235,245,255,.82); --casino-gold: #9fd0ff; --casino-line: var(--border); }
.nbt-casino-hero::after { display: none; }
.nbt-casino-hero h1, .nbt-casino-game-head h1, .nbt-pokdeng-head h1 { font-family: inherit; font-weight: 800; letter-spacing: -.02em; color: #fff; }
.nbt-casino-kicker, .nbt-casino-game-head .nbt-casino-kicker, .nbt-pokdeng-head .nbt-pet-eyebrow { color: #9fd0ff; }
.nbt-casino-game-head p:not(.nbt-casino-kicker), .nbt-pokdeng-head p:not(.nbt-pet-eyebrow) { color: rgba(235,245,255,.82); }
.nbt-casino-wallet > div, .nbt-pd-balances { border-color: rgba(255,255,255,.22); background: rgba(255,255,255,.12); backdrop-filter: blur(8px); color: #fff; }
.nbt-casino-wallet span, .nbt-pd-balances span { color: rgba(235,245,255,.8); }
.nbt-casino-wallet strong { color: #fff; }
.nbt-casino-wallet small { color: #9fd0ff; }
.nbt-casino-section-head h2, .nbt-casino-card h3 { font-family: inherit; font-weight: 800; }
.nbt-casino-card:hover { border-color: var(--blue); }
.nbt-casino-mark { border-color: var(--border-strong); background: var(--blue-soft); color: var(--blue-ink); font-family: inherit; }
.nbt-casino-card-cta b { color: var(--blue); }
.nbt-casino-game-note { border-color: var(--border); background: var(--surface-soft); }
.nbt-casino-game-note strong { color: var(--ink); }
/* lucky room + solo games */
.nbt-lucky-page .nbt-lucky-box, .nbt-cg-panel { border: 1px solid var(--border); background: var(--surface); color: var(--ink); box-shadow: var(--premium-shadow); }
.nbt-lucky-page .nbt-lucky-title { color: var(--ink); font-family: inherit; font-weight: 800; }
.nbt-lucky-page .nbt-lucky-cost { color: var(--muted); }
.nbt-lucky-page .nbt-lucky-box button, .nbt-cg-go, .nbt-casino-dialog-confirm { border: 0; background: var(--grad-brand); color: #fff; font-weight: 800; box-shadow: 0 8px 20px rgba(37,99,235,.25); }
.nbt-cg-dice span, .nbt-cg-reels span { border-color: var(--border); background: var(--surface-soft); }
.nbt-cg-choice span { border-color: var(--border); background: var(--surface-soft); color: var(--ink); }
.nbt-cg-choice input:checked + span { border-color: var(--blue); background: var(--blue-soft); color: var(--blue-ink); }
.nbt-cg-bet { color: var(--ink-soft); }
.nbt-cg-bet input { border: 1px solid var(--border-strong); background: var(--surface); color: var(--ink); }
.nbt-cg-chips button { border: 1px solid var(--border-strong); background: var(--surface-soft); color: var(--ink); }
.nbt-cg-chips button:hover { border-color: var(--blue); color: var(--blue-ink); }
.nbt-cg-card { box-shadow: var(--premium-shadow-lg); border: 1px solid var(--border); }
.nbt-cg-pay { color: var(--ink-soft); }
.nbt-cg-pay td { border-bottom-color: var(--border); }
/* wager dialog */
.nbt-casino-dialog { border: 1px solid var(--border); background: var(--surface); color: var(--ink); box-shadow: var(--premium-shadow-lg); }
.nbt-casino-dialog h2 { color: var(--ink); font-family: inherit; font-weight: 800; }
.nbt-casino-dialog-kicker { color: var(--blue); }
.nbt-casino-dialog-mark { border-color: var(--border-strong); background: var(--blue-soft); color: var(--blue-ink); }
.nbt-casino-dialog-close { border-color: var(--border); background: var(--surface-soft); color: var(--ink-soft); }
.nbt-casino-dialog-close:hover { border-color: var(--blue); color: var(--blue-ink); }
.nbt-casino-dialog-stake { border-color: var(--border); background: var(--blue-soft); }
.nbt-casino-dialog-stake span { color: var(--muted); }
.nbt-casino-dialog-stake strong { color: var(--blue-ink); }
.nbt-casino-dialog-copy { color: var(--ink-soft); }
.nbt-casino-dialog-note { color: var(--muted); }
.nbt-casino-dialog-cancel { border: 1px solid var(--border-strong); background: var(--surface-soft); color: var(--ink); }
.nbt-casino-dialog-actions button:focus-visible, .nbt-casino-dialog-close:focus-visible { outline: 3px solid rgba(37,99,235,.35); }

/* ===== bets.php (take bet) ===== */
.nbt-bt-stats{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.nbt-bt-stats>div{display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 10px;border:1px solid var(--border);border-radius:16px;background:var(--surface);box-shadow:var(--premium-shadow)}
.nbt-bt-stats b{font-size:26px;font-weight:800;color:var(--blue-ink);line-height:1.1}
.nbt-bt-stats span{font-size:11px;color:var(--muted)}
.nbt-bt-result{display:flex;align-items:center;gap:14px;padding:16px 18px;border-radius:16px;border:1px solid var(--border);background:var(--surface);animation:nbt-bt-pop .4s ease-out}
.nbt-bt-result-emoji{font-size:38px;line-height:1}
.nbt-bt-result strong{display:block;font-size:18px;color:var(--ink)}
.nbt-bt-result p{margin:2px 0 0;color:var(--ink-soft);font-size:13px}
.nbt-bt-result.is-win{border-color:#86efac;background:#f0fdf4}.nbt-bt-result.is-win strong{color:#166534}
.nbt-bt-result.is-lose{border-color:#fca5a5;background:#fef2f2}.nbt-bt-result.is-lose strong{color:#b91c1c}
.nbt-bt-result.is-draw{border-color:var(--border-strong);background:var(--surface-soft)}
@keyframes nbt-bt-pop{from{transform:scale(.96);opacity:0}to{transform:none;opacity:1}}
.nbt-bt-odds h2{margin:0 0 10px;font-size:15px;color:var(--ink);text-align:left}
.nbt-bt-odds-grid{display:grid;grid-template-columns:repeat(4,1fr);gap:10px}
.nbt-bt-odds-grid>div{display:flex;flex-direction:column;align-items:center;gap:3px;padding:14px 8px;border:1px solid var(--border);border-radius:14px;background:var(--surface);text-align:center}
.nbt-bt-odds-grid span{font-size:28px}.nbt-bt-odds-grid b{font-size:13px;color:var(--ink)}.nbt-bt-odds-grid small{font-size:11px;color:var(--muted)}
.nbt-bt-odds-grid .is-win{border-color:#86efac}.nbt-bt-odds-grid .is-draw{border-color:var(--border-strong)}
.nbt-bt-cols{display:grid;grid-template-columns:minmax(0,1.2fr) minmax(0,1fr);gap:14px}
.nbt-bt-amount{display:grid;gap:6px;color:var(--ink-soft);font-size:13px}
.nbt-bt-amount input{padding:14px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface);color:var(--ink);font-size:24px;font-weight:800;text-align:center}
.nbt-bt-chips{display:flex;flex-wrap:wrap;gap:8px;margin:10px 0}
.nbt-bt-chips button{padding:7px 14px;border:1px solid var(--border-strong);border-radius:999px;background:var(--surface-soft);color:var(--ink);font-weight:700;cursor:pointer}
.nbt-bt-chips button:hover{border-color:var(--blue);color:var(--blue-ink)}
.nbt-bt-preview{margin:6px 0 12px;padding:10px 12px;border-radius:12px;background:var(--blue-soft);color:var(--ink-soft);font-size:13px}
.nbt-bt-preview b{color:var(--blue-ink)}
.nbt-bt-go,.nbt-bt-challenge{width:100%;padding:13px;border:0;border-radius:12px;background:var(--grad-brand);color:#fff;font-size:16px;font-weight:800;cursor:pointer;box-shadow:0 8px 20px rgba(37,99,235,.22)}
.nbt-bt-full{color:var(--muted);font-size:13px}
.nbt-bt-feed-row{display:flex;align-items:center;gap:10px;padding:9px 0;border-bottom:1px solid var(--border);font-size:13px}
.nbt-bt-feed-row:last-child{border-bottom:0}.nbt-bt-feed-row>div{flex:1;min-width:0}.nbt-bt-feed-row small{display:block;color:var(--muted);font-size:11px}
.nbt-bt-feed-row strong{color:#166534}
.nbt-bt-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(210px,1fr));gap:14px}
.nbt-bt-card{display:flex;flex-direction:column;gap:6px;padding:16px;border:1px solid var(--border);border-radius:18px;background:var(--surface);box-shadow:var(--premium-shadow);transition:transform .15s ease,border-color .15s ease}
.nbt-bt-card:hover{transform:translateY(-3px);border-color:var(--blue)}
.nbt-bt-card.is-own{background:var(--surface-soft);border-style:dashed}
.nbt-bt-card-top{display:flex;align-items:center;justify-content:space-between;gap:8px;font-weight:700}
.nbt-bt-badge{padding:2px 8px;border-radius:999px;background:var(--blue-soft);color:var(--blue-ink);font-size:10px;font-weight:800}
.nbt-bt-amount-big{font-size:34px;font-weight:900;color:var(--ink);line-height:1.05}.nbt-bt-amount-big small{margin-left:5px;font-size:12px;color:var(--muted);font-weight:700}
.nbt-bt-win{color:#166534;font-weight:700;font-size:13px}.nbt-bt-age{color:var(--muted);font-size:11px}
.nbt-bt-act{margin-top:6px}.nbt-bt-challenge:disabled{opacity:.45;cursor:not-allowed}
.nbt-bt-cancel{width:100%;padding:11px;border:1px solid var(--border-strong);border-radius:12px;background:var(--surface);color:var(--ink-soft);font-weight:700;cursor:pointer}
.nbt-bt-empty{display:flex;flex-direction:column;align-items:center;gap:6px;padding:34px;border:1px dashed var(--border-strong);border-radius:18px;color:var(--muted)}.nbt-bt-empty span{font-size:42px}
@media (max-width:720px){.nbt-bt-odds-grid{grid-template-columns:repeat(2,1fr)}.nbt-bt-cols{grid-template-columns:1fr}.nbt-bt-stats b{font-size:21px}}

/* ===== pokdeng.php: livelier table (theme tokens only) ===== */
.nbt-pokdeng{max-width:920px}
.nbt-pd-stats{display:grid;grid-template-columns:repeat(5,1fr);gap:10px}
.nbt-pd-stats>div{display:flex;flex-direction:column;align-items:center;gap:2px;padding:12px 6px;border:1px solid var(--border);border-radius:14px;background:var(--surface);box-shadow:var(--premium-shadow)}
.nbt-pd-stats b{font-size:24px;font-weight:800;color:var(--blue-ink);line-height:1.1}.nbt-pd-stats span{font-size:11px;color:var(--muted)}
.nbt-pd-stats .is-win b{color:#166534}.nbt-pd-stats .is-lose b{color:#b91c1c}
details.nbt-pokdeng-rules{cursor:default}details.nbt-pokdeng-rules summary{cursor:pointer;font-weight:700;color:var(--ink)}details.nbt-pokdeng-rules[open] summary{margin-bottom:8px}
/* the table: brand-coloured "felt" with soft light and an inner rim */
.nbt-pd-table{position:relative;overflow:hidden;border:0;border-radius:26px;background:radial-gradient(ellipse at 50% 18%,rgba(255,255,255,.22),transparent 58%),var(--grad-brand);box-shadow:inset 0 0 0 6px rgba(255,255,255,.12),inset 0 12px 40px rgba(0,0,0,.28),var(--premium-shadow-lg);color:#fff}
.nbt-pd-table::before{content:"POK DENG";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);font-size:clamp(40px,12vw,96px);font-weight:900;letter-spacing:.2em;color:rgba(255,255,255,.07);pointer-events:none;white-space:nowrap}
.nbt-pd-table>*{position:relative}
.nbt-pd-hand-label{flex-wrap:wrap;justify-content:center}
.nbt-pd-hand-label span{color:rgba(255,255,255,.8)}
.nbt-pd-score{display:inline-grid;place-items:center;min-width:34px;height:34px;padding:0 8px;border-radius:999px;background:#fff;color:var(--blue-ink);font-style:normal;font-size:19px;font-weight:900;box-shadow:0 4px 12px rgba(0,0,0,.25)}
.nbt-pd-score.is-pok{background:#fde047;color:#713f12}
.nbt-pd-pok{padding:3px 10px;border-radius:999px;background:#fde047;color:#713f12;font-size:12px;font-weight:900;animation:nbt-pd-glow 1.4s ease-in-out infinite}
@keyframes nbt-pd-glow{0%,100%{box-shadow:0 0 0 0 rgba(253,224,71,.7)}50%{box-shadow:0 0 0 8px rgba(253,224,71,0)}}
/* cards */
.nbt-pd-cards{gap:12px}
.nbt-pd-card{flex-basis:74px;width:74px;height:106px;border:0;border-radius:12px;background:#fff;box-shadow:0 10px 22px rgba(0,0,0,.32);overflow:hidden;animation:nbt-pd-deal .45s cubic-bezier(.2,.8,.2,1) both}
.nbt-pd-card:nth-child(2){animation-delay:.12s}.nbt-pd-card:nth-child(3){animation-delay:.24s}
.nbt-pd-card::after{content:attr(data-suit);position:absolute;right:-6px;bottom:-14px;font-size:64px;line-height:1;opacity:.08}
.nbt-pd-card b{font-size:34px}
.nbt-pd-card-back{border:3px solid #fff;background:repeating-linear-gradient(45deg,var(--blue-ink) 0 6px,var(--blue) 6px 12px);box-shadow:0 10px 22px rgba(0,0,0,.32)}
.nbt-pd-card-back::after{display:none}
@keyframes nbt-pd-deal{from{transform:translateY(-34px) rotate(-10deg) scale(.8);opacity:0}to{transform:none;opacity:1}}
.nbt-pd-divider{color:rgba(255,255,255,.7)}.nbt-pd-divider span{padding:5px 12px;border-radius:999px;background:rgba(0,0,0,.22);color:#fff;font-size:11px}
.nbt-pd-pot{align-self:center;padding:7px 16px;border-radius:999px;background:rgba(0,0,0,.22);font-size:13px;color:rgba(255,255,255,.85)}.nbt-pd-pot b{color:#fde047}
.nbt-pd-countdown{align-self:center;display:flex;align-items:center;gap:8px;padding:6px 14px;border-radius:999px;background:rgba(0,0,0,.25);color:#fff;font-size:12px}
.nbt-pd-countdown b{font-size:20px;font-variant-numeric:tabular-nums}.nbt-pd-countdown.is-expired b{color:#fca5a5}
.nbt-pd-controls .btn{min-width:160px;font-weight:800}
.nbt-pd-concede{border:1px solid rgba(255,255,255,.35);background:rgba(0,0,0,.2);color:#fff;border-radius:999px;padding:9px 16px;cursor:pointer}
.nbt-pd-waiting{align-self:center;padding:8px 16px;border-radius:999px;background:rgba(0,0,0,.22);color:#fff;font-size:13px;animation:nbt-pd-pulse 1.6s ease-in-out infinite}
@keyframes nbt-pd-pulse{50%{opacity:.55}}
/* result */
.nbt-pd-outcome strong{font-size:clamp(24px,5vw,34px);font-weight:900;text-shadow:0 3px 14px rgba(0,0,0,.3)}
.nbt-pd-outcome span{color:rgba(255,255,255,.9)}
.nbt-pd-result.is-mine-win::after{content:"🎉  ✨  🎊  ✨  🎉";position:absolute;left:0;right:0;top:8px;text-align:center;font-size:22px;letter-spacing:.3em;animation:nbt-pd-confetti 1.6s ease-out both;pointer-events:none}
@keyframes nbt-pd-confetti{from{transform:translateY(-24px);opacity:0}30%{opacity:1}to{transform:translateY(8px);opacity:.0}}
/* lobby */
.nbt-pd-start{border-radius:20px;background:var(--surface);box-shadow:var(--premium-shadow)}
.nbt-pd-chips{display:flex;flex-wrap:wrap;gap:7px;margin-top:9px}
.nbt-pd-chips button{padding:5px 12px;border:1px solid var(--border-strong);border-radius:999px;background:var(--surface-soft);color:var(--ink);font-weight:700;cursor:pointer}
.nbt-pd-chips button:hover{border-color:var(--blue);color:var(--blue-ink)}
.nbt-pd-room-card{align-items:center;border-radius:16px;transition:transform .15s ease,border-color .15s ease}
.nbt-pd-room-card:hover{transform:translateY(-2px);border-color:var(--blue)}
.nbt-pd-room-icon.is-avatar{display:grid;place-items:center;width:44px;height:44px;border-radius:50%;background:var(--grad-brand);color:#fff;font-size:19px;font-weight:900}
.nbt-pd-room-stake{margin-left:auto;padding:5px 12px;border-radius:999px;background:var(--blue-soft);color:var(--blue-ink);font-size:12px;font-weight:800;white-space:nowrap}
.nbt-pd-room-open{padding:7px 14px;border-radius:999px;background:var(--grad-brand);color:#fff!important;font-size:12px;font-weight:800;white-space:nowrap}
@media (max-width:640px){.nbt-pd-stats{grid-template-columns:repeat(3,1fr)}.nbt-pd-card{flex-basis:62px;width:62px;height:90px}.nbt-pd-card b{font-size:28px}.nbt-pd-room-card{flex-wrap:wrap}.nbt-pd-room-stake{margin-left:0}}

.nbt-pd-start h2,.nbt-pd-room-head h2,.nbt-pd-section-head h2{padding:0;border:0;background:none;box-shadow:none}
.nbt-pd-start>div:first-child{display:flex;flex-direction:column;gap:6px}
.nbt-pd-start>div:first-child::before{content:"🂡 🂱 🃁";font-size:34px;letter-spacing:.15em;color:var(--blue)}
.nbt-pd-stake{align-self:center;padding:6px 14px;border-radius:999px;background:var(--blue-soft);color:var(--blue-ink);font-size:12px}.nbt-pd-stake strong{color:var(--blue-ink)}
.nbt-pd-room-head{display:flex;align-items:center;justify-content:space-between;gap:12px}

/* ===== casino.php hub (theme tokens only) ===== */
.nbt-cz-pulse{display:grid;grid-template-columns:repeat(3,1fr);gap:12px}
.nbt-cz-pulse>div{display:flex;flex-direction:column;align-items:center;gap:2px;padding:14px 8px;border:1px solid var(--border);border-radius:16px;background:var(--surface);box-shadow:var(--premium-shadow)}
.nbt-cz-pulse b{font-size:26px;font-weight:800;color:var(--blue-ink);line-height:1.1}.nbt-cz-pulse span{font-size:11px;color:var(--muted);text-align:center}
.nbt-cz-pulse b.is-up{color:#166534}.nbt-cz-pulse b.is-down{color:#b91c1c}
.nbt-cz-tabs{display:flex;flex-wrap:wrap;gap:8px;margin-bottom:4px}
.nbt-cz-tabs button{padding:8px 16px;border:1px solid var(--border-strong);border-radius:999px;background:var(--surface);color:var(--ink-soft);font-weight:700;cursor:pointer}
.nbt-cz-tabs button:hover{border-color:var(--blue);color:var(--blue-ink)}
.nbt-cz-tabs button.is-active{border-color:transparent;background:var(--grad-brand);color:#fff;box-shadow:0 6px 16px rgba(37,99,235,.22)}
.nbt-cz-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(270px,1fr));gap:16px}
.nbt-cz-card{position:relative;display:flex;flex-direction:column;overflow:hidden;border:1px solid var(--border);border-radius:20px;background:var(--surface);box-shadow:var(--premium-shadow);color:var(--ink)!important;text-decoration:none!important;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
.nbt-cz-card:hover{transform:translateY(-5px);border-color:var(--blue);box-shadow:var(--premium-shadow-lg)}
.nbt-cz-art{position:relative;display:grid;place-items:center;height:118px;background:var(--grad-brand);overflow:hidden}
.nbt-cz-art::before{content:"";position:absolute;inset:0;background:radial-gradient(circle at 78% 18%,rgba(255,255,255,.35),transparent 46%),repeating-linear-gradient(135deg,rgba(255,255,255,.07) 0 14px,transparent 14px 28px)}
.nbt-cz-art span{position:relative;font-size:58px;line-height:1;filter:drop-shadow(0 8px 14px rgba(0,0,0,.3));transition:transform .25s ease}
.nbt-cz-card:hover .nbt-cz-art span{transform:scale(1.14) rotate(-6deg)}
.nbt-cz-card.t2 .nbt-cz-art{background-position:100% 0}.nbt-cz-card.t4 .nbt-cz-art::before{background:radial-gradient(circle at 22% 80%,rgba(255,255,255,.35),transparent 46%),repeating-linear-gradient(45deg,rgba(255,255,255,.07) 0 14px,transparent 14px 28px)}
.nbt-cz-hot{position:absolute;z-index:2;top:10px;right:10px;padding:4px 10px;border-radius:999px;background:#fde047;color:#713f12;font-size:11px;font-weight:900;box-shadow:0 4px 12px rgba(0,0,0,.25)}
.nbt-cz-body{display:flex;flex-direction:column;gap:6px;padding:16px 18px 8px;flex:1}
.nbt-cz-type{align-self:flex-start;padding:2px 9px;border-radius:999px;background:var(--blue-soft);color:var(--blue-ink);font-size:10px;font-weight:800}
.nbt-cz-body h3{margin:0;font-family:inherit;font-size:21px;font-weight:800;color:var(--ink);text-align:left}
.nbt-cz-body p{margin:0;color:var(--muted);font-size:13px;line-height:1.65}
.nbt-cz-chips{display:flex;flex-wrap:wrap;gap:6px;margin-top:4px}
.nbt-cz-chips span{padding:3px 9px;border:1px solid var(--border);border-radius:8px;background:var(--surface-soft);color:var(--ink-soft);font-size:11px}
.nbt-cz-foot{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:8px 18px 16px;padding-top:12px;border-top:1px solid var(--border);font-size:12px}
.nbt-cz-live{display:inline-flex;align-items:center;gap:7px;color:var(--ink-soft);font-weight:600}
.nbt-cz-live i{width:8px;height:8px;border-radius:50%;background:#22c55e;box-shadow:0 0 0 0 rgba(34,197,94,.6);animation:nbt-cz-ping 1.8s ease-out infinite}
@keyframes nbt-cz-ping{70%{box-shadow:0 0 0 8px rgba(34,197,94,0)}100%{box-shadow:0 0 0 0 rgba(34,197,94,0)}}
.nbt-cz-foot b{color:var(--blue-ink);font-weight:800;white-space:nowrap}
.nbt-cz-wins ol{list-style:none;margin:0;padding:0;display:grid;gap:8px}
.nbt-cz-wins li{display:flex;align-items:center;gap:12px;padding:11px 14px;border:1px solid var(--border);border-radius:14px;background:var(--surface);font-size:13px}
.nbt-cz-wins li:first-child{border-color:#fde047;background:linear-gradient(90deg,#fffbeb,var(--surface))}
.nbt-cz-rank{width:28px;text-align:center;font-size:18px}.nbt-cz-wins li>span:nth-child(3){color:var(--muted);flex:1}.nbt-cz-wins strong{color:#166534}
@media (max-width:640px){.nbt-cz-pulse b{font-size:20px}.nbt-cz-grid{grid-template-columns:1fr}.nbt-cz-art{height:96px}.nbt-cz-art span{font-size:46px}}

/* ===== dice.php: in-page roll ===== */
.nbt-dx{scroll-margin-top:84px}
.nbt-dx-result{min-height:46px;margin:0 0 12px;padding:12px 14px;border-radius:14px;font-weight:700;font-size:15px;text-align:center;border:1px solid transparent}
.nbt-dx-result:empty{visibility:hidden}
.nbt-dx-result.is-win{background:#f0fdf4;border-color:#86efac;color:#166534;animation:nbt-bt-pop .35s ease-out}
.nbt-dx-result.is-lose{background:#fef2f2;border-color:#fca5a5;color:#b91c1c;animation:nbt-bt-pop .35s ease-out}
.nbt-dx-result.is-info{background:var(--surface-soft);border-color:var(--border-strong);color:var(--ink-soft)}
.nbt-dx-stage{display:flex;align-items:center;justify-content:center;gap:18px;padding:22px 10px;margin-bottom:8px;border-radius:20px;background:radial-gradient(ellipse at 50% 0%,var(--blue-soft),transparent 70%),var(--surface-soft)}
.nbt-dx-die{display:grid;grid-template-columns:repeat(3,1fr);grid-template-rows:repeat(3,1fr);width:92px;height:92px;padding:12px;border-radius:20px;background:linear-gradient(145deg,#fff,#e9edf5);box-shadow:0 12px 24px rgba(0,0,0,.22),inset 0 -4px 0 rgba(0,0,0,.08)}
.nbt-dx-die span{display:block;place-self:center;width:15px;height:15px;border-radius:50%}
.nbt-dx-die span.p{background:radial-gradient(circle at 35% 30%,var(--blue),var(--blue-ink))}
.nbt-dx-die.is-blank{background:var(--surface);box-shadow:inset 0 0 0 2px var(--border-strong)}
.nbt-dx-die.rolling{animation:nbt-dx-shake .16s linear infinite}
@keyframes nbt-dx-shake{0%{transform:rotate(-8deg) translateY(0)}25%{transform:rotate(7deg) translateY(-9px)}50%{transform:rotate(-5deg) translateY(0)}75%{transform:rotate(9deg) translateY(-6px)}100%{transform:rotate(-8deg) translateY(0)}}
.nbt-dx-sum{display:grid;place-items:center;min-width:58px;height:58px;padding:0 10px;border-radius:50%;background:var(--grad-brand);color:#fff;font-size:26px;font-weight:900;box-shadow:0 8px 18px rgba(0,0,0,.22)}
.nbt-dx.flash-win .nbt-dx-stage{animation:nbt-dx-win .9s ease-out}
@keyframes nbt-dx-win{0%{box-shadow:0 0 0 0 rgba(34,197,94,.7)}100%{box-shadow:0 0 0 26px rgba(34,197,94,0)}}
.nbt-dx-hist{display:flex;justify-content:center;gap:6px;flex-wrap:wrap;min-height:30px;margin-bottom:14px}
.nbt-dx-hist span{display:grid;place-items:center;width:28px;height:28px;border-radius:50%;font-size:12px;font-weight:800;color:#fff}
.nbt-dx-hist .w{background:#16a34a}.nbt-dx-hist .l{background:#9ca3af}
.nbt-dx .nbt-cg-choice span{position:relative}
.nbt-dx-bar{display:block;height:5px;margin-top:8px;border-radius:99px;background:var(--border);overflow:hidden}.nbt-dx-bar u{display:block;height:100%;background:var(--grad-brand);text-decoration:none}
.nbt-dx-quick{display:flex;gap:8px}.nbt-dx-quick button{flex:1;padding:8px;border:1px solid var(--border-strong);border-radius:10px;background:var(--surface-soft);color:var(--ink);font-weight:800;cursor:pointer}.nbt-dx-quick button:hover{border-color:var(--blue);color:var(--blue-ink)}
.nbt-dx-preview{margin:2px 0;padding:10px 12px;border-radius:12px;background:var(--blue-soft);color:var(--ink-soft);font-size:13px;text-align:center}.nbt-dx-preview b{color:var(--blue-ink)}
.nbt-dx-session{margin:0;text-align:center;color:var(--muted);font-size:12px}
@media (max-width:520px){.nbt-dx-die{width:74px;height:74px;padding:9px}.nbt-dx-die span{width:12px;height:12px}.nbt-dx-stage{gap:10px}}

/* ===== slots machine ===== */
.nbt-sx-machine{display:flex;justify-content:center;gap:12px;padding:20px 12px;margin-bottom:8px;border-radius:22px;background:linear-gradient(180deg,var(--blue-ink),var(--blue));box-shadow:inset 0 8px 22px rgba(0,0,0,.35),0 8px 22px rgba(0,0,0,.18)}
.nbt-sx-reel{display:grid;place-items:center;width:96px;height:104px;border-radius:16px;background:linear-gradient(180deg,#e5e7eb,#fff 20%,#fff 80%,#e5e7eb);box-shadow:inset 0 0 0 3px rgba(0,0,0,.12),0 4px 10px rgba(0,0,0,.25);overflow:hidden}
.nbt-sx-reel span{font-size:56px;line-height:1}
.nbt-sx-reel.spinning span{filter:blur(2.2px);animation:nbt-sx-roll .14s linear infinite}
@keyframes nbt-sx-roll{0%{transform:translateY(-14px)}100%{transform:translateY(14px)}}
.nbt-sx-reel.stop span{animation:nbt-sx-land .3s cubic-bezier(.2,1.6,.4,1)}
@keyframes nbt-sx-land{from{transform:translateY(-34px);opacity:.4}to{transform:none;opacity:1}}
.nbt-sx-machine.is-win{animation:nbt-sx-glow 1s ease-out}
.nbt-sx-machine.is-win .nbt-sx-reel{box-shadow:inset 0 0 0 3px #fde047,0 0 22px rgba(253,224,71,.85)}
@keyframes nbt-sx-glow{0%{transform:scale(1)}30%{transform:scale(1.03)}100%{transform:scale(1)}}
.nbt-cg-pay tr.hit td{background:#fef9c3;color:#713f12;font-weight:800}
@media (max-width:520px){.nbt-sx-reel{width:76px;height:86px}.nbt-sx-reel span{font-size:44px}}

/* ===== hi-lo ===== */
.nbt-hx-stage{position:relative;display:grid;place-items:center;padding:20px 10px;margin-bottom:8px;border-radius:20px;background:radial-gradient(ellipse at 50% 0%,var(--blue-soft),transparent 70%),var(--surface-soft)}
.nbt-hx-stage.win{animation:nbt-dx-win .9s ease-out}.nbt-hx-stage.lose{animation:nbt-hx-lose .5s ease-out}
@keyframes nbt-hx-lose{0%,100%{transform:translateX(0)}20%{transform:translateX(-7px)}40%{transform:translateX(7px)}60%{transform:translateX(-4px)}80%{transform:translateX(4px)}}
.nbt-hx-card{margin:0;width:118px;height:166px}.nbt-hx-card b{font-size:52px}.nbt-hx-card span{font-size:40px}
.nbt-hx-card.flipping{animation:nbt-hx-flip .35s ease-in-out infinite alternate;background:repeating-linear-gradient(45deg,var(--blue-ink) 0 7px,var(--blue) 7px 14px);color:transparent}
.nbt-hx-card.flipping b,.nbt-hx-card.flipping span{opacity:0}
@keyframes nbt-hx-flip{from{transform:rotateY(0)}to{transform:rotateY(70deg)}}
.nbt-hx-card.flip-in{animation:nbt-hx-in .45s ease-out}
@keyframes nbt-hx-in{from{transform:rotateY(90deg) scale(.9)}to{transform:none}}
.nbt-hx-streak{position:absolute;top:10px;right:12px;padding:5px 12px;border-radius:999px;background:#fde047;color:#713f12;font-size:12px;font-weight:900;animation:nbt-bt-pop .3s ease-out}
.nbt-hx-trail{display:flex;justify-content:center;flex-wrap:wrap;gap:6px;min-height:30px;margin-bottom:12px}
.nbt-hx-trail span{display:grid;place-items:center;min-width:34px;height:30px;padding:0 6px;border-radius:8px;font-size:12px;font-weight:800;color:#fff}.nbt-hx-trail .w{background:#16a34a}.nbt-hx-trail .l{background:#9ca3af}
.nbt-cg-choice.is-off{opacity:.45;cursor:not-allowed}

/* ===== lucky room ===== */
.nbt-lx-stage{display:flex;flex-direction:column;align-items:center;gap:8px;padding:22px 10px;margin-bottom:8px;border-radius:20px;background:radial-gradient(ellipse at 50% 0%,var(--blue-soft),transparent 70%),var(--surface-soft)}
.nbt-lx-stage.jackpot{animation:nbt-dx-win 1.2s ease-out 2}
.nbt-lx-box{font-size:92px;line-height:1;filter:drop-shadow(0 12px 16px rgba(0,0,0,.25))}
.nbt-lx-box.shaking{animation:nbt-lx-shake .22s linear infinite}
@keyframes nbt-lx-shake{0%{transform:rotate(-9deg) scale(1.05)}25%{transform:rotate(8deg) translateY(-8px)}50%{transform:rotate(-6deg) scale(1.1)}75%{transform:rotate(9deg) translateY(-5px)}100%{transform:rotate(-9deg) scale(1.05)}}
.nbt-lx-box.pop{animation:nbt-lx-pop .55s cubic-bezier(.2,1.7,.4,1)}
@keyframes nbt-lx-pop{from{transform:scale(.3) rotate(-30deg);opacity:0}to{transform:none;opacity:1}}
.nbt-lx-prize{font-size:30px;font-weight:900;color:var(--blue-ink);animation:nbt-bt-pop .3s ease-out}
.nbt-lx-box.tier-jackpot+.nbt-lx-prize{color:#b45309}
.nbt-lx-tiers{display:flex;justify-content:center;flex-wrap:wrap;gap:6px 14px;margin:0 0 14px;font-size:12px;color:var(--muted)}
@media (max-width:520px){.nbt-lx-box{font-size:74px}}

/* ===== lottery ===== */
.nbt-tk-wall{display:flex;flex-wrap:wrap;justify-content:center;gap:12px;margin:6px 0 10px}
.nbt-tk-stub{position:relative;display:flex;flex-direction:column;align-items:center;gap:2px;min-width:150px;padding:14px 22px;border-radius:14px;background:var(--grad-brand);color:#fff;box-shadow:var(--premium-shadow)}
.nbt-tk-stub::before,.nbt-tk-stub::after{content:"";position:absolute;top:50%;width:16px;height:16px;margin-top:-8px;border-radius:50%;background:var(--surface)}
.nbt-tk-stub::before{left:-8px}.nbt-tk-stub::after{right:-8px}
.nbt-tk-stub span{font-size:10px;letter-spacing:.2em;opacity:.8}.nbt-tk-stub b{font-size:28px;font-weight:900}.nbt-tk-stub small{opacity:.85}
.nbt-tk-stub.tear{animation:nbt-tk-in .6s cubic-bezier(.2,1.5,.4,1)}
@keyframes nbt-tk-in{from{transform:translateY(-40px) rotate(-8deg) scale(.7);opacity:0}to{transform:none;opacity:1}}
.nbt-tk-odds{margin:0 0 10px;padding:10px 12px;border-radius:12px;background:var(--blue-soft);color:var(--ink-soft);font-size:13px;text-align:center}.nbt-tk-odds b{color:var(--blue-ink)}
.nbt-tickets .nbt-ticket-buy{width:100%}

/* ===== solo games: fit the screen, fixed width (no resizing with content) ===== */
.nbt-cg-panel{width:100%;box-sizing:border-box;max-width:560px;padding:14px;text-align:center}
.nbt-cg .nbt-casino-game-head{padding:12px 16px;gap:10px}
.nbt-cg .nbt-casino-game-head h1{font-size:20px;margin:0}
.nbt-cg .nbt-casino-game-head p:not(.nbt-casino-kicker){display:none}
.nbt-cg .nbt-casino-game-head .nbt-casino-kicker{margin:0 0 2px}
.nbt-cg .nbt-casino-wallet>div{padding:7px 12px}
.nbt-cg-panel .nbt-dx-result{min-height:38px;margin:0 0 8px;padding:8px 12px;font-size:14px}
.nbt-cg-panel .nbt-dx-stage,.nbt-cg-panel .nbt-hx-stage,.nbt-cg-panel .nbt-lx-stage{padding:12px 8px;margin-bottom:6px}
.nbt-cg-panel .nbt-sx-machine{padding:12px 8px;margin-bottom:6px;gap:8px}
.nbt-cg-panel .nbt-dx-die{width:68px;height:68px;padding:9px;border-radius:15px;gap:0}
.nbt-cg-panel .nbt-dx-die span{width:12px;height:12px}
.nbt-cg-panel .nbt-dx-sum{min-width:46px;height:46px;font-size:21px}
.nbt-cg-panel .nbt-sx-reel{width:78px;height:84px}.nbt-cg-panel .nbt-sx-reel span{font-size:46px}
.nbt-cg-panel .nbt-hx-card{width:84px;height:118px}.nbt-cg-panel .nbt-hx-card b{font-size:36px}.nbt-cg-panel .nbt-hx-card span{font-size:28px}
.nbt-cg-panel .nbt-lx-box{font-size:64px}.nbt-cg-panel .nbt-lx-prize{font-size:22px}
.nbt-cg-panel .nbt-dx-hist,.nbt-cg-panel .nbt-hx-trail{min-height:24px;margin-bottom:8px;gap:4px}
.nbt-cg-panel .nbt-dx-hist span{width:24px;height:24px;font-size:11px}
.nbt-cg-panel .nbt-hx-trail span{min-width:28px;height:24px;font-size:11px}
.nbt-cg-panel .nbt-lx-tiers{margin:0 0 8px;font-size:11px;gap:2px 10px}
.nbt-cg-panel .nbt-cg-form{gap:8px}
.nbt-cg-panel .nbt-cg-choices{grid-template-columns:repeat(auto-fit,minmax(0,1fr));gap:6px}
.nbt-cg-panel .nbt-cg-choice span{padding:8px 4px;font-size:13px}
.nbt-cg-panel .nbt-cg-choice small{font-size:10px;line-height:1.3}
.nbt-cg-panel .nbt-dx-bar{margin-top:5px;height:4px}
.nbt-cg-panel .nbt-cg-bet{grid-template-columns:1fr 1fr;align-items:center;gap:8px;font-size:12px}
.nbt-cg-panel .nbt-cg-bet input{padding:8px;font-size:16px;text-align:center}
.nbt-cg-panel .nbt-cg-chips,.nbt-cg-panel .nbt-dx-quick{gap:5px;justify-content:center}
.nbt-cg-panel .nbt-cg-chips button,.nbt-cg-panel .nbt-dx-quick button{padding:4px 11px;font-size:12px;flex:0 0 auto}
.nbt-cg-panel .nbt-dx-quick button{flex:1 1 0}
.nbt-cg-panel .nbt-dx-preview{margin:0;padding:6px 10px;font-size:12px}
.nbt-cg-panel .nbt-dx-session{font-size:11px}
.nbt-cg-panel .nbt-cg-go{position:sticky;bottom:8px;z-index:3;padding:11px;font-size:16px}
.nbt-cg-panel .nbt-cg-pay{margin-top:10px;font-size:12px}
/* wide screens: stage on the left, controls on the right, everything in one view */
@media (min-width:860px){
	.nbt-cg-panel.nbt-dx{max-width:860px;display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1fr);grid-template-areas:"r r" "s f" "h f" "p f";gap:0 22px;align-items:start;text-align:center}
	.nbt-cg-panel.nbt-dx>.nbt-dx-result{grid-area:r}
	.nbt-cg-panel.nbt-dx>.nbt-dx-stage,.nbt-cg-panel.nbt-dx>.nbt-sx-machine,.nbt-cg-panel.nbt-dx>.nbt-hx-stage,.nbt-cg-panel.nbt-dx>.nbt-lx-stage{grid-area:s;min-height:190px;align-content:center}
	.nbt-cg-panel.nbt-dx>.nbt-dx-hist,.nbt-cg-panel.nbt-dx>.nbt-hx-trail{grid-area:h}
	.nbt-cg-panel.nbt-dx>.nbt-lx-tiers,.nbt-cg-panel.nbt-dx>.nbt-cg-pay{grid-area:p}
	.nbt-cg-panel.nbt-dx>.nbt-cg-form{grid-area:f}
	.nbt-cg-panel .nbt-cg-go{position:static}
}
@media (max-width:520px){
	.nbt-cg-panel{padding:10px}
	.nbt-cg-panel .nbt-dx-die{width:58px;height:58px;padding:7px}.nbt-cg-panel .nbt-dx-die span{width:10px;height:10px}
	.nbt-cg-panel .nbt-sx-reel{width:64px;height:70px}.nbt-cg-panel .nbt-sx-reel span{font-size:38px}
	.nbt-cg-panel .nbt-hx-card{width:72px;height:100px}.nbt-cg-panel .nbt-lx-box{font-size:54px}
	.nbt-cg .nbt-casino-wallet>div span{display:none}
}

/* ===== IP privacy: blurred until clicked ===== */
.nbt-ip.is-blur{display:inline-block;filter:blur(5px);cursor:pointer;user-select:none;transition:filter .2s ease;border-radius:4px}
.nbt-ip.is-blur:hover{filter:blur(3px)}
.nbt-ip.is-blur.shown{filter:none;user-select:text;background:var(--blue-soft)}
.nbt-ip.is-blur:focus-visible{outline:2px solid var(--blue);outline-offset:2px}

/* ===== lottery: compact, fixed width, fits the screen ===== */
.nbt-ticket-casino-page .nbt-tickets{width:100%;box-sizing:border-box;max-width:560px;gap:8px;margin:0 auto}
.nbt-ticket-casino-page .nbt-ticket-hero{padding:12px 16px;gap:12px;background:var(--surface)}
.nbt-ticket-casino-page .nbt-ticket-emoji{font-size:34px}
.nbt-ticket-casino-page .nbt-ticket-prize{font-size:17px}
.nbt-ticket-casino-page .nbt-ticket-sub{font-size:12px}
.nbt-ticket-casino-page .nbt-ticket-countdown{padding:6px 12px}
.nbt-ticket-casino-page .nbt-ticket-countdown b{font-size:16px}
.nbt-ticket-casino-page .nbt-balance-row{margin:0;gap:6px}
.nbt-ticket-casino-page .nbt-panel{padding:10px 14px;margin:0}
.nbt-ticket-casino-page .nbt-panel-head{margin-bottom:4px}
.nbt-ticket-casino-page .nbt-bank-list{margin:0;font-size:12px;line-height:1.6}
.nbt-ticket-casino-page .nbt-dx-result{min-height:0;margin:0;padding:8px 12px;font-size:14px}
.nbt-ticket-casino-page .nbt-dx-result:empty{display:none}
.nbt-ticket-casino-page .nbt-tk-wall{margin:0;gap:8px}
.nbt-ticket-casino-page .nbt-tk-stub{min-width:120px;padding:8px 16px}.nbt-ticket-casino-page .nbt-tk-stub b{font-size:22px}
.nbt-ticket-casino-page .nbt-tk-odds{margin:0;padding:7px 10px;font-size:12px}
.nbt-ticket-casino-page .nbt-ticket-buy{padding:11px;font-size:16px;position:sticky;bottom:8px;z-index:3}
.nbt-ticket-casino-page .nbt-login-alt{margin:0;font-size:12px;text-align:center}
@media (max-width:520px){.nbt-ticket-casino-page .nbt-ticket-hero{flex-wrap:nowrap}.nbt-ticket-casino-page .nbt-ticket-emoji{display:none}}

.nbt-ticket-casino-page .nbt-bank-list li{padding:3px 8px;min-height:0;line-height:1.5}
.nbt-ticket-casino-page .nbt-bank-list{display:grid;gap:3px}
.nbt-ticket-casino-page .nbt-tk-stub{padding:5px 14px;min-width:110px}.nbt-ticket-casino-page .nbt-tk-stub small{display:none}.nbt-ticket-casino-page .nbt-tk-stub b{font-size:20px}
.nbt-ticket-casino-page .nbt-panel-head h3{font-size:14px}

.nbt-ticket-casino-page .nbt-panel{padding:6px 12px}
.nbt-ticket-casino-page .nbt-ticket-hero{padding:8px 14px}
.nbt-ticket-casino-page .nbt-tickets{gap:6px}

/* ===== page-change "Loading..." overlay ===== */
#nbt-loading{position:fixed;inset:0;z-index:99999;display:grid;place-items:center;background:rgba(255,255,255,.55);backdrop-filter:blur(2px);opacity:0;pointer-events:none;transition:opacity .15s ease}
#nbt-loading.is-on{opacity:1;pointer-events:auto;cursor:progress}
.nbt-loading-bar{position:fixed;top:0;left:0;height:3px;width:100%;background:var(--grad-brand);transform-origin:left;transform:scaleX(0)}
#nbt-loading.is-on .nbt-loading-bar{animation:nbt-loading-bar 12s cubic-bezier(.1,.7,.2,1) forwards}
@keyframes nbt-loading-bar{to{transform:scaleX(.92)}}
.nbt-loading-card{display:flex;align-items:center;gap:12px;padding:14px 22px;border:1px solid var(--border);border-radius:16px;background:var(--surface);box-shadow:var(--premium-shadow-lg);color:var(--ink);font-size:16px}
.nbt-loading-spin{width:22px;height:22px;border:3px solid var(--blue-soft);border-top-color:var(--blue);border-radius:50%;animation:nbt-loading-spin .7s linear infinite}
@keyframes nbt-loading-spin{to{transform:rotate(360deg)}}
@media (prefers-reduced-motion:reduce){.nbt-loading-spin{animation-duration:1.6s}#nbt-loading.is-on .nbt-loading-bar{animation:none;transform:scaleX(.6)}}

/* hall of wins: top 3 per game, compact */
.nbt-cz-wgrid{display:grid;grid-template-columns:repeat(auto-fill,minmax(230px,1fr));gap:10px}
.nbt-cz-wcard{padding:10px 12px;border:1px solid var(--border);border-radius:14px;background:var(--surface)}
.nbt-cz-wcard h3{margin:0 0 6px;font-family:inherit;font-size:13px;font-weight:800;color:var(--blue-ink);text-align:left}
.nbt-cz-wcard ol{list-style:none;margin:0;padding:0;display:grid;gap:4px}
.nbt-cz-wcard li{display:flex;align-items:center;gap:8px;font-size:12px}
.nbt-cz-wcard li b{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink)}
.nbt-cz-wcard li strong{color:#166534;white-space:nowrap}.nbt-cz-wcard li small{font-size:10px;color:var(--muted)}
.nbt-cz-wcard .nbt-cz-rank{width:20px;font-size:14px}
/* lottery on phones: hero stacks, list rows keep room for their icons */
.nbt-ticket-casino-page .nbt-bank-list li{padding:4px 8px 4px 34px;position:relative}
.nbt-ticket-casino-page .nbt-bank-list li::before{left:8px;top:50%;transform:translateY(-50%);margin:0}
@media (max-width:520px){
	.nbt-ticket-casino-page .nbt-ticket-hero{flex-wrap:wrap;flex-direction:column;align-items:stretch;gap:8px}
	.nbt-ticket-casino-page .nbt-ticket-hero-main{flex:none;width:100%}
	.nbt-ticket-casino-page .nbt-ticket-prize,.nbt-ticket-casino-page .nbt-ticket-sub{white-space:normal;word-break:normal}
	.nbt-ticket-casino-page .nbt-ticket-countdown{width:100%;box-sizing:border-box}
}
.nbt-ticket-casino-page .nbt-bank-list,.nbt-ticket-casino-page .nbt-bank-list li{list-style:none}
.nbt-ticket-casino-page .nbt-bank-list li::marker{content:""}
.nbt-ticket-casino-page .nbt-bank-list li::before{top:50%!important;left:10px!important;transform:translateY(-50%)}
.nbt-ticket-casino-page .nbt-bank-list li::before{width:auto!important;height:auto!important;background:none!important;border-radius:0!important;font-size:14px;line-height:1}
.nbt-cz-wins .nbt-cz-wcard li,.nbt-cz-wins .nbt-cz-wcard li:first-child{padding:0;border:0;background:none;border-radius:0}
.nbt-cz-wgrid{grid-template-columns:repeat(auto-fill,minmax(165px,1fr))}
.nbt-cz-wcard{padding:9px 10px}
.nbt-cz-wcard li{gap:5px;font-size:12px}

/* browse categories: click the name = go there, tick the box = multi-select */
.nbt-bw-check{padding:0;cursor:default;overflow:hidden}
.nbt-bw-check .nbt-bw-box{display:grid;place-items:center;align-self:stretch;padding:0 4px 0 10px;cursor:pointer}
.nbt-bw-check .nbt-bw-box input{cursor:pointer}
.nbt-bw-check .nbt-bw-catgo{flex:1;min-width:0;align-self:stretch;display:flex;align-items:center;padding:7px 10px 7px 2px;color:inherit;text-decoration:none;cursor:pointer}
.nbt-bw-check .nbt-bw-catgo:hover{text-decoration:underline}
.nbt-bw-check:has(input:checked) .nbt-bw-catgo{font-weight:700}

/* inbox toolbar: tabs left, bulk actions right */
.nbt-inbox-bar{display:flex;align-items:center;justify-content:space-between;gap:10px;flex-wrap:wrap;margin:0 0 12px}
.nbt-inbox-bar .nbt-request-actions{margin:0}
.nbt-inbox-bulk{display:flex;align-items:center;justify-content:flex-end;gap:8px;margin-left:auto}
@media (max-width:520px){.nbt-inbox-bulk{width:100%;justify-content:flex-end}}

/* torrent cover: not clickable, friendly placeholder when the image link is dead */
.nbt-detail-poster{cursor:default;pointer-events:none}
.nbt-detail-poster img{user-select:none;-webkit-user-drag:none}
.nbt-poster-broken{display:none;flex-direction:column;align-items:center;gap:4px;width:100%;max-width:420px;padding:26px 18px;border:1px dashed var(--border-strong);border-radius:16px;background:var(--surface-soft);color:var(--muted);text-align:center}
.nbt-poster-broken i{font-size:38px;color:var(--border-strong)}
.nbt-poster-broken b{color:var(--ink-soft);font-size:14px}.nbt-poster-broken small{font-size:12px}
.nbt-detail-poster.is-broken .nbt-poster-broken{display:flex}

.nbt-shout-status{margin:0 0 8px;padding:8px 12px;border:1px solid #fcd34d;border-radius:10px;background:#fffbeb;color:#92400e;font-size:13px}

/* ===== 18+ : badge, browse hero, age gate, blurred posters, category manager ===== */
.nbt-adult-badge{display:inline-block;padding:2px 9px;border-radius:999px;background:#dc2626;color:#fff;font-size:.62em;font-weight:900;letter-spacing:.04em;vertical-align:middle;line-height:1.5}
.nbt-bw-hero.is-adult{background:linear-gradient(135deg,#3b0a12,#7f1d1d 55%,#b91c1c)!important}
.nbt-bw-hero.is-adult h1,.nbt-bw-hero.is-adult p{color:#fff}
.nbt-bw-switch{color:#fecaca;font-weight:700;text-decoration:underline}
.nbt-bw-list.is-adult .nbt-bw-thumb img:not(.nbt-bw-thumb-fallback img){filter:blur(14px);transition:filter .2s ease}
.nbt-bw-list.is-adult .nbt-bw-thumb:hover img:not(.nbt-bw-thumb-fallback img){filter:none}
.nbt-detail-poster.is-adult{pointer-events:auto;cursor:pointer;position:relative}
.nbt-detail-poster.is-adult img{filter:blur(24px);transition:filter .25s ease}
.nbt-detail-poster.is-adult.is-revealed img{filter:none}
.nbt-detail-poster.is-adult:not(.is-revealed)::after{content:"🔞 คลิกเพื่อดูภาพ";position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);padding:8px 16px;border-radius:999px;background:rgba(0,0,0,.65);color:#fff;font-weight:700;font-size:13px;pointer-events:none}
.nbt-adultgate{display:grid;place-items:center;padding:20px 0}
.nbt-adultgate-card{max-width:520px;padding:30px 28px;border:1px solid var(--border);border-radius:22px;background:var(--surface);box-shadow:var(--premium-shadow-lg);text-align:center}
.nbt-adultgate-badge{font-size:34px;padding:8px 20px;margin-bottom:10px}
.nbt-adultgate-card h1{margin:0 0 8px;font-size:24px;color:var(--ink);text-align:center}
.nbt-adultgate-card p{color:var(--ink-soft);line-height:1.7}
.nbt-adultgate-card ul{margin:12px 0 18px;padding:0;list-style:none;color:var(--muted);font-size:13px;display:grid;gap:4px}
.nbt-adultgate-actions{display:grid;gap:10px}
.nbt-adultgate-yes{background:#dc2626!important;border-color:#dc2626!important;color:#fff!important}
.nbt-ac-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin-bottom:14px}
.nbt-ac-panel.is-adult{border-color:#fca5a5}
.nbt-ac-panel .nbt-panel-head small{color:var(--muted);font-weight:600}
.nbt-ac-tools{display:flex;gap:10px;align-items:center;justify-content:space-between;flex-wrap:wrap;margin:6px 0}
.nbt-ac-tools input[type=search]{flex:1;min-width:160px;padding:8px 12px;border:1px solid var(--border-strong);border-radius:10px;background:var(--surface);color:var(--ink)}
.nbt-ac-tools label{font-size:13px;color:var(--ink-soft);display:inline-flex;gap:6px;align-items:center}
.nbt-ac-list{display:grid;gap:5px;max-height:440px;overflow:auto;margin:8px 0;padding-right:4px}
.nbt-ac-row{display:flex;align-items:center;gap:9px;padding:8px 10px;border:1px solid var(--border);border-radius:10px;background:var(--surface-soft);cursor:pointer;font-size:13px}
.nbt-ac-row:hover{border-color:var(--blue)}.nbt-ac-row:has(input:checked){border-color:var(--blue);background:var(--blue-soft)}
.nbt-ac-name{flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;color:var(--ink);font-weight:600}
.nbt-ac-row small{color:var(--muted);white-space:nowrap}
.nbt-ac-go{width:100%;margin-top:6px}
.nbt-ac-addform{display:flex;gap:8px;flex-wrap:wrap}.nbt-ac-addform input{flex:1;min-width:200px;padding:10px 12px;border:1px solid var(--border-strong);border-radius:10px;background:var(--surface);color:var(--ink)}
.nbt-cat-adultlink{margin:0 0 12px;text-align:right}
@media (max-width:720px){.nbt-ac-grid{grid-template-columns:1fr}}
.nbt-ac-grid{grid-template-columns:minmax(0,1fr) minmax(0,1fr)}
.nbt-ac-panel,.nbt-ac-add{min-width:0;box-sizing:border-box}
.nbt-ac-row{min-width:0}
@media (max-width:720px){.nbt-ac-grid{grid-template-columns:minmax(0,1fr)}}

/* ===== VIP signup page ===== */
.nbt-vp-perks{display:grid;grid-template-columns:repeat(auto-fit,minmax(210px,1fr));gap:12px;list-style:none;margin:0;padding:0}
.nbt-vp-perks li{display:flex;gap:12px;align-items:flex-start;background:var(--surface-soft);border:1px solid var(--border);border-radius:var(--radius);padding:14px}
.nbt-vp-perks li.is-main{background:var(--blue-soft);border-color:var(--blue);grid-column:1/-1}
.nbt-vp-perks .pi{flex:0 0 40px;height:40px;border-radius:12px;display:grid;place-items:center;background:var(--blue);color:#fff;font-size:18px}
.nbt-vp-perks b{display:block;color:var(--ink);margin-bottom:2px}
.nbt-vp-perks small{color:var(--muted);line-height:1.5}
.nbt-vp-plans{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:14px}
.nbt-vp-plan{position:relative;display:block;cursor:pointer;background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);padding:20px 14px 16px;text-align:center;transition:border-color .15s,box-shadow .15s,transform .15s}
.nbt-vp-plan:hover{border-color:var(--blue);transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.nbt-vp-plan input{position:absolute;opacity:0;pointer-events:none}
.nbt-vp-plan:has(input:checked){border-color:var(--blue);background:var(--blue-soft);box-shadow:var(--focus)}
.nbt-vp-plan:has(input:checked)::after{content:"\2713";position:absolute;top:8px;right:10px;width:22px;height:22px;border-radius:50%;background:var(--blue);color:#fff;font-size:13px;display:grid;place-items:center}
.nbt-vp-plan .nm{display:block;font-weight:700;color:var(--ink-soft)}
.nbt-vp-plan .pr{display:block;font-size:2em;font-weight:800;color:var(--blue-ink);margin:6px 0 2px;line-height:1.1}
.nbt-vp-plan .pr small{font-size:.45em;font-weight:600;color:var(--muted)}
.nbt-vp-plan .pm{display:block;font-size:.85em;color:var(--muted)}
.nbt-vp-plan .tag{position:absolute;top:-11px;left:50%;transform:translateX(-50%);white-space:nowrap;background:var(--grad-brand);color:#fff;font-size:.75em;font-weight:700;border-radius:999px;padding:3px 12px}
.nbt-vp-save{display:inline-block;margin-top:6px;background:var(--green);color:#fff;font-size:.75em;font-weight:700;border-radius:999px;padding:2px 9px}
.nbt-vp-bank{border:2px dashed var(--border-strong);border-radius:var(--radius);padding:16px;text-align:center;background:var(--surface-soft)}
.nbt-vp-bank .no{font-size:1.7em;font-weight:800;letter-spacing:1px;color:var(--blue-ink)}

.nbt-vp-form{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:12px 14px;max-width:640px;margin:0 auto 14px}
.nbt-vp-f{min-width:0}
.nbt-vp-f.is-wide{grid-column:1/-1}
.nbt-vp-f label{display:block;font-weight:600;color:var(--ink-soft);margin-bottom:5px;font-size:.92em}
.nbt-vp-f label small{font-weight:400;color:var(--muted)}
.nbt-vp-f input[type=text],.nbt-vp-f input[type=file]{width:100%;box-sizing:border-box;padding:9px 12px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink)}
.nbt-vp-f input[disabled]{background:var(--surface-soft);color:var(--muted)}
.nbt-vp-dt{display:flex;gap:8px;align-items:center;flex-wrap:wrap}
.nbt-vp-dt input,.nbt-vp-dt select{padding:9px 8px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);text-align:center;box-sizing:border-box}
.nbt-vp-dt input[name=d],.nbt-vp-dt input[name=hh],.nbt-vp-dt input[name=mm]{width:4.2em}
.nbt-vp-dt input[name=y]{width:5.4em}
.nbt-vp-dt .sep{color:var(--muted)}
.nbt-vp-submit{display:block;margin:0 auto;min-width:220px}
@media(max-width:560px){.nbt-vp-form{grid-template-columns:1fr}}

/* ===== Seed Bonus page ===== */
.nbt-bn-hero{background:var(--grad-brand);color:#fff;border-radius:var(--radius);padding:20px;margin-bottom:14px;box-shadow:var(--premium-shadow-lg)}
.nbt-bn-top{display:flex;justify-content:space-between;align-items:flex-start;gap:10px;flex-wrap:wrap}
.nbt-bn-lbl{font-size:.9em;opacity:.9}
.nbt-bn-bal{font-size:2.4em;font-weight:800;line-height:1.1}
.nbt-bn-bal small{font-size:.4em;font-weight:600;opacity:.9}
.nbt-bn-pill{background:rgba(255,255,255,.2);border-radius:999px;padding:5px 12px;font-weight:700;font-size:.85em}
.nbt-bn-stats{display:grid;grid-template-columns:repeat(auto-fit,minmax(170px,1fr));gap:10px;margin-top:14px}
.nbt-bn-stats>div{background:rgba(255,255,255,.16);border-radius:var(--radius-sm);padding:12px}
.nbt-bn-stats span{display:block;font-size:.82em;opacity:.9}
.nbt-bn-stats b{display:block;font-size:1.3em;margin-top:2px}
.nbt-bn-stats b small{font-size:.6em;font-weight:500;opacity:.9}
.nbt-bn-stats em{display:block;font-style:normal;font-size:.8em;opacity:.9;margin-top:4px}
.nbt-bn-bar{display:block;height:7px;border-radius:99px;background:rgba(255,255,255,.28);margin-top:8px;overflow:hidden}
.nbt-bn-bar u{display:block;height:100%;background:#fff;border-radius:99px;text-decoration:none}
.nbt-bn-sec{margin-bottom:14px}
.nbt-bn-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:12px}
.nbt-bn-card{position:relative;text-align:center;background:var(--surface);border:2px solid var(--border);border-radius:var(--radius);padding:18px 10px 14px;transition:border-color .15s,transform .15s,box-shadow .15s}
.nbt-bn-card:not(.is-locked):hover{border-color:var(--blue);transform:translateY(-2px);box-shadow:var(--shadow-sm)}
.nbt-bn-card.is-best{border-color:var(--green);background:var(--surface-soft)}
.nbt-bn-card.is-locked{opacity:.65}
.nbt-bn-tag{position:absolute;top:-10px;left:50%;transform:translateX(-50%);background:var(--green);color:#fff;font-size:.72em;font-weight:700;border-radius:999px;padding:2px 12px}
.nbt-bn-size{font-size:1.6em;font-weight:800;color:var(--ink)}
.nbt-bn-cost{margin:4px 0 10px;color:var(--amber)}
.nbt-bn-cost b{font-size:1.1em}
.nbt-bn-cost small{color:var(--muted);margin-left:4px}
.nbt-bn-list{display:flex;flex-direction:column;gap:10px}
.nbt-bn-row{display:grid;grid-template-columns:minmax(0,1.6fr) minmax(0,1.2fr) auto;gap:12px;align-items:center;background:var(--surface-soft);border:1px solid var(--border);border-radius:var(--radius);padding:12px 14px}
.nbt-bn-row.is-locked{opacity:.7}
.nbt-bn-info{display:flex;gap:10px;align-items:center;min-width:0}
.nbt-bn-info .ic{font-size:1.6em}
.nbt-bn-info b{display:block;color:var(--ink)}
.nbt-bn-info small{display:block;color:var(--muted);line-height:1.4}
.nbt-bn-in{display:flex;gap:8px;flex-wrap:wrap}
.nbt-bn-in input,.nbt-bn-in select{flex:1 1 120px;min-width:0;padding:8px 10px;border:1px solid var(--border-strong);border-radius:var(--radius-sm);background:var(--surface);color:var(--ink);box-sizing:border-box}
.nbt-bn-act{display:flex;gap:10px;align-items:center;justify-content:flex-end}
.nbt-bn-price{font-weight:800;color:var(--amber);white-space:nowrap}
.nbt-bn-how{margin:0;padding-left:20px;line-height:1.8;color:var(--ink-soft)}
@media(max-width:700px){.nbt-bn-row{grid-template-columns:1fr}.nbt-bn-act{justify-content:space-between}}

.nbt-bn-flash{background:var(--blue-soft);border:1px solid var(--blue);color:var(--blue-ink);border-radius:var(--radius);padding:12px 16px;margin-bottom:14px;text-align:center}
.nbt-bn-ci{display:flex;flex-direction:column;gap:12px;align-items:center;text-align:center}
.nbt-bn-ci small{color:var(--muted)}
.nbt-bn-days{display:grid;grid-template-columns:repeat(7,minmax(0,1fr));gap:8px;width:100%;max-width:560px}
.nbt-bn-day{background:var(--surface-soft);border:2px solid var(--border);border-radius:var(--radius-sm);padding:8px 2px;display:flex;flex-direction:column;gap:2px}
.nbt-bn-day i{font-style:normal;font-size:.72em;color:var(--muted)}
.nbt-bn-day b{color:var(--amber)}
.nbt-bn-day em{font-style:normal;font-size:.68em;color:var(--green);font-weight:700}
.nbt-bn-day.is-on{border-color:var(--green);background:var(--blue-soft)}
.nbt-bn-day.is-on::after{content:"\2713";color:var(--green);font-weight:800}

.nbt-item-offers{max-width:650px;margin:16px auto 0}
.nbt-item-offers h2{font-size:1.05em;margin:0 0 8px;color:var(--ink)}
.nbt-item-offer{display:flex;justify-content:space-between;align-items:center;gap:10px;flex-wrap:wrap;background:var(--surface);border:1px solid var(--border);border-radius:var(--radius-sm);padding:10px 14px;margin-bottom:8px}
.nbt-item-offer form{display:flex;gap:6px}

/* ===== user class colors + rank tiers ===== */
.nbt-c0{color:#475569}
.nbt-c1{color:#0284c7}
.nbt-c2{color:#0e7490}
.nbt-c3{color:#15803d}
.nbt-c4{color:#4d7c0f}
.nbt-c5{color:#a16207}
.nbt-c6{color:#0f766e}
.nbt-c7{color:#7c3aed}
.nbt-c8{color:#c2410c}
.nbt-c9{color:#4338ca}
.nbt-c10{color:#be123c}
.nbt-c11{color:#b91c1c}
.nbt-c9,.nbt-c10,.nbt-c11{font-weight:700}
.nbt-t1{--tc:#64748b}
.nbt-t2{--tc:#4d7c0f}
.nbt-t3{--tc:#15803d}
.nbt-t4{--tc:#0284c7}
.nbt-t5{--tc:#0e7490}
.nbt-t6{--tc:#92400e}
.nbt-t7{--tc:#52525b}
.nbt-t8{--tc:#a16207}
.nbt-t9{--tc:#0369a1}
.nbt-t10{--tc:#4338ca}
.nbt-t11{--tc:#7c3aed}
.nbt-t12{--tc:#c2410c}
.nbt-t13{--tc:#be123c}
.nbt-t14{--tc:#6d28d9}
.nbt-t15{--tc:#a16207}
.nbt-tier{display:inline-flex;align-items:center;gap:4px;padding:2px 10px;border-radius:999px;font-size:.88em;font-weight:700;color:var(--tc);background:color-mix(in srgb,var(--tc) 12%,#fff);border:1px solid color-mix(in srgb,var(--tc) 35%,#fff);white-space:nowrap}
.nbt-t15{background:linear-gradient(135deg,#fef3c7,#fde68a);border-color:#d97706}
.nbt-rk-me{display:grid;grid-template-columns:minmax(0,1fr) minmax(0,1.2fr);gap:20px;align-items:center}
.nbt-rk-lbl{display:block;font-size:.85em;color:var(--muted);margin-bottom:4px}
.nbt-rk-big{font-size:1.5em;margin:4px 0 6px}
.nbt-rk-need{margin-top:8px;font-size:.88em;color:var(--ink-soft)}
.nbt-rk-bar{display:block;height:8px;border-radius:99px;background:var(--surface-blue);margin-top:4px;overflow:hidden}
.nbt-rk-bar u{display:block;height:100%;border-radius:99px;background:var(--blue);text-decoration:none}
.nbt-rk-mine{background:var(--blue-soft)}
@media(max-width:640px){.nbt-rk-me{grid-template-columns:1fr}}

.nbt-vipicon{display:inline-block;margin-left:3px;color:#c2410c;font-size:.9em;line-height:1}
.nbt-vipicon::before{content:"\f521";font-family:"Font Awesome 6 Free","Font Awesome 5 Free";font-weight:900}

/* VIP crown: gold, shimmering, with a twinkling spark */
.nbt-vipicon{position:relative;display:inline-block;margin-left:6px;font-size:1.05em;line-height:1;vertical-align:-1px;color:#d97706;filter:drop-shadow(0 0 3px rgba(245,158,11,.75))}
.nbt-vipicon::before{content:"\f521";font-family:"Font Awesome 6 Free","Font Awesome 5 Free";font-weight:900;background:linear-gradient(110deg,#a16207 0%,#f59e0b 28%,#fff3b0 46%,#f59e0b 62%,#a16207 100%);background-size:260% 100%;-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:nbt-vip-shine 2.6s linear infinite}
.nbt-vipicon::after{content:"\2726";position:absolute;top:-7px;right:-8px;font-size:.6em;color:#fbbf24;text-shadow:0 0 4px #f59e0b;animation:nbt-vip-twinkle 1.8s ease-in-out infinite}
@keyframes nbt-vip-shine{from{background-position:130% 0}to{background-position:-130% 0}}
@keyframes nbt-vip-twinkle{0%,100%{opacity:.15;transform:scale(.5) rotate(0)}50%{opacity:1;transform:scale(1.15) rotate(45deg)}}
@media (prefers-reduced-motion:reduce){.nbt-vipicon::before,.nbt-vipicon::after{animation:none}.nbt-vipicon::after{opacity:.9}}

/* VIP tooltip on hover/focus */
.nbt-vipicon .nbt-viptip{position:absolute;left:50%;bottom:calc(100% + 8px);transform:translateX(-50%) translateY(3px);padding:3px 9px;border-radius:7px;background:#1f2937;color:#fde68a;font:700 11px/1.3 system-ui,sans-serif;letter-spacing:.5px;white-space:nowrap;pointer-events:none;opacity:0;transition:opacity .15s,transform .15s;z-index:50;-webkit-text-fill-color:#fde68a;filter:none}
.nbt-vipicon .nbt-viptip::after{content:"";position:absolute;top:100%;left:50%;margin-left:-5px;border:5px solid transparent;border-top-color:#1f2937}
.nbt-vipicon:hover .nbt-viptip,.nbt-vipicon:focus .nbt-viptip{opacity:1;transform:translateX(-50%) translateY(0)}
.nbt-vipicon{filter:none}
.nbt-vipicon::before{filter:drop-shadow(0 0 3px rgba(245,158,11,.75))}

/* VIP crown, calm version: plain gold, no animation, no spark */
.nbt-vipicon{margin-left:5px;font-size:.95em;vertical-align:-1px}
.nbt-vipicon::before{background:linear-gradient(180deg,#fcd34d 0%,#d97706 100%);-webkit-background-clip:text;background-clip:text;-webkit-text-fill-color:transparent;color:transparent;animation:none;filter:drop-shadow(0 1px 0 rgba(120,53,15,.35))}
.nbt-vipicon::after{content:none;animation:none}

/* VIP badge: small gold "VIP" label (replaces the crown icon) */
.nbt-vipicon{display:inline-block;margin-left:6px;vertical-align:1px;filter:none}
.nbt-vipicon::before{content:"VIP";font-family:system-ui,-apple-system,"Segoe UI",sans-serif;font-weight:800;font-size:10px;line-height:1;letter-spacing:.6px;padding:3px 7px;border-radius:999px;display:inline-block;background:linear-gradient(180deg,#fde68a 0%,#f59e0b 100%);color:#5b3405;-webkit-text-fill-color:#5b3405;border:1px solid #d97706;box-shadow:0 1px 2px rgba(120,53,15,.25);filter:none;animation:none}
.nbt-vipicon::after{content:none}
.nbt-t13{background:linear-gradient(135deg,#fef3c7,#fde68a);border-color:#d97706;--tc:#92400e}

.nbt-pg-herostats{margin-left:auto;display:flex;gap:10px;flex-wrap:wrap}
.nbt-pg-herostats span{background:rgba(255,255,255,.16);border-radius:12px;padding:8px 14px;color:#fff;font-size:.9em;white-space:nowrap}
.nbt-pg-herostats b{font-size:1.4em;margin-right:3px}
@media(max-width:640px){.nbt-pg-herostats{margin-left:0;width:100%}}

/* ===== scroll performance =====
   - fixed body background forces a full repaint on every scroll frame
   - backdrop-filter on the sticky header re-blurs everything that scrolls under it, every frame
   - decorative backdrop blur on static chips/cards costs GPU for no visible gain
   - animated box-shadow repaints continuously; optimizeLegibility slows long Thai text layout */
body { background-attachment: scroll !important; text-rendering: auto !important; }
html { scroll-behavior: auto !important; }
.nbt-hd { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; background: rgba(255,255,255,.98) !important; box-shadow: 0 2px 10px rgba(30,64,175,.1) !important; }
*:not([class*="backdrop"]):not([class*="modal"]):not([class*="dialog"]):not([class*="overlay"]):not([class*="loading"]) { backdrop-filter: none !important; -webkit-backdrop-filter: none !important; }
.nbt-pm-notice { animation: none !important; }

/* browse: no underline when hovering a category (name, icon, checkbox row) */
.nbt-bw-check a, .nbt-bw-check a:hover, .nbt-bw-check a:focus,
.nbt-bw-catgo, .nbt-bw-catgo:hover, .nbt-bw-catgo:focus,
.nbt-bw-catlink, .nbt-bw-catlink:hover, .nbt-bw-catlink:focus,
.nbt-bw-caticon, .nbt-bw-caticon:hover { text-decoration: none !important; }

/* VIP badge: sit on the vertical middle of the name, in plain text and inside flex rows */
.nbt-vipicon{display:inline-flex;align-items:center;align-self:center;vertical-align:middle;line-height:1;position:relative;top:-1px}
.nbt-vipicon::before{display:inline-block;vertical-align:middle;line-height:1;margin:0}

.nbt-vipicon{margin-left:3px !important}

/* Shoutbox: "name : message" and a reply button on every message */
.nbt-shout-user::after { content: " :"; font-weight: 700; color: var(--muted); }
.nbt-shout-reply { order: 5; margin-left: auto; padding: 1px 9px; border: 1px solid var(--border-strong); border-radius: 999px; background: var(--surface); color: var(--blue-ink); font: 600 11px/1.6 inherit; cursor: pointer; opacity: .55; transition: opacity .15s, background .15s; white-space: nowrap; }
.nbt-shout-msg:hover .nbt-shout-reply, .nbt-shout-reply:focus { opacity: 1; background: var(--blue-soft); }
.nbt-shout-del, .nbt-shout-msg form { margin-left: 4px; }
@media (hover: none) { .nbt-shout-reply { opacity: 1; } }

/* Shoutbox reply bar above the input */
.nbt-reply-bar{display:flex;align-items:center;gap:10px;margin:0 0 8px;padding:8px 12px;border:1px solid var(--blue);border-left-width:4px;border-radius:10px;background:var(--blue-soft)}
.nbt-reply-bar[hidden]{display:none}
.nbt-reply-ic{font-size:1.2em;color:var(--blue-ink)}
.nbt-reply-txt{flex:1;min-width:0;display:flex;flex-direction:column;line-height:1.4}
.nbt-reply-txt b{font-size:12px;color:var(--blue-ink)}
.nbt-reply-txt span:last-child{color:var(--ink-soft);font-size:13px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}
.nbt-reply-bar button{border:0;background:transparent;color:var(--muted);font-size:16px;cursor:pointer;padding:2px 6px;border-radius:6px}
.nbt-reply-bar button:hover{background:rgba(0,0,0,.07);color:var(--ink)}
.nbt-shout-reply{opacity:.85 !important}

/* tiers 13-18: only the very top is gold */
.nbt-t13{background:color-mix(in srgb,var(--tc) 12%,#fff);border-color:color-mix(in srgb,var(--tc) 35%,#fff);--tc:#be123c}
.nbt-t14{--tc:#6d28d9}.nbt-t15{--tc:#0e7490;background:color-mix(in srgb,var(--tc) 12%,#fff);border-color:color-mix(in srgb,var(--tc) 35%,#fff)}
.nbt-t16{--tc:#c2410c}.nbt-t17{--tc:#4338ca}
.nbt-t18{--tc:#92400e;background:linear-gradient(135deg,#fef3c7,#fde68a);border-color:#d97706}

/* profile: pokdeng + casino cards side by side, equal height */
.nbt-profile-duo{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:18px;align-items:stretch}
.nbt-profile-duo>.nbt-card{height:100%;margin:0}
.nbt-profile-list .nbt-profile-sub{display:block;margin-top:2px;padding-top:8px;border-top:1px dashed var(--border);font-size:12px;font-weight:700;color:var(--muted);letter-spacing:.04em}
.nbt-profile-list .nbt-profile-sub span{color:var(--muted)}
@media(max-width:760px){.nbt-profile-duo{grid-template-columns:1fr}}

/* the two history cards span the whole hero grid (both columns) */
.nbt-profile-hero > .nbt-profile-duo { grid-column: 1 / -1; width: 100%; }

/* modern bottom-bar icons (replaces the old gif envelopes) */
.nbt-mail-ic{color:var(--blue);font-size:15px;vertical-align:-1px}
.nbt-mail-ic.is-new{color:#dc2626}

/* animated emoji (nbt-emoji.js): fixed box so swapping the glyph for the animation never shifts the layout */
.nbt-emo{display:inline-block;width:1.18em;height:1.18em;line-height:1.18em;text-align:center;vertical-align:-.2em;background:center/contain no-repeat;font-style:normal;overflow:hidden}
.nbt-emo.is-anim{color:transparent}
.nbt-emo-toggle{margin-left:12px;font-size:11px;opacity:.75}

/* bottom-bar icons: one size, one weight, same-width boxes */
.nbt-mail-ic{display:inline-block;width:20px;font-size:14px;line-height:1;text-align:center;vertical-align:-2px}
.nbt-mail-ic.fa-user-group{font-size:13px}

/* emoji picker + inline emoji spans */
.nbt-smile{font-size:24px;line-height:1;padding:4px 6px;cursor:pointer}
.nbt-e{display:inline-block;vertical-align:middle}

/* composer emoji picker: real emoji at a readable size; .nbt-emo never collapses even when the parent font-size is tiny */
.nbt-composer-emoji-item { font-size: 24px; line-height: 1; }
.nbt-emo { font-size: max(1em, 14px); }

/* composer picker cell: the emoji box fills the cell and centres its glyph/animation */
.nbt-composer-emoji-item .nbt-emo { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 24px; line-height: 1; overflow: visible; vertical-align: baseline; }
.nbt-smile .nbt-emo { display: flex; align-items: center; justify-content: center; width: 100%; height: 100%; font-size: 24px; line-height: 1; overflow: visible; }
.nbt-composer-emoji-item .nbt-emo.is-anim, .nbt-smile .nbt-emo.is-anim { background-size: 28px 28px; }

.nbt-composer-emoji-item, .nbt-smile { padding: 0 !important; }

/* Noto Color Emoji everywhere (static, no JS): same emoji look on every device */
body, body * { font-family: "IBM Plex Sans Thai", "Noto Sans Thai", "Sarabun", "Noto Color Emoji", system-ui, Tahoma, "Apple Color Emoji", "Segoe UI Emoji", sans-serif !important; }

/* check-in box now lives in the sidebar below the online list */
.nbt-shout-side .nbt-checkin-inline { margin-top: 14px; }
.nbt-shout-side .nbt-balance-row { flex-wrap: wrap; gap: 6px; }
.nbt-shout-side .nbt-streak { gap: 4px; }
.nbt-shout-side .nbt-checkin-btn { width: 100%; white-space: normal; }

/* ===== check-in box (sidebar): compact, no overflow ===== */
.nbt-shout-side .nbt-checkin-inline { padding: 16px; }
.nbt-shout-side .nbt-checkin-inline .nbt-panel-head { margin-bottom: 12px; padding-bottom: 10px; }
.nbt-shout-side .nbt-checkin-inline .nbt-panel-head h3 { font-size: 15px; }
.nbt-shout-side .nbt-streak { display: grid; grid-template-columns: repeat(7, minmax(0, 1fr)); gap: 5px; margin: 0 0 12px; }
.nbt-shout-side .nbt-streak-dot { display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 1px; min-width: 0; height: 46px; padding: 0; border-radius: 10px; }
.nbt-shout-side .nbt-streak-dot b { font-size: 13px; line-height: 1.1; }
.nbt-shout-side .nbt-streak-dot small { font-size: 9px; line-height: 1; letter-spacing: -.02em; }
.nbt-shout-side .nbt-balance-row { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin: 0 0 12px; }
.nbt-ci-stat { min-width: 0; padding: 8px 10px; border: 1px solid var(--border); border-radius: 12px; background: var(--surface-soft); }
.nbt-ci-stat small { display: block; color: var(--muted); font-size: 11px; line-height: 1.3; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.nbt-ci-stat b { display: block; margin-top: 2px; color: var(--ink); font-size: 14px; line-height: 1.3; }
.nbt-shout-side .nbt-checkin-inline .nbt-result { margin: 0 0 10px; padding: 9px 12px; font-size: 13px; line-height: 1.5; }
.nbt-shout-side .nbt-checkin-btn { width: 100%; margin: 0 0 8px; padding: 10px 12px; font-size: 13px; line-height: 1.4; }
.nbt-shout-side .nbt-rules-toggle { display: block; width: 100%; margin: 0; padding: 8px 12px; border: 1px dashed var(--border-strong); border-radius: 10px; background: transparent; color: var(--blue-ink); font-size: 12px; font-weight: 600; cursor: pointer; text-align: center; }
.nbt-shout-side .nbt-rules-toggle:hover { background: var(--blue-soft); }
.nbt-shout-side .nbt-checkin-rules { margin-top: 10px; font-size: 12px; line-height: 1.6; }

/* simple modal (rules popup) */
.nbt-modal { position: fixed; inset: 0; z-index: 3000; display: grid; place-items: center; padding: 16px; background: rgba(15,23,42,.55); }
.nbt-modal[hidden] { display: none; }
.nbt-modal-card { width: min(520px, 100%); max-height: 86vh; overflow: auto; padding: 20px 22px; border-radius: 18px; background: var(--surface); box-shadow: 0 24px 60px rgba(0,0,0,.35); animation: nbt-modal-in .16s ease-out; }
.nbt-modal-head { display: flex; align-items: center; justify-content: space-between; gap: 12px; margin-bottom: 12px; padding-bottom: 10px; border-bottom: 1px solid var(--border); }
.nbt-modal-head h3 { margin: 0; font-size: 17px; color: var(--ink); }
.nbt-modal-x { flex: none; width: 34px; height: 34px; padding: 0; border: 0; border-radius: 50%; background: var(--surface-soft); color: var(--muted); font-size: 16px; line-height: 1; cursor: pointer; }
.nbt-modal-x:hover { background: var(--blue-soft); color: var(--ink); }
.nbt-modal-card .nbt-bank-list { margin: 0 0 14px; padding-left: 20px; line-height: 1.75; font-size: 14px; color: var(--ink-soft); }
.nbt-modal-foot { text-align: right; }
@keyframes nbt-modal-in { from { opacity: 0; transform: translateY(8px) scale(.98); } to { opacity: 1; transform: none; } }

/* emoji: use each device's own colour emoji (Apple on iPhone/Mac, Noto on Android, Segoe on Windows). The Noto web font does not render in iOS Safari. */
body, body * { font-family: "IBM Plex Sans Thai", "Noto Sans Thai", "Sarabun", system-ui, Tahoma, "Apple Color Emoji", "Segoe UI Emoji", "Noto Color Emoji", sans-serif !important; }

.nbt-smilie-emo { display: block; font-size: 34px; line-height: 1.2; }

/* card/page headings: no legacy accent bar (the global h2 bar overlapped the first letter when padding is 0) */
main h2, .nbt-card-head h2, .nbt-tag-card-head h2 { box-shadow: none; background: none; border-radius: 0; }

/* forum post: sidebar stats centred, quote/edit actions always on the right (also on phones) */
.nbt-post-side-stats { text-align: center; }
.nbt-post-head { align-items: center; }
.nbt-post-actions { margin-left: auto !important; justify-content: flex-end; }

/* forum post sidebar: symmetrical padding so avatar + stats sit exactly in the middle of the column */
.nbt-post-side { box-sizing: border-box; padding-left: 14px; padding-right: 14px; }
.nbt-post-side-avatar { width: fit-content; max-width: 100%; margin-left: auto; margin-right: auto; }
.nbt-post-side-stats { margin: 0 auto; width: 100%; }
@media (max-width: 700px) { .nbt-post-side { padding-left: 0; padding-right: 0; } .nbt-post-side-stats { max-width: 340px; } }

/* Money / Gold chips are links now: pointer cursor + a clear hover */
a.nbt-stat-money, a.nbt-stat-gold { cursor: pointer; }

/* torrent rating: centred, big gold stars with partial fill */
.nbt-rate { display: flex; flex-direction: column; align-items: center; gap: 4px; padding: 6px 0 2px; text-align: center; }
.nbt-rate-stars { position: relative; display: inline-block; font-size: 38px; line-height: 1; letter-spacing: 5px; white-space: nowrap; }
.nbt-rate-stars .bg { color: #dfe5ef; }
.nbt-rate-stars .fg { position: absolute; left: 0; top: 0; width: var(--p, 0%); overflow: hidden; color: #f5a623; text-shadow: 0 2px 6px rgba(217,119,6,.35); }
.nbt-rate-score { font-size: 15px; color: var(--muted); }
.nbt-rate-score b { font-size: 26px; color: var(--ink); }
.nbt-rate-count { font-size: 13px; color: var(--muted); }
.nbt-rate-none, .nbt-rate-mine { text-align: center; }
.nbt-rate-form { justify-content: center; }

/* exchange rate tiles: two readable cards under the balances, never wider than the page */
.nbt-bank-hero > .nbt-bank-rate.nbt-rate-split { grid-column: 1 / -1; display: grid; grid-template-columns: repeat(auto-fit, minmax(230px, 1fr)); gap: 12px; padding: 0; border: 0; border-radius: 0; background: none; box-shadow: none; white-space: normal; }
.nbt-rate-tile { min-width: 0; padding: 12px 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--blue-soft); }
.nbt-rate-tile.is-back { background: #fff7e6; border-color: #f3dc9a; }
.nbt-rate-tile small { display: block; color: var(--muted); font-size: 12px; line-height: 1.4; }
.nbt-rate-tile strong { display: block; margin-top: 3px; color: var(--ink); font-size: 16px; line-height: 1.35; overflow-wrap: anywhere; }

/* exchange pages: balances share the width equally, rate tiles sit under them in the same 2 columns */
.nbt-bank-hero.nbt-hero-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.nbt-bank-hero.nbt-hero-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.nbt-bank-hero > .nbt-bank-rate { white-space: normal; border-radius: 16px; line-height: 1.5; }
@media (max-width: 700px) { .nbt-bank-hero.nbt-hero-2, .nbt-bank-hero.nbt-hero-3 { grid-template-columns: minmax(0, 1fr); } }

.nbt-bank-hero.nbt-hero-3 > .nbt-bank-rate { align-self: stretch; display: flex; align-items: center; }

/* group request: button bar + form */
.nbt-group-requestbar { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 10px; margin: 0 0 14px; padding: 12px 16px; border: 1px dashed var(--border-strong); border-radius: var(--radius); background: var(--surface-soft); }
.nbt-group-reqinfo { color: var(--ink-soft); font-size: 14px; }
.nbt-reqgroup-form { display: grid; gap: 8px; }
.nbt-reqgroup-form label { font-weight: 600; color: var(--ink-soft); font-size: 13px; }
.nbt-reqgroup-form label small { font-weight: 400; color: var(--muted); }
.nbt-reqgroup-form input[type=text], .nbt-reqgroup-form textarea { width: 100%; box-sizing: border-box; padding: 9px 12px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface); color: var(--ink); font: inherit; }
.nbt-reqgroup-bot { margin: 4px 0; }
.nbt-bc-own { display: flex; align-items: center; gap: 10px; flex-wrap: wrap; margin-bottom: 8px; }
.nbt-bc-own img { border-radius: 8px; border: 1px solid var(--border); }
.nbt-reqgroup-form .nbt-bc-input { max-width: 260px; }
.nbt-reqgroup-form label.nbt-reqgroup-confirm { display: flex; align-items: flex-start; gap: 8px; padding: 10px 12px; border-radius: 10px; background: var(--blue-soft); font-weight: 500; line-height: 1.5; cursor: pointer; }
.nbt-reqgroup-form label.nbt-reqgroup-confirm input { margin-top: 3px; flex: none; }

/* 18+ badge: a small centred pill (it used to stretch to the height of the neighbouring chip and look like a blob) */
.nbt-adult-badge { display: inline-flex; align-items: center; justify-content: center; align-self: center; height: auto; min-height: 0; padding: 3px 10px; border-radius: 999px; background: #dc2626; color: #fff; font-size: 11px; font-weight: 900; letter-spacing: .04em; line-height: 1.3; box-shadow: 0 0 0 2px rgba(255,255,255,.35); }

/* referral pages */
.nbt-rf-copy { display: flex; gap: 8px; margin: 4px 0 8px; }
.nbt-rf-copy input { flex: 1; min-width: 0; padding: 10px 12px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--surface-soft); color: var(--ink); font-size: 14px; }
.nbt-rf-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); gap: 12px; margin: 0 0 14px; }
.nbt-rf-stats > div { padding: 12px 14px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface); box-shadow: var(--shadow-sm); text-align: center; }
.nbt-rf-stats span { display: block; color: var(--muted); font-size: 12px; }
.nbt-rf-stats b { display: block; font-size: 24px; color: var(--ink); margin: 2px 0; }
.nbt-rf-stats small { color: var(--muted); font-size: 12px; }
.nbt-rf-miles { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 12px; }
.nbt-rf-mile { position: relative; padding: 12px 14px 16px; border: 1px solid var(--border); border-radius: 14px; background: var(--surface-soft); overflow: hidden; }
.nbt-rf-mile b { display: block; font-size: 18px; color: var(--ink); }
.nbt-rf-mile span { display: block; font-size: 13px; color: var(--ink-soft); margin: 2px 0 6px; }
.nbt-rf-mile small { color: var(--muted); font-size: 12px; }
.nbt-rf-mile i { position: absolute; left: 0; bottom: 0; height: 5px; background: var(--blue); border-radius: 0 4px 4px 0; }
.nbt-rf-mile.is-done { border-color: var(--green); background: var(--blue-soft); }
.nbt-rf-mile.is-done i { background: var(--green); }

.nbt-ref-invite { display: flex; align-items: center; gap: 12px; margin: 0 0 14px; padding: 12px 14px; border: 1px solid var(--border-strong); border-radius: var(--radius-sm); background: var(--blue-soft); text-align: left; }
.nbt-ref-invite .nbt-ref-ico { flex: none; width: 42px; height: 42px; display: flex; align-items: center; justify-content: center; font-size: 22px; border-radius: 50%; background: var(--surface); box-shadow: var(--shadow-sm); }
.nbt-ref-invite div { min-width: 0; display: flex; flex-direction: column; gap: 1px; }
.nbt-ref-invite small { font-size: 12px; color: var(--muted); }
.nbt-ref-invite b { font-size: 17px; line-height: 1.25; color: var(--blue-ink); overflow-wrap: anywhere; }
.nbt-ref-invite em { font-style: normal; font-size: 12.5px; color: var(--green); font-weight: 600; }

/* ===== เจ้าถิ่น (first 1000 members) ===== */
.nbt-house { display: inline-block; position: relative; margin-left: 5px; font-size: .95em; line-height: 1; vertical-align: -1px; }
.nbt-house::before { content: "\f015"; font-family: "Font Awesome 6 Free", "Font Awesome 5 Free"; font-weight: 900; color: var(--hc, #16a34a); }
.nbt-house-t1 { --hc: #d97706; } .nbt-house-t2 { --hc: #ca8a04; } .nbt-house-t3 { --hc: #7c3aed; } .nbt-house-t4 { --hc: #2563eb; } .nbt-house-t5 { --hc: #16a34a; }
.nbt-house-t1::before, .nbt-house-t2::before { filter: drop-shadow(0 0 3px rgba(245,158,11,.6)); }
.nbt-house .nbt-housetip { position: absolute; left: 50%; bottom: calc(100% + 8px); transform: translateX(-50%) translateY(3px); padding: 3px 9px; border-radius: 7px; background: #1f2937; color: #fff; font: 700 11px/1.3 system-ui, sans-serif; white-space: nowrap; pointer-events: none; opacity: 0; transition: opacity .15s, transform .15s; z-index: 50; }
.nbt-house:hover .nbt-housetip, .nbt-house:focus .nbt-housetip { opacity: 1; transform: translateX(-50%) translateY(0); }
.nbt-founder-banner .nbt-ref-ico { background: var(--surface); }
.nbt-fd-me { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; }
.nbt-fd-me .nbt-house { font-size: 28px; margin: 0; }
.nbt-fd-me b { display: block; font-size: 17px; color: var(--ink); }
.nbt-fd-me span { color: var(--muted); font-size: 13px; }
.nbt-fd-bar { height: 10px; border-radius: 99px; background: var(--surface-soft); border: 1px solid var(--border); overflow: hidden; }
.nbt-fd-bar span { display: block; height: 100%; background: linear-gradient(90deg, var(--blue), var(--cyan)); }
.nbt-fd-count { margin: 8px 0 0; font-size: 13px; color: var(--muted); }
.nbt-fd-h { margin: 0 0 12px; font-size: 16px; color: var(--ink); }
.nbt-fd-tiers { display: grid; gap: 8px; }
.nbt-fd-tier { display: flex; align-items: center; gap: 12px; padding: 10px 12px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface-soft); }
.nbt-fd-tier.is-me { border-color: var(--blue); background: var(--blue-soft); }
.nbt-fd-tier .nbt-house { font-size: 24px; margin: 0; flex: none; }
.nbt-fd-tier b { display: block; color: var(--ink); }
.nbt-fd-tier small { display: block; color: var(--muted); font-size: 12px; }
.nbt-fd-tier em { display: block; font-style: normal; font-size: 12.5px; color: var(--ink-soft); margin-top: 2px; }
.nbt-fd-note { margin: 10px 0 0; font-size: 12.5px; color: var(--muted); }
.nbt-fd-list { display: grid; grid-template-columns: repeat(auto-fill, minmax(190px, 1fr)); gap: 6px; }
.nbt-fd-item { display: flex; align-items: center; gap: 8px; padding: 6px 10px; border: 1px solid var(--border); border-radius: var(--radius-sm); background: var(--surface); text-decoration: none; min-width: 0; }
.nbt-fd-item:hover { border-color: var(--blue); }
.nbt-fd-no { flex: none; font-size: 11px; color: var(--muted); font-variant-numeric: tabular-nums; }
.nbt-fd-name { flex: 1; min-width: 0; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; font-weight: 600; }
.nbt-fd-item .nbt-house { margin: 0; flex: none; }