/* ==========================================================================
   Nebula for NamelessMC — cinematic, high-contrast "network landing page" look.
   Colours / fonts / radius are injected as CSS variables by PHP (Nebula::themeCss).
   ========================================================================== */

:root {
    --nb-primary: #9d4dff; --nb-primary-rgb: 157,77,255; --nb-primary-600: #7a2fe0; --nb-primary-300: #c9a0ff; --nb-on-primary: #ffffff;
    --nb-accent: #22d3ee; --nb-accent-rgb: 34,211,238;
    --nb-radius: 6px; --nb-radius-sm: 4px;
    --nb-font: 'Inter', system-ui, sans-serif;
    --nb-font-head: 'Pixelify Sans', 'Space Grotesk', system-ui, sans-serif;
    --nb-font-mono: 'JetBrains Mono', ui-monospace, SFMono-Regular, Menlo, monospace;
    --nb-container: 1280px;

    /* light surfaces */
    --nb-bg: #efe9f8; --nb-panel: #e6def2; --nb-surface: #ffffff; --nb-surface-2: #f5f0fb;
    --nb-border: rgba(10, 20, 5, .12);
    --nb-text: #0e140b; --nb-muted: #566052; --nb-mist: #2c3527;
    --nb-shadow: 0 1px 2px rgba(10,20,5,.06), 0 12px 30px -14px rgba(10,20,5,.22);
    --nb-nav-bg: rgba(238, 241, 234, .86);
    --nb-ok: #1f9d3a; --nb-off: #e0483d;
}
body.dark {
    --nb-bg: #06040d; --nb-panel: #0a0714; --nb-surface: #0e0a1c; --nb-surface-2: #150f28;
    --nb-border: rgba(170, 120, 255, .16);
    --nb-text: #f1ecfb; --nb-muted: #a59cbd; --nb-mist: #cfc6e6;
    --nb-shadow: 0 1px 2px rgba(0,0,0,.4), 0 18px 40px -16px rgba(0,0,0,.65);
    --nb-nav-bg: rgba(6, 4, 13, .88);
    color-scheme: dark;
}

/* ---------- base ---------- */
html { scroll-behavior: smooth; height: auto !important; }
body.nebula { height: auto !important; font-family: var(--nb-font); background: var(--nb-bg); color: var(--nb-text); -webkit-font-smoothing: antialiased; line-height: 1.6; min-height: 100vh; overflow-x: hidden; }
body.nebula ::selection { background: var(--nb-primary); color: var(--nb-on-primary); }
body.nebula h1, body.nebula h2, body.nebula h3, body.nebula h4, body.nebula h5, body.nebula .ui.header { font-family: var(--nb-font-head); color: var(--nb-text); font-weight: 700; letter-spacing: -.03em; line-height: 1.02; }
body.nebula a { color: var(--nb-primary-600); }
body.dark.nebula a { color: var(--nb-primary); }
body.nebula a:hover { color: var(--nb-text); }
body.nebula :focus-visible { outline: 2px solid var(--nb-primary); outline-offset: 3px; }
.nb-container { width: 100%; max-width: var(--nb-container); margin: 0 auto; padding: 0 32px; }
.nb-container--narrow { max-width: 860px; }
.nb-center { text-align: center; }
.nb-muted { color: var(--nb-muted); }
.nb-small { font-size: .875rem; }
.nb-mono { font-family: var(--nb-font-mono); font-variant-numeric: tabular-nums; }
.nb-accent { color: var(--nb-primary-600); } body.dark .nb-accent { color: var(--nb-primary); }
body.nebula #wrapper, .nb-wrapper { background: transparent; }
.nb-dark-ctx { --nb-text: #f1ecfb; --nb-muted: #cdc3e6; color: #fff; }

/* film grain + blueprint grid */
.nb-grain .nb-hero:before, .nb-grain .nb-banner:before, .nb-grain .nb-feature-img:before { content: ''; position: absolute; inset: 0; z-index: 3; pointer-events: none; opacity: .45; mix-blend-mode: overlay;
    background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='140' height='140'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.9' numOctaves='2' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='140' height='140' filter='url(%23n)' opacity='.32'/%3E%3C/svg%3E"); }
.nb-blueprint { background-image: linear-gradient(rgba(255,255,255,.045) 1px, transparent 1px), linear-gradient(90deg, rgba(255,255,255,.045) 1px, transparent 1px); background-size: 44px 44px; }
body:not(.dark) .nb-blueprint { background-image: linear-gradient(rgba(10,20,5,.06) 1px, transparent 1px), linear-gradient(90deg, rgba(10,20,5,.06) 1px, transparent 1px); }

/* ---------- tags, pills, dots ---------- */
.nb-eyebrow, .nb-tag { display: inline-flex; align-items: center; gap: .55rem; padding: .38rem .9rem; border-radius: 999px; border: 1px solid var(--nb-border); background: rgba(127,127,127,.08);
    font-family: var(--nb-font-head); font-size: .7rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--nb-primary-600); }
body.dark .nb-eyebrow, body.dark .nb-tag { color: var(--nb-primary); }
.nb-eyebrow:before { content: ''; width: 6px; height: 6px; border-radius: 50%; background: currentColor; }
.nb-dot { width: 8px; height: 8px; border-radius: 50%; background: var(--nb-primary); display: inline-block; flex: none; }
.nb-pulse { animation: nb-pulse 2s ease-out infinite; }
@keyframes nb-pulse { 0%,100% { box-shadow: 0 0 0 0 rgba(var(--nb-primary-rgb), .55); } 60% { box-shadow: 0 0 0 7px rgba(var(--nb-primary-rgb), 0); } }
.nb-pill { display: inline-flex; align-items: center; gap: .4rem; padding: .32rem .75rem; border-radius: 999px; background: var(--nb-primary); color: var(--nb-on-primary); font-family: var(--nb-font-head); font-size: .62rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; }
.nb-pill--glass { background: rgba(0,0,0,.6); color: #fff; backdrop-filter: blur(8px); font-family: var(--nb-font-mono); letter-spacing: 0; text-transform: none; font-size: .74rem; font-weight: 500; }
.nb-chip { display: inline-flex; align-items: center; gap: .5rem; padding: .4rem .9rem; border-radius: 999px; background: rgba(127,127,127,.1); border: 1px solid var(--nb-border); font-family: var(--nb-font-mono); font-size: .78rem; }
.nb-chip--ok .nb-dot { background: var(--nb-ok); } .nb-chip--off .nb-dot { background: var(--nb-off); }

/* ---------- buttons ---------- */
.nb-btn, body.nebula .ui.button { display: inline-flex; align-items: center; justify-content: center; gap: .6rem; font-family: var(--nb-font-head); font-weight: 700; font-size: .78rem; letter-spacing: .13em; text-transform: uppercase; line-height: 1;
    padding: 1rem 1.5rem; border-radius: 12px; border: 1px solid transparent; cursor: pointer; text-decoration: none; transition: background .15s, color .15s, border-color .15s, transform .1s; margin: 0; }
.nb-btn:active, body.nebula .ui.button:active { transform: scale(.98); }
.nb-btn--sm { padding: .65rem 1rem; font-size: .7rem; } .nb-btn--lg { padding: 1.15rem 1.8rem; font-size: .82rem; } .nb-btn--block { width: 100%; }
.nb-btn--primary, body.nebula .ui.primary.button, body.nebula .ui.green.button, body.nebula .ui.positive.button, body.nebula .ui.blue.button { background: var(--nb-primary); color: var(--nb-on-primary) !important; }
.nb-btn--primary:hover, body.nebula .ui.primary.button:hover, body.nebula .ui.green.button:hover { background: var(--nb-primary-300); color: #0a0614 !important; }
body:not(.dark) .nb-btn--primary:hover, body:not(.dark).nebula .ui.primary.button:hover { background: var(--nb-text); color: var(--nb-bg) !important; }
.nb-btn--ghost, body.nebula .ui.basic.button, body.nebula .ui.default.button { background: transparent; color: var(--nb-text) !important; border-color: rgba(127,127,127,.35); box-shadow: none !important; }
.nb-btn--ghost:hover, body.nebula .ui.basic.button:hover, body.nebula .ui.default.button:hover { border-color: var(--nb-primary); color: var(--nb-primary-600) !important; background: transparent; }
body.dark .nb-btn--ghost:hover { color: var(--nb-primary) !important; }
.nb-btn--light { background: #fff; color: #0a0614 !important; } .nb-btn--light:hover { background: var(--nb-primary); }
.nb-btn--outline-light { background: transparent; color: #fff !important; border-color: rgba(255,255,255,.4); } .nb-btn--outline-light:hover { border-color: var(--nb-primary); color: var(--nb-primary) !important; }
body.nebula .ui.red.button, body.nebula .ui.negative.button { background: #e0483d; color: #fff !important; }
.nb-iconbtn, body.nebula .ui.icon.button.nb-iconbtn { display: inline-grid; place-items: center; width: 42px; height: 42px; padding: 0; margin: 0; background: transparent; border: 1px solid var(--nb-border); border-radius: 12px; color: var(--nb-text) !important; cursor: pointer; }
.nb-iconbtn:hover { border-color: var(--nb-primary); }
.nb-iconbtn i.icon { margin: 0; }
.nb-ico-light { display: none; } body.dark .nb-ico-dark { display: none; } body.dark .nb-ico-light { display: inline; }

/* IP copy button */
.nb-ip { display: inline-flex; align-items: center; gap: .8rem; padding: .62rem .85rem .62rem 1rem; border-radius: 12px; border: 1px solid rgba(255,255,255,.16); background: rgba(255,255,255,.07); backdrop-filter: blur(10px); color: #fff; cursor: pointer; transition: border-color .15s, background .15s, transform .1s; }
body:not(.dark) .nb-nav .nb-ip, body:not(.dark) .nb-card .nb-ip { color: var(--nb-text); border-color: var(--nb-border); background: var(--nb-surface-2); }
.nb-ip:hover { border-color: rgba(var(--nb-primary-rgb), .65); background: rgba(255,255,255,.1); }
.nb-ip:active { transform: scale(.98); }
.nb-ip__text { font-family: var(--nb-font-mono); font-weight: 700; font-size: .95rem; letter-spacing: -.01em; }
.nb-ip__btn { display: inline-flex; align-items: center; gap: .4rem; padding: .4rem .7rem; border-radius: 9px; background: rgba(255,255,255,.12); font-family: var(--nb-font-head); font-size: .66rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; transition: background .15s, color .15s; }
body:not(.dark) .nb-nav .nb-ip__btn, body:not(.dark) .nb-card .nb-ip__btn { background: rgba(10,20,5,.08); }
.nb-ip:hover .nb-ip__btn { background: var(--nb-primary); color: var(--nb-on-primary); }
.nb-ip.is-copied .nb-ip__btn { background: var(--nb-primary); color: var(--nb-on-primary); }
.nb-ip--lg { padding: .9rem 1rem .9rem 1.3rem; } .nb-ip--lg .nb-ip__text { font-size: 1.2rem; } .nb-ip--lg .nb-ip__btn { padding: .55rem .9rem; }
.nb-ip--block { width: 100%; justify-content: space-between; }

/* ---------- announcement ---------- */
.nb-announce { background: var(--nb-primary); color: var(--nb-on-primary); font-family: var(--nb-font-head); font-size: .72rem; font-weight: 700; letter-spacing: .1em; text-transform: uppercase; padding: .6rem 0; text-align: center; position: relative; z-index: 70; }
.nb-announce a { color: inherit !important; margin-left: .9rem; text-decoration: underline; text-underline-offset: 3px; }
.nb-announce--subtle { background: rgba(var(--nb-primary-rgb), .14); color: var(--nb-text); }
.nb-announce--gradient { background: linear-gradient(90deg, var(--nb-primary), var(--nb-accent)); }

/* ---------- navbar ---------- */
.nb-nav { position: sticky; top: 0; z-index: 60; background: var(--nb-nav-bg); backdrop-filter: saturate(160%) blur(18px); -webkit-backdrop-filter: saturate(160%) blur(18px); border-bottom: 1px solid var(--nb-border); transition: background .25s, border-color .25s; }
body.nb-nav-overlay.nb-home .nb-nav { position: fixed; left: 0; right: 0; top: 0; background: transparent; border-color: transparent; backdrop-filter: none; -webkit-backdrop-filter: none; }
body.nb-nav-overlay.nb-home .nb-nav.nb-nav--scrolled { background: var(--nb-nav-bg); border-color: var(--nb-border); backdrop-filter: saturate(160%) blur(18px); -webkit-backdrop-filter: saturate(160%) blur(18px); }
body.nb-nav-overlay.nb-home:not(.nb-scrolled) .nb-nav { --nb-text: #fff; }
.nb-nav__inner { display: flex; align-items: center; gap: 1.6rem; min-height: 72px; }
.nb-logo { display: inline-flex; align-items: center; gap: .65rem; color: var(--nb-text) !important; text-decoration: none; line-height: 1; }
.nb-logo img { max-height: 40px; }
.nb-logo svg { width: 36px; height: 36px; flex: none; }
.nb-cube-top { fill: var(--nb-primary-300); } .nb-cube-l { fill: var(--nb-primary); } .nb-cube-r { fill: var(--nb-primary-600); } .nb-cube-line { stroke: rgba(6,4,13,.55); }
.nb-logo__main { display: block; font-family: var(--nb-font-head); font-weight: 700; font-size: 1.2rem; letter-spacing: -.03em; text-transform: uppercase; }
.nb-logo__sub { display: block; margin-top: .22rem; font-family: var(--nb-font-mono); font-size: .62rem; letter-spacing: .22em; text-transform: uppercase; color: var(--nb-primary); }
body:not(.dark) .nb-nav .nb-logo__sub { color: var(--nb-primary-600); }
.nb-nav__links { display: flex; align-items: center; gap: .15rem; flex: 1; margin-left: .6rem; }
.nb-nav__links .item, .nb-nav__item { display: inline-flex; align-items: center; gap: .4rem; padding: .55rem .85rem; border-radius: 10px; color: color-mix(in srgb, var(--nb-text) 68%, transparent) !important; font-family: var(--nb-font-head); font-size: .72rem; font-weight: 700; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; cursor: pointer; transition: color .15s; }
.nb-nav__links .item:hover { color: var(--nb-primary) !important; background: transparent; }
.nb-nav__links .item.active { color: var(--nb-primary) !important; }
body:not(.dark) .nb-nav__links .item:hover, body:not(.dark) .nb-nav__links .item.active { color: var(--nb-primary-600) !important; }
.nb-nav__links .ui.dropdown .menu { border-radius: 14px; border: 1px solid var(--nb-border); background: var(--nb-surface); box-shadow: var(--nb-shadow); margin-top: 8px; }
.nb-nav__links .ui.dropdown .menu .item { color: var(--nb-text) !important; padding: .7rem 1rem !important; display: flex; letter-spacing: .06em; }
.nb-nav__links .ui.dropdown .menu .item:hover { background: var(--nb-surface-2) !important; }
.nb-nav__links .ui.dropdown .menu .header { color: var(--nb-muted); font-size: .66rem; padding: .5rem 1rem 0; }
.nb-nav__links .item i.icon { margin: 0; }
.nb-nav__right { display: flex; align-items: center; gap: .55rem; margin-left: auto; }
.nb-live { display: inline-flex; align-items: center; gap: .55rem; padding: .5rem .9rem; border-radius: 999px; border: 1px solid var(--nb-border); background: rgba(0,0,0,.35); color: #fff; font-family: var(--nb-font-mono); font-size: .75rem; }
body:not(.dark) .nb-nav .nb-live { background: var(--nb-surface-2); color: var(--nb-text); }
.nb-nav__toggle { display: none; background: transparent; border: 1px solid var(--nb-border); color: var(--nb-text); width: 42px; height: 42px; border-radius: 12px; margin-left: auto; font-size: 1.05rem; }
.nb-account.ui.label, body.nebula .ui.medium.image.label.nb-account { background: rgba(127,127,127,.12) !important; color: var(--nb-text) !important; border: 1px solid var(--nb-border); border-radius: 999px; padding: .3rem .9rem .3rem .3rem !important; font-weight: 600; }
.nb-account img { border-radius: 50% !important; }
body.nebula .ui.popup { border-radius: 14px; background: var(--nb-surface); color: var(--nb-text); border: 1px solid var(--nb-border); box-shadow: var(--nb-shadow); }
body.nebula .ui.popup:before { background: var(--nb-surface); box-shadow: none; border-color: var(--nb-border); }
body.nebula .ui.popup .header, body.nebula .ui.popup .ui.header { color: var(--nb-text); }
body.nebula .ui.link.list .item, body.nebula .ui.link.list a.item { color: var(--nb-muted) !important; }
body.nebula .ui.link.list a.item:hover { color: var(--nb-primary-600) !important; }
body.nebula .ui.divider { border-color: var(--nb-border); }

/* ---------- inner page header ---------- */
.nb-page-head { position: relative; padding: 3.2rem 0 2.2rem; margin-bottom: 2rem; border-bottom: 1px solid var(--nb-border); overflow: hidden;
    background: radial-gradient(60% 140% at 0% 0%, rgba(var(--nb-primary-rgb), .14), transparent 60%), var(--nb-panel); }
.nb-page-head h1 { font-size: clamp(2rem, 4vw, 3.2rem); margin: 0; text-transform: uppercase; }
.nb-main { min-height: 60vh; }
.nb-content { padding-bottom: 4rem; }
.nb-notices { max-width: var(--nb-container); margin: 0 auto; padding: 0 32px; }
body.nb-home .nb-notices { position: absolute; z-index: 50; top: 84px; left: 0; right: 0; margin: 0 auto; }
.nb-notices .ui.message:first-child { margin-top: 1rem; }
body.nebula .ui.container.nb-content { width: 100% !important; max-width: var(--nb-container) !important; margin: 0 auto !important; padding: 0 32px; }

/* ---------- hero (full-bleed, cinematic) ---------- */
.nb-hero { position: relative; overflow: hidden; isolation: isolate; color: #fff; min-height: 100svh; display: flex; flex-direction: column; justify-content: center; }
.nb-hero--tall { min-height: 100svh; } .nb-hero--normal { min-height: 720px; } .nb-hero--short { min-height: 560px; }
.nb-hero__bg { position: absolute; inset: 0; z-index: -2; background:
    radial-gradient(60% 70% at 18% 8%, rgba(var(--nb-primary-rgb), .28), transparent 62%),
    radial-gradient(50% 60% at 92% 22%, rgba(var(--nb-accent-rgb), .2), transparent 62%), #06040d; background-size: cover; background-position: center; }
.nb-hero[style*="--nb-hero-image"] .nb-hero__bg { background: var(--nb-hero-image) center / cover no-repeat; }
.nb-hero__shade { position: absolute; inset: 0; z-index: -1; background: linear-gradient(180deg, rgba(6,4,13,.78), rgba(6,4,13,.35) 45%, #06040d), linear-gradient(90deg, rgba(6,4,13,.85), rgba(6,4,13,.3) 55%, transparent); }
body:not(.dark) .nb-hero__shade { background: linear-gradient(180deg, rgba(6,4,13,.78), rgba(6,4,13,.35) 45%, rgba(6,4,13,.92)), linear-gradient(90deg, rgba(6,4,13,.85), rgba(6,4,13,.3) 55%, transparent); }
.nb-hero__grid { position: absolute; inset: 0; z-index: -1; opacity: .6; mask-image: radial-gradient(70% 70% at 30% 30%, #000, transparent 75%); -webkit-mask-image: radial-gradient(70% 70% at 30% 30%, #000, transparent 75%); }
.nb-hero__inner { position: relative; z-index: 4; display: flex; flex-direction: column; align-items: flex-start; padding-top: 9rem; padding-bottom: 5rem; }
.nb-hero__badges { display: flex; flex-wrap: wrap; align-items: center; gap: .75rem; }
.nb-live-badge { display: inline-flex; align-items: center; gap: .7rem; padding: .35rem 1rem .35rem .4rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.16); background: rgba(0,0,0,.55); backdrop-filter: blur(10px); }
.nb-live-badge b { display: inline-flex; align-items: center; gap: .4rem; padding: .3rem .7rem; border-radius: 999px; background: var(--nb-primary); color: var(--nb-on-primary); font-family: var(--nb-font-head); font-size: .62rem; letter-spacing: .14em; text-transform: uppercase; }
.nb-live-badge b i { width: 6px; height: 6px; border-radius: 50%; background: currentColor; animation: nb-blink 1.4s infinite; }
@keyframes nb-blink { 50% { opacity: .3; } }
.nb-live-badge span { font-family: var(--nb-font-mono); font-size: .82rem; font-weight: 500; }
.nb-season-badge { padding: .55rem 1rem; border-radius: 999px; border: 1px solid rgba(255,255,255,.16); background: rgba(0,0,0,.55); backdrop-filter: blur(10px); font-family: var(--nb-font-head); font-size: .62rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: rgba(255,255,255,.85); }
.nb-hero__title { margin: 1.6rem 0 0; max-width: 16ch; font-size: clamp(3rem, 9.5vw, 7.6rem); line-height: .93; letter-spacing: -.04em; text-transform: uppercase; color: #fff !important; }
.nb-hero__title .nb-accent { color: var(--nb-primary); display: block; }
.nb-hero__sub { margin: 1.4rem 0 0; max-width: 40rem; font-size: clamp(1rem, 1.5vw, 1.15rem); color: rgba(255,255,255,.78); }
.nb-hero__actions { margin-top: 2.2rem; display: flex; flex-wrap: wrap; align-items: center; gap: 1rem; }
.nb-hero__stats { margin-top: 3.4rem; display: grid; grid-template-columns: repeat(4, 1fr); gap: 1px; max-width: 52rem; width: 100%; border: 1px solid rgba(255,255,255,.12); border-radius: var(--nb-radius); overflow: hidden; background: rgba(255,255,255,.12); backdrop-filter: blur(10px); }
.nb-hero__stats div { background: rgba(0,0,0,.55); padding: 1.1rem 1.3rem; }
.nb-hero__stats strong { display: block; font-family: var(--nb-font-head); font-size: clamp(1.4rem, 2.4vw, 1.9rem); letter-spacing: -.03em; color: #fff; }
.nb-hero__stats span { display: block; margin-top: .25rem; font-family: var(--nb-font-head); font-size: .6rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: rgba(255,255,255,.55); }

/* ---------- marquee ---------- */
.nb-marquee { overflow: hidden; border-block: 1px solid var(--nb-border); background: var(--nb-primary); padding: .95rem 0; color: var(--nb-on-primary); }
.nb-marquee__track { display: flex; width: max-content; align-items: center; gap: 2rem; padding-right: 2rem; animation: nb-marquee 28s linear infinite; }
.nb-marquee__track span { display: inline-flex; align-items: center; gap: 2rem; font-family: var(--nb-font-head); font-weight: 700; font-size: .85rem; letter-spacing: .22em; text-transform: uppercase; white-space: nowrap; }
@keyframes nb-marquee { to { transform: translateX(-50%); } }

/* ---------- sections ---------- */
.nb-section { padding: clamp(3.5rem, 8vw, 7rem) 0; position: relative; }
.nb-bg-alt { background: var(--nb-panel); border-block: 1px solid var(--nb-border); }
.nb-bg-glow { background: radial-gradient(60% 80% at 50% 0%, rgba(var(--nb-primary-rgb), .16), transparent 70%); }
.nb-section--stats, .nb-section--partners { padding: 2rem 0; }
.nb-section__head { max-width: 760px; margin: 0 0 3rem; }
.nb-section__head.nb-center, .nb-center .nb-section__head { margin-inline: auto; text-align: center; }
.nb-section__head h2 { font-size: clamp(2.2rem, 5.2vw, 4rem); margin: 1rem 0 .9rem; }
.nb-section__head p { font-size: 1.05rem; margin: 0; max-width: 46ch; }
.nb-section__head[data-center] { text-align: center; margin-inline: auto; } .nb-section__head[data-center] p { margin-inline: auto; }
.nb-hl { color: var(--nb-primary-600); } body.dark .nb-hl { color: var(--nb-primary); }
.nb-grid { display: grid; gap: 1.25rem; }
.nb-grid--2 { grid-template-columns: repeat(2, 1fr); } .nb-grid--3 { grid-template-columns: repeat(3, 1fr); } .nb-grid--4 { grid-template-columns: repeat(4, 1fr); }
.nb-card { background: var(--nb-surface); border: 1px solid var(--nb-border); border-radius: var(--nb-radius); padding: 1.6rem; transition: border-color .2s, transform .25s; }
.nb-card:hover { border-color: rgba(var(--nb-primary-rgb), .45); }
.nb-card h3 { margin: 0 0 .45rem; font-size: 1.1rem; letter-spacing: -.02em; line-height: 1.2; }
.nb-card p { margin: 0; color: var(--nb-muted); font-size: .94rem; }
.nb-reveal { opacity: 0; transform: translateY(26px); transition: opacity .65s cubic-bezier(.22,.61,.36,1), transform .65s cubic-bezier(.22,.61,.36,1); }
.nb-reveal.is-in { opacity: 1; transform: none; }
.nb-no-anim .nb-reveal { opacity: 1; transform: none; transition: none; }
.nb-icon { display: inline-grid; place-items: center; width: 42px; height: 42px; border-radius: 12px; background: rgba(var(--nb-primary-rgb), .14); color: var(--nb-primary-600); font-size: 1.05rem; margin-bottom: 1rem; }
body.dark .nb-icon { color: var(--nb-primary); }
.nb-icon--sm { width: 38px; height: 38px; margin-bottom: .5rem; } .nb-icon i { margin: 0; }
.nb-feature:hover { transform: translateY(-3px); }
.nb-feature h3 { font-size: 1.05rem; } .nb-feature p { font-size: .88rem; }

/* features split (cards + feature image) */
.nb-split { display: grid; grid-template-columns: 1fr 1fr; gap: 3.5rem; align-items: stretch; }
.nb-split .nb-grid { margin-top: 2rem; grid-template-columns: repeat(2, 1fr); }
.nb-feature-img { position: relative; min-height: 440px; overflow: hidden; border-radius: var(--nb-radius); border: 1px solid var(--nb-border); background: var(--nb-surface-2) center / cover no-repeat; display: flex; flex-direction: column; justify-content: flex-end; isolation: isolate; }
.nb-feature-img:after { content: ''; position: absolute; inset: 0; z-index: 1; background: linear-gradient(0deg, rgba(0,0,0,.92), rgba(0,0,0,.25) 55%, transparent); }
.nb-feature-img > div { position: relative; z-index: 4; padding: 2rem; color: #fff; }
.nb-feature-img h3 { color: #fff !important; font-size: clamp(1.8rem, 3vw, 2.5rem); margin: .8rem 0 .5rem; }
.nb-feature-img p { color: rgba(255,255,255,.75); max-width: 30rem; margin: 0; }

/* ---------- game modes (tall image cards) ---------- */
.nb-modes { display: grid; grid-template-columns: repeat(3, 1fr); gap: 1.25rem; }
.nb-mode { position: relative; display: block; overflow: hidden; border-radius: var(--nb-radius); border: 1px solid var(--nb-border); aspect-ratio: 3/4; color: #fff !important; text-decoration: none; background: var(--nb-surface-2); isolation: isolate; transition: border-color .2s; }
.nb-mode:hover { border-color: rgba(var(--nb-primary-rgb), .55); }
.nb-mode__img { position: absolute; inset: 0; background-size: cover; background-position: center; transition: transform .7s ease-out; z-index: -2; }
.nb-mode:hover .nb-mode__img { transform: scale(1.06); }
.nb-mode--0 .nb-mode__img { background-image: linear-gradient(160deg, #1f6b2e, #07210e); } .nb-mode--1 .nb-mode__img { background-image: linear-gradient(160deg, #1d63a8, #08203a); } .nb-mode--2 .nb-mode__img { background-image: linear-gradient(160deg, #a8321d, #3a0f08); }
.nb-mode--3 .nb-mode__img { background-image: linear-gradient(160deg, #6b2fb0, #1c0a3a); } .nb-mode--4 .nb-mode__img { background-image: linear-gradient(160deg, #b0861d, #3a2a08); } .nb-mode--5 .nb-mode__img { background-image: linear-gradient(160deg, #1d9ea8, #08333a); }
.nb-mode:after { content: ''; position: absolute; inset: 0; z-index: -1; background: linear-gradient(0deg, rgba(0,0,0,.92), rgba(0,0,0,.15) 55%, transparent); }
.nb-mode__top { position: absolute; left: 1rem; top: 1rem; display: flex; gap: .5rem; align-items: center; }
.nb-mode__body { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.5rem; }
.nb-mode__body h3 { color: #fff !important; font-size: clamp(1.8rem, 2.6vw, 2.4rem); margin: 0; }
.nb-mode__body p { margin: .5rem 0 0; color: rgba(255,255,255,.72); font-size: .9rem; }
.nb-mode__go { margin-top: 1rem; display: inline-flex; align-items: center; gap: .55rem; font-family: var(--nb-font-head); font-size: .68rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; color: var(--nb-primary); }
.nb-mode__go i { display: grid; place-items: center; width: 28px; height: 28px; border-radius: 50%; border: 1px solid rgba(var(--nb-primary-rgb), .45); font-size: .7rem; transition: background .15s, color .15s; }
.nb-mode:hover .nb-mode__go i { background: var(--nb-primary); color: var(--nb-on-primary); }
.nb-mode__glyph { position: absolute; inset: 0; display: grid; place-items: center; font-family: var(--nb-font-head); font-size: 8rem; color: rgba(255,255,255,.1); z-index: -1; }
.nb-mode__img[style*="url"] ~ .nb-mode__glyph { display: none; }
.nb-rows { margin-top: 1.25rem; display: grid; grid-template-columns: repeat(2, 1fr); gap: 1.25rem; }
.nb-row { display: flex; align-items: center; justify-content: space-between; gap: 1rem; padding: 1.2rem 1.5rem; border-radius: var(--nb-radius); border: 1px solid var(--nb-border); background: var(--nb-surface); color: var(--nb-text) !important; text-decoration: none; transition: border-color .2s; }
.nb-row:hover { border-color: rgba(var(--nb-primary-rgb), .5); }
.nb-row h3 { margin: 0; font-size: 1.15rem; } .nb-row p { margin: .2rem 0 0; color: var(--nb-muted); font-size: .88rem; }
.nb-row .arrow { display: grid; place-items: center; flex: none; width: 40px; height: 40px; border-radius: 50%; background: rgba(127,127,127,.14); transition: background .15s, color .15s; }
.nb-row:hover .arrow { background: var(--nb-primary); color: var(--nb-on-primary); }

/* ---------- steps (how to join) ---------- */
.nb-steps { display: grid; gap: 1rem; max-width: 56rem; margin: 0 auto; }
.nb-step { display: flex; align-items: center; gap: 1.4rem; padding: 1.4rem 1.7rem; border-radius: var(--nb-radius); border: 1px solid var(--nb-border); background: color-mix(in srgb, var(--nb-panel) 90%, transparent); backdrop-filter: blur(8px); }
.nb-step__n { font-family: var(--nb-font-head); font-size: 2.4rem; font-weight: 700; color: rgba(127,127,127,.35); line-height: 1; }
.nb-step__i { display: grid; place-items: center; flex: none; width: 48px; height: 48px; border-radius: 12px; background: var(--nb-primary); color: var(--nb-on-primary); }
.nb-step h3 { margin: 0; font-size: 1.15rem; } .nb-step p { margin: .15rem 0 0; color: var(--nb-muted); font-size: .92rem; }
.nb-tabs { max-width: 56rem; margin: 1rem auto 0; padding: 1.4rem 1.7rem; border-radius: var(--nb-radius); border: 1px solid var(--nb-border); background: color-mix(in srgb, var(--nb-panel) 90%, transparent); }
.nb-tabs__top { display: flex; flex-wrap: wrap; align-items: center; justify-content: space-between; gap: 1rem; }
.nb-tabs__btns { display: inline-flex; padding: .25rem; border-radius: 12px; background: rgba(0,0,0,.4); }
body:not(.dark) .nb-tabs__btns { background: rgba(10,20,5,.08); }
.nb-tabs__btns button { padding: .65rem 1.2rem; border: 0; border-radius: 9px; background: transparent; color: var(--nb-muted); font-family: var(--nb-font-head); font-size: .68rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; cursor: pointer; }
.nb-tabs__btns button.is-on { background: var(--nb-primary); color: var(--nb-on-primary); }
.nb-tabs .nb-ip { color: var(--nb-text); }
.nb-tabs__note { margin: 1rem 0 0; color: var(--nb-muted); font-size: .85rem; }

/* ---------- countdown / season ---------- */
.nb-season { display: grid; grid-template-columns: 1fr 1fr; gap: 1.5rem; align-items: stretch; }
.nb-season__img { position: relative; min-height: 340px; overflow: hidden; border-radius: var(--nb-radius); border: 1px solid var(--nb-border); background: var(--nb-surface-2) center / cover no-repeat; isolation: isolate; }
.nb-season__img:after { content: ''; position: absolute; inset: 0; background: linear-gradient(0deg, rgba(0,0,0,.85), transparent 60%); }
.nb-season__img > div { position: absolute; left: 1.2rem; right: 1.2rem; bottom: 1.2rem; z-index: 2; display: flex; justify-content: space-between; flex-wrap: wrap; gap: .6rem; }
.nb-season__card { display: flex; flex-direction: column; justify-content: center; padding: 2.4rem; border-radius: var(--nb-radius); border: 1px solid var(--nb-border); background: var(--nb-surface); }
.nb-season__card h2 { font-size: clamp(1.9rem, 3.8vw, 3rem); margin: 0; }
.nb-season__card p { margin: .9rem 0 0; color: var(--nb-muted); max-width: 30rem; }
.nb-count { margin-top: 1.8rem; display: grid; grid-template-columns: repeat(4, 1fr); gap: .75rem; }
.nb-count div { text-align: center; padding: 1rem .5rem; border-radius: 12px; border: 1px solid var(--nb-border); background: rgba(127,127,127,.08); }
.nb-count strong { display: block; font-family: var(--nb-font-mono); font-size: clamp(1.4rem, 3vw, 2rem); color: var(--nb-primary-600); } body.dark .nb-count strong { color: var(--nb-primary); }
.nb-count span { font-family: var(--nb-font-head); font-size: .56rem; font-weight: 700; letter-spacing: .2em; text-transform: uppercase; color: var(--nb-muted); }

/* ---------- server status ---------- */
.nb-server { display: grid; grid-template-columns: 1.2fr 1fr; gap: 2rem; align-items: center; background: var(--nb-surface); border: 1px solid var(--nb-border); border-radius: calc(var(--nb-radius) + 6px); padding: 2.2rem; box-shadow: var(--nb-shadow); }
.nb-server h2 { margin: .9rem 0 .4rem; font-size: 2rem; }
.nb-server__meta { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .45rem; color: var(--nb-muted); font-size: .92rem; }
.nb-server__meta i { width: 1.4rem; color: var(--nb-primary-600); } body.dark .nb-server__meta i { color: var(--nb-primary); }
.nb-server__card { background: var(--nb-surface-2); border: 1px solid var(--nb-border); border-radius: var(--nb-radius); padding: 1.5rem; }
.nb-server__players { display: flex; align-items: baseline; gap: .5rem; margin-bottom: .75rem; }
.nb-server__players strong { font-family: var(--nb-font-head); font-size: 2.8rem; line-height: 1; letter-spacing: -.04em; }
.nb-server__players span { color: var(--nb-muted); }
.nb-bar { height: 8px; border-radius: 99px; background: rgba(127,127,127,.2); overflow: hidden; margin-bottom: 1.2rem; }
.nb-bar span { display: block; height: 100%; background: var(--nb-primary); border-radius: 99px; }

/* ---------- stats ---------- */
.nb-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1rem; }
.nb-stat { text-align: center; padding: 1.5rem 1rem; background: var(--nb-surface); border: 1px solid var(--nb-border); border-radius: var(--nb-radius); display: grid; justify-items: center; }
.nb-stat strong { font-family: var(--nb-font-head); font-size: 2.4rem; letter-spacing: -.04em; line-height: 1.1; font-variant-numeric: tabular-nums; }
.nb-stat .nb-muted { font-family: var(--nb-font-head); font-size: .66rem; font-weight: 700; letter-spacing: .18em; text-transform: uppercase; }

/* ---------- news ---------- */
.nb-news { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.nb-news:hover { transform: translateY(-4px); }
.nb-news__cover { aspect-ratio: 16/9; display: grid; place-items: center; color: rgba(255,255,255,.5); font-family: var(--nb-font-head); font-size: 3.4rem; font-weight: 700; background-size: cover; background-position: center; }
.nb-news__cover--0 { background-image: linear-gradient(135deg, var(--nb-primary-600), #07210e); } .nb-news__cover--1 { background-image: linear-gradient(135deg, #a8561d, #3a1a08); } .nb-news__cover--2 { background-image: linear-gradient(135deg, #1d7fa8, #08263a); }
.nb-news__cover--3 { background-image: linear-gradient(135deg, #6b2fb0, #1c0a3a); } .nb-news__cover--4 { background-image: linear-gradient(135deg, #b0861d, #3a2a08); } .nb-news__cover--5 { background-image: linear-gradient(135deg, #1d9ea8, #08333a); }
.nb-news__body { padding: 1.3rem 1.4rem 1.4rem; display: flex; flex-direction: column; gap: .6rem; flex: 1; }
.nb-news__meta { display: flex; justify-content: space-between; align-items: center; color: var(--nb-muted); font-size: .78rem; font-family: var(--nb-font-mono); }
.nb-news__body h3 a { color: var(--nb-text) !important; text-decoration: none; } .nb-news__body h3 a:hover { color: var(--nb-primary-600) !important; } body.dark .nb-news__body h3 a:hover { color: var(--nb-primary) !important; }
.nb-news__author { margin-top: auto; display: flex; align-items: center; gap: .55rem; font-size: .85rem; padding-top: .6rem; }
.nb-news__author img { width: 28px; height: 28px; border-radius: 8px; }

/* ---------- pricing ---------- */
.nb-grid--pricing { align-items: stretch; }
.nb-price { position: relative; display: flex; flex-direction: column; gap: 1rem; padding: 2rem 1.8rem; }
.nb-price:hover { transform: translateY(-4px); }
.nb-price h3 { font-size: 1.25rem; }
.nb-price__amount strong { font-family: var(--nb-font-head); font-size: 2.8rem; letter-spacing: -.04em; line-height: 1; }
.nb-price__amount span { color: var(--nb-muted); margin-left: .3rem; font-size: .9rem; }
.nb-price ul { list-style: none; padding: 0; margin: 0 0 .5rem; display: grid; gap: .7rem; flex: 1; }
.nb-price li { display: flex; gap: .65rem; align-items: flex-start; color: var(--nb-mist); font-size: .92rem; }
.nb-price li i { width: 6px; height: 6px; border-radius: 50%; background: var(--nb-primary); margin-top: .55rem; font-size: 0; flex: none; }
.nb-price--featured { border-color: var(--nb-primary); background: linear-gradient(180deg, rgba(var(--nb-primary-rgb), .12), var(--nb-surface) 55%); }
.nb-ribbon { position: absolute; top: -14px; left: 50%; transform: translateX(-50%); background: var(--nb-primary); color: var(--nb-on-primary); font-family: var(--nb-font-head); font-size: .62rem; font-weight: 700; letter-spacing: .16em; text-transform: uppercase; padding: .38rem 1rem; border-radius: 999px; white-space: nowrap; }

/* ---------- staff / top members ---------- */
.nb-person { display: grid; justify-items: center; gap: .6rem; padding: 1.6rem 1rem; text-align: center; color: var(--nb-text) !important; text-decoration: none; }
.nb-person:hover { transform: translateY(-4px); }
.nb-person img { width: 84px; height: 84px; border-radius: 22px; background: var(--nb-surface-2); box-shadow: 0 0 0 3px rgba(var(--nb-primary-rgb), .3); }
.nb-person strong { font-family: var(--nb-font-head); letter-spacing: -.02em; }
.nb-top { display: grid; gap: .55rem; }
.nb-top__row { display: flex; align-items: center; gap: .9rem; padding: .75rem 1rem; border-radius: 12px; border: 1px solid var(--nb-border); background: rgba(127,127,127,.07); color: var(--nb-text) !important; text-decoration: none; }
.nb-top__row .pos { width: 1.5rem; font-family: var(--nb-font-mono); font-weight: 700; color: var(--nb-muted); } .nb-top__row:first-child .pos { color: var(--nb-primary-600); } body.dark .nb-top__row:first-child .pos { color: var(--nb-primary); }
.nb-top__row img { width: 34px; height: 34px; border-radius: 9px; }
.nb-top__row .pts { margin-left: auto; font-family: var(--nb-font-mono); font-size: .85rem; color: var(--nb-muted); }

/* ---------- gallery / faq ---------- */
.nb-gallery { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 190px; gap: 1rem; }
.nb-shot { position: relative; margin: 0; border-radius: var(--nb-radius); overflow: hidden; background-size: cover; background-position: center; border: 1px solid var(--nb-border); transition: transform .3s; }
.nb-shot:hover { transform: scale(1.012); }
.nb-shot:nth-child(1) { grid-column: span 2; grid-row: span 2; } .nb-shot:nth-child(4) { grid-column: span 2; }
.nb-shot--0 { background-image: linear-gradient(135deg, #1d63a8, #08203a); } .nb-shot--1 { background-image: linear-gradient(135deg, #1f6b2e, #07210e); } .nb-shot--2 { background-image: linear-gradient(135deg, #a8321d, #3a0f08); }
.nb-shot--3 { background-image: linear-gradient(135deg, #6b2fb0, #1c0a3a); } .nb-shot--4 { background-image: linear-gradient(135deg, #b0861d, #3a2a08); } .nb-shot--5 { background-image: linear-gradient(135deg, #1d9ea8, #08333a); }
.nb-shot figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.5rem 1rem .8rem; color: #fff; font-family: var(--nb-font-head); font-weight: 600; font-size: .9rem; background: linear-gradient(transparent, rgba(0,0,0,.7)); }
.nb-faq { display: grid; gap: .8rem; }
.nb-faq__item { padding: 0; }
.nb-faq__item[open] { border-color: rgba(var(--nb-primary-rgb), .5); }
.nb-faq__item summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.2rem 1.5rem; font-family: var(--nb-font-head); font-weight: 700; font-size: 1.02rem; letter-spacing: -.01em; }
.nb-faq__item summary::-webkit-details-marker { display: none; }
.nb-faq__item summary i { display: grid; place-items: center; width: 32px; height: 32px; border-radius: 50%; background: rgba(127,127,127,.18); font-size: .75rem; transition: transform .2s, background .2s; flex: none; }
.nb-faq__item[open] summary i { transform: rotate(45deg); background: var(--nb-primary); color: var(--nb-on-primary); }
.nb-faq__item p { padding: 0 1.5rem 1.4rem; }

/* ---------- banners (discord / final cta) ---------- */
.nb-banner { position: relative; overflow: hidden; isolation: isolate; border-radius: calc(var(--nb-radius) + 4px); border: 1px solid var(--nb-border); color: #fff; padding: clamp(2rem, 5vw, 3.5rem); display: flex; align-items: flex-end; gap: 2rem; }
.nb-banner h2 { margin: .9rem 0 0; color: #fff !important; font-size: clamp(2rem, 4.4vw, 3.4rem); }
.nb-banner p { margin: .9rem 0 0; color: rgba(255,255,255,.7); max-width: 34rem; }
.nb-banner__text { flex: 1; }
.nb-banner__actions { display: flex; gap: .8rem; flex-wrap: wrap; margin-top: 1.6rem; }
.nb-banner--discord { background: #0d1420; min-height: 340px; }
.nb-banner--discord:after { content: ''; position: absolute; z-index: -1; right: -5rem; top: -5rem; width: 20rem; height: 20rem; border-radius: 50%; background: rgba(88,101,242,.35); filter: blur(90px); }
.nb-banner--discord:before { background-image: none; }
.nb-banner--discord .nb-pill { background: #5865f2; color: #fff; }
.nb-banner--discord .nb-btn--primary { background: #5865f2; color: #fff !important; } .nb-banner--discord .nb-btn--primary:hover { background: #4752c4; }
.nb-banner--cta { justify-content: center; text-align: center; background: #06040d center / cover no-repeat; min-height: 440px; align-items: center; }
.nb-banner--cta:after { content: ''; position: absolute; inset: 0; z-index: -1; background: radial-gradient(60% 80% at 50% 50%, rgba(6,4,13,.55), rgba(6,4,13,.9)); }
.nb-banner--cta .nb-banner__text { max-width: 44rem; display: grid; justify-items: center; }
.nb-banner--cta h2 { font-size: clamp(2.6rem, 7vw, 5.5rem); line-height: .95; text-transform: uppercase; }
.nb-banner--cta .nb-banner__actions { justify-content: center; }
.nb-banner__logo { width: 56px; height: 56px; }
.nb-section--discord, .nb-section--cta { padding: 1.5rem 0; } .nb-section--cta { padding-bottom: 5rem; }
.nb-partners__row { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 1rem 3rem; margin-top: 1rem; }
.nb-partners__row a { color: var(--nb-muted) !important; font-family: var(--nb-font-head); font-weight: 700; opacity: .8; text-decoration: none; letter-spacing: -.02em; font-size: 1.1rem; } .nb-partners__row a:hover { opacity: 1; color: var(--nb-primary) !important; }
.nb-partners__row img { max-height: 32px; filter: grayscale(1); }
.nb-richtext { color: var(--nb-text); }

/* ---------- footer ---------- */
.nb-footer { border-top: 1px solid var(--nb-border); background: var(--nb-bg); padding: 4rem 0 1.5rem; margin-top: 2rem; overflow: hidden; }
.nb-footer__grid { display: grid; grid-template-columns: 1.4fr 1fr 1fr 1fr; gap: 3rem; }
.nb-footer h4 { font-family: var(--nb-font-head); font-size: .68rem; letter-spacing: .2em; text-transform: uppercase; color: var(--nb-muted); margin: 0 0 1.1rem; }
.nb-footer__brand p { color: var(--nb-muted); max-width: 26rem; margin: 1rem 0; font-size: .92rem; }
.nb-footer__list { list-style: none; padding: 0; margin: 0; display: grid; gap: .65rem; }
.nb-footer__list a { color: color-mix(in srgb, var(--nb-text) 72%, transparent) !important; text-decoration: none; font-size: .92rem; } .nb-footer__list a:hover { color: var(--nb-primary) !important; }
.nb-social { display: flex; gap: .5rem; }
.nb-social a { display: grid; place-items: center; width: 40px; height: 40px; border-radius: 12px; border: 1px solid var(--nb-border); color: var(--nb-text) !important; } .nb-social a:hover { background: var(--nb-primary); color: var(--nb-on-primary) !important; border-color: transparent; }
.nb-outline-word { margin: 3.5rem 0 0; text-align: center; font-family: var(--nb-font-head); font-weight: 700; font-size: clamp(3.5rem, 14vw, 11rem); line-height: 1; letter-spacing: -.04em; text-transform: uppercase; color: transparent; -webkit-text-stroke: 1px rgba(127,127,127,.28); user-select: none; white-space: nowrap; overflow: hidden; }
.nb-footer__bottom { display: flex; flex-wrap: wrap; gap: .5rem 2rem; align-items: center; margin-top: 2rem; padding-top: 1.4rem; border-top: 1px solid var(--nb-border); color: var(--nb-muted); font-size: .8rem; }
.nb-footer__bottom a { color: var(--nb-muted) !important; }
.nb-status { margin-left: auto; display: inline-flex; align-items: center; gap: .5rem; font-family: var(--nb-font-mono); font-size: .75rem; }
.nb-disclaimer { width: 100%; font-size: .75rem; opacity: .75; }

/* ==========================================================================
   Fomantic UI re-skin (every other page: forum, profile, user CP, auth ...)
   ========================================================================== */
body.nebula .ui.segment, body.nebula .ui.card, body.nebula .ui.cards > .card, body.nebula .ui.message:not(.announcement), body.nebula .ui.comments .comment .content {
    background: var(--nb-surface); color: var(--nb-text); border: 1px solid var(--nb-border); border-radius: var(--nb-radius); box-shadow: var(--nb-shadow);
}
body.nebula .ui.segment { padding: 1.4rem; margin: 0 0 1.2rem; }
body.nebula .ui.segment .ui.segment { box-shadow: none; background: var(--nb-surface-2); }
body.nebula .ui.card > .content, body.nebula .ui.cards > .card > .content { border-top-color: var(--nb-border) !important; }
body.nebula .ui.card > .content > .header, body.nebula .ui.cards > .card > .content > .header, body.nebula .ui.card > .content > .meta { color: var(--nb-text); }
body.nebula .ui.card > .extra, body.nebula .ui.cards > .card > .extra { border-top: 1px solid var(--nb-border) !important; color: var(--nb-muted) !important; }
body.nebula .ui.message { padding: 1rem 1.2rem; }
body.nebula .ui.info.message { background: rgba(var(--nb-primary-rgb), .1); color: var(--nb-text); box-shadow: none; border-color: rgba(var(--nb-primary-rgb), .3); }
body.nebula .ui.negative.message, body.nebula .ui.error.message { background: rgba(239,68,68,.1); color: var(--nb-text); box-shadow: none; border-color: rgba(239,68,68,.35); }
body.nebula .ui.positive.message, body.nebula .ui.success.message { background: rgba(22,163,74,.1); color: var(--nb-text); box-shadow: none; border-color: rgba(22,163,74,.35); }
body.nebula .ui.warning.message { background: rgba(234,179,8,.12); color: var(--nb-text); box-shadow: none; border-color: rgba(234,179,8,.4); }
body.nebula .ui.message .header { color: inherit; }
body.nebula .ui.header { color: var(--nb-text); }
body.nebula .ui.header .sub.header { color: var(--nb-muted); }
body.nebula .ui.grid { margin-top: 0; }
body.nebula .ui.list > .item .header, body.nebula .ui.list > .item > .content { color: var(--nb-text); }
body.nebula .ui.list > .item .description { color: var(--nb-muted); }
body.nebula .ui.menu:not(.inverted) { background: var(--nb-surface); border: 1px solid var(--nb-border); border-radius: var(--nb-radius); box-shadow: none; }
body.nebula .ui.menu:not(.inverted) .item { color: var(--nb-text); }
body.nebula .ui.vertical.menu .item { border-color: var(--nb-border) !important; }
body.nebula .ui.vertical.menu .item:before { background: var(--nb-border); }
body.nebula .ui.menu .active.item, body.nebula .ui.vertical.menu .active.item { background: rgba(var(--nb-primary-rgb), .12) !important; color: var(--nb-primary) !important; }
body.dark .ui.menu .active.item { color: var(--nb-primary-300) !important; }
body.nebula .ui.menu .item:hover { background: var(--nb-surface-2) !important; }
body.nebula .ui.pagination.menu .item { min-width: 2.4em; }
body.nebula .ui.pagination.menu .active.item { background: var(--nb-primary) !important; color: #fff !important; }
body.nebula .ui.secondary.pointing.menu .active.item { border-color: var(--nb-primary); }
body.nebula .ui.tabular.menu { border-color: var(--nb-border); background: transparent; border-radius: 0; border-width: 0 0 1px; }
body.nebula .ui.tabular.menu .item { border-radius: var(--nb-radius-sm) var(--nb-radius-sm) 0 0; }
body.nebula .ui.tabular.menu .active.item { background: var(--nb-surface) !important; border-color: var(--nb-border); }

/* forms */
body.nebula .ui.form .field > label, body.nebula .ui.form label { color: var(--nb-text); font-weight: 600; font-size: .9rem; }
body.nebula .ui.form input:not([type]), body.nebula .ui.form input[type=text], body.nebula .ui.form input[type=password], body.nebula .ui.form input[type=email],
body.nebula .ui.form input[type=number], body.nebula .ui.form input[type=url], body.nebula .ui.form input[type=search], body.nebula .ui.form textarea, body.nebula .ui.form select,
body.nebula .ui.input > input, body.nebula .ui.selection.dropdown {
    background: var(--nb-surface); color: var(--nb-text); border: 1px solid var(--nb-border); border-radius: var(--nb-radius-sm); padding: .8rem 1rem; font-family: var(--nb-font);
}
body.nebula .ui.form input:focus, body.nebula .ui.form textarea:focus, body.nebula .ui.form select:focus, body.nebula .ui.input.focus > input, body.nebula .ui.input > input:focus,
body.nebula .ui.selection.active.dropdown, body.nebula .ui.selection.dropdown:focus {
    border-color: var(--nb-primary); box-shadow: 0 0 0 3px rgba(var(--nb-primary-rgb), .18); background: var(--nb-surface); color: var(--nb-text);
}
body.nebula .ui.dropdown .menu { background: var(--nb-surface); border: 1px solid var(--nb-border); border-radius: var(--nb-radius-sm); box-shadow: var(--nb-shadow); }
body.nebula .ui.dropdown .menu > .item { color: var(--nb-text); border-top-color: var(--nb-border); }
body.nebula .ui.dropdown .menu > .item:hover, body.nebula .ui.dropdown .menu .selected.item { background: var(--nb-surface-2); }
body.nebula .ui.selection.dropdown .menu { border-color: var(--nb-border); }
body.nebula .ui.checkbox label, body.nebula .ui.checkbox + label { color: var(--nb-text) !important; }
body.nebula .ui.checkbox input:checked ~ label:before, body.nebula .ui.checkbox .box:before { border-color: var(--nb-primary); }
body.nebula .ui.checkbox input:checked ~ label:before { background: var(--nb-primary); }
body.nebula .ui.checkbox input:checked ~ label:after { color: #fff !important; }
body.nebula .ui.checkbox label:before { background: var(--nb-surface); border-color: var(--nb-border); }
body.nebula ::placeholder { color: var(--nb-muted) !important; opacity: .7; }

/* tables */
body.nebula .ui.table { background: var(--nb-surface); color: var(--nb-text); border: 1px solid var(--nb-border); border-radius: var(--nb-radius); overflow: hidden; box-shadow: var(--nb-shadow); }
body.nebula .ui.table thead th { background: var(--nb-surface-2); color: var(--nb-muted); border-color: var(--nb-border); font-size: .78rem; text-transform: uppercase; letter-spacing: .06em; }
body.nebula .ui.table tbody td, body.nebula .ui.table tr td { border-color: var(--nb-border); }
body.nebula .ui.table a { color: var(--nb-text); }
body.nebula .ui.table a:hover { color: var(--nb-primary); }
body.nebula .ui.striped.table > tr:nth-child(2n), body.nebula .ui.striped.table tbody tr:nth-child(2n) { background: var(--nb-surface-2); }

/* labels, modals, breadcrumbs, accordions, comments */
body.nebula .ui.label { border-radius: 99px; font-weight: 600; }
body.nebula .ui.modal { background: var(--nb-surface); border: 1px solid var(--nb-border); border-radius: var(--nb-radius); color: var(--nb-text); }
body.nebula .ui.modal > .header { background: var(--nb-surface); color: var(--nb-text); border-bottom: 1px solid var(--nb-border); }
body.nebula .ui.modal > .content { background: var(--nb-surface); color: var(--nb-text); }
body.nebula .ui.modal > .actions { background: var(--nb-surface-2); border-top: 1px solid var(--nb-border); }
body.nebula .ui.breadcrumb .section, body.nebula .ui.breadcrumb .divider { color: var(--nb-muted); }
body.nebula .ui.comments .comment .author, body.nebula .ui.comments .comment .text { color: var(--nb-text); }
body.nebula .ui.comments .comment .metadata { color: var(--nb-muted); }
body.nebula .ui.styled.accordion, body.nebula .ui.accordion .title { color: var(--nb-text); }
body.nebula .ui.image.label img { border-radius: 50%; }
body.nebula .ui.avatar.image, body.nebula img.ui.avatar { border-radius: 10px; }
body.nebula .ui.placeholder.segment { background: var(--nb-surface); }
body.nebula .ui.progress { background: var(--nb-surface-2); }
body.nebula .ui.progress .bar { background: var(--nb-primary); }
body.nebula .ui.inverted.segment { background: #111827; }
body.nebula blockquote, body.nebula .blockquote { border-left: 3px solid var(--nb-primary); background: var(--nb-surface-2); color: var(--nb-text); border-radius: 0 var(--nb-radius-sm) var(--nb-radius-sm) 0; }
body.nebula pre, body.nebula code { background: var(--nb-surface-2); color: var(--nb-text); border-radius: 6px; }
body.nebula hr { border-color: var(--nb-border); }
body.dark .ui.basic.button, body.dark .ui.default.button { color: var(--nb-text) !important; }
body.dark .ui.table thead th, body.dark .ui.table { color: var(--nb-text); }
body.dark .ui.menu:not(.inverted) { background: var(--nb-surface); border-color: var(--nb-border); }
body.dark .ui.form input:not(.button), body.dark .ui.form textarea, body.dark .ui.form input[type=url] { background: var(--nb-surface); color: var(--nb-text); }
body.dark .ui.attached.segment, body.dark .ui.top.attached.menu:not(.inverted) { background: var(--nb-surface); border-color: var(--nb-border); }

/* forum + profile specifics (legacy ids from NamelessMC modules) */
#forum-index .ui.segment.cc_forum_cat, body.nebula .ui.top.attached.header { background: var(--nb-surface-2) !important; color: var(--nb-text) !important; border: 1px solid var(--nb-border) !important; border-radius: var(--nb-radius) var(--nb-radius) 0 0 !important; }
body.nebula .ui.attached.segment { border-radius: 0 0 var(--nb-radius) var(--nb-radius); }
body.nebula #profile-header, body.dark .ui.segment#profile-header { background: linear-gradient(135deg, rgba(var(--nb-primary-rgb), .18), var(--nb-surface) 60%); border: 1px solid var(--nb-border); }
body.nebula #topic-post #post-sidebar { background: var(--nb-surface-2); border-radius: var(--nb-radius-sm); }
body.nebula .forum_post { color: var(--nb-text); }
body.nebula .forum_post a { color: var(--nb-primary); }
body.nebula #widget-online-users, body.nebula [id*="widget"] { border-radius: var(--nb-radius); }
body.nebula .badge { border-radius: 99px; }

/* login / register — centred auth card */
body#page-login .nb-content > .ui.stackable.grid, body#page-register .nb-content > .ui.stackable.grid { max-width: 480px; margin-inline: auto; }
body#page-login .ui.segment, body#page-register .ui.segment { padding: 2rem; }

/* topic / comment surfaces */
body.nebula .ui.secondary.segment:not(.inverted), body.nebula .ui.segments > .segment, body.nebula #topic-post .ui.segment, body.nebula #topic-reply .ui.segment {
    background: var(--nb-surface) !important; color: var(--nb-text);
}
body.nebula #topic-post .ui.secondary.segment, body.nebula #post-content { background: transparent !important; }
body.nebula .ui.segments { border: 1px solid var(--nb-border); border-radius: var(--nb-radius); box-shadow: var(--nb-shadow); }
body.nebula .ui.segments > .segment { border-color: var(--nb-border); box-shadow: none; }
body.nebula .ui.grey.segment, body.nebula .ui.basic.segment { background: transparent !important; box-shadow: none; border: 0; }


body.nebula .ui.segment, body.nebula .ui.card, body.nebula .ui.cards > .card { box-shadow: none; }
body.nebula .ui.label { font-family: var(--nb-font-head); letter-spacing: .04em; }
body.nebula .ui.table thead th { font-family: var(--nb-font-head); letter-spacing: .14em; }
body.nebula .ui.pagination.menu .active.item { background: var(--nb-primary) !important; color: var(--nb-on-primary) !important; }
body.nebula .ui.form input:focus, body.nebula .ui.form textarea:focus, body.nebula .ui.input > input:focus { border-color: var(--nb-primary); box-shadow: 0 0 0 3px rgba(var(--nb-primary-rgb), .25); }


/* ==========================================================================
   Inner pages (forum, members, store, profile, user panel…) — same design language as the home
   ========================================================================== */
body.nebula:not(.nb-home) .nb-main { background: radial-gradient(70% 380px at 50% 0%, rgba(var(--nb-primary-rgb), .10), transparent 70%); }
.nb-page-head { background: linear-gradient(180deg, rgba(var(--nb-primary-rgb), .18), transparent 90%), var(--nb-panel); padding: 3.8rem 0 2.6rem; border-bottom: 0; }
.nb-page-head:after { content: ''; position: absolute; left: 0; right: 0; bottom: 0; height: 3px; background: linear-gradient(90deg, var(--nb-primary), rgba(var(--nb-primary-rgb), 0) 65%); }
.nb-page-head h1 { position: relative; display: inline-block; }
.nb-page-head h1:before { content: ''; display: block; width: 44px; height: 6px; margin-bottom: .9rem; background: var(--nb-primary); border-radius: 4px; }

/* breadcrumb */
body.nebula .ui.breadcrumb { display: flex; flex-wrap: wrap; align-items: center; gap: .15rem .5rem; margin-bottom: 1.6rem; font-size: .8rem; font-weight: 600; text-transform: uppercase; letter-spacing: .04em; }
body.nebula .ui.breadcrumb .section, body.nebula .ui.breadcrumb a.section { color: var(--nb-muted); } body.nebula .ui.breadcrumb a.section:hover { color: var(--nb-text); }
body.nebula .ui.breadcrumb .active.section { color: var(--nb-text); font-weight: 800; } body.nebula .ui.breadcrumb .divider { color: var(--nb-border); margin: 0; }
body.nebula #forum-index h2.ui.header, body.nebula .nb-content > .ui.grid > .row > .column > h2.ui.header:only-child { margin-top: 0; font-size: 1.6rem; }

/* cards / segments */
body.nebula .ui.segment, body.nebula .ui.padded.segment, body.nebula .ui.card, body.nebula .ui.cards > .card { background: var(--nb-surface); border: 1px solid var(--nb-border); border-radius: var(--nb-radius); box-shadow: none; color: var(--nb-text); }
body.nebula .ui.segment { padding: 1.6rem; }
body.nebula .ui.attached.segment, body.nebula .ui.bottom.attached.segment { background: var(--nb-surface-2); border-radius: 0 0 var(--nb-radius) var(--nb-radius); }
body.nebula .ui.segment .ui.segment { background: var(--nb-surface-2); }

/* forum categories */
body.nebula #forum-node { padding: 0 !important; overflow: hidden; margin-bottom: 1.5rem; }
body.nebula #forum-node > h3.ui.header { margin: 0 !important; padding: 1.1rem 1.6rem; background: var(--nb-surface-2); border-bottom: 1px solid var(--nb-border); font-size: .95rem; letter-spacing: .08em; display: flex; align-items: center; gap: .8rem; }
body.nebula #forum-node > h3.ui.header:before { content: ''; width: 5px; height: 20px; background: var(--nb-primary); flex: none; }
body.nebula #forum-node > h3.ui.header a { color: var(--nb-text); }
body.nebula #forum-node > .ui.divider { display: none; }
body.nebula #forum-node > .ui.grid { margin: 0 !important; }
body.nebula #forum-node > .ui.grid > .row { padding: 1.15rem 1.6rem !important; border-top: 1px solid var(--nb-border); transition: background .15s; }
body.nebula #forum-node > .ui.grid > .row:first-child { border-top: 0; }
body.nebula #forum-node > .ui.grid > .row:hover { background: rgba(var(--nb-primary-rgb), .06); }
body.nebula #forum-node .row > .column { padding-top: 0 !important; padding-bottom: 0 !important; }
body.nebula #forum-node .one.wide.column > i.icon, body.nebula #forum-node .one.wide.column > * { display: inline-grid; place-items: center; width: 46px; height: 46px; margin: 0 !important; border-radius: var(--nb-radius-sm); border: 1px solid var(--nb-border); background: var(--nb-bg); color: var(--nb-primary-600); font-size: 1.15rem; line-height: 1; }
body.dark.quarry #forum-node .one.wide.column > * { color: var(--nb-primary); }
body.nebula #forum-node a.header { font-family: var(--nb-font-head); font-weight: 800; font-size: 1.05rem; color: var(--nb-text); text-transform: uppercase; letter-spacing: .02em; }
body.nebula #forum-node a.header:hover { color: var(--nb-primary-600); } body.dark.quarry #forum-node a.header:hover { color: var(--nb-primary); }
body.nebula #forum-node .description { color: var(--nb-muted); font-size: .85rem; margin-top: .15rem; }
body.nebula #forum-node img.avatar { width: 38px; height: 38px; margin-right: .8rem; border-radius: var(--nb-radius-sm); }

/* tables (topic lists, panels) */
body.nebula .ui.table { background: var(--nb-surface); border: 1px solid var(--nb-border); border-radius: var(--nb-radius); overflow: hidden; color: var(--nb-text); }
body.nebula .ui.table thead th { background: var(--nb-surface-2); color: var(--nb-muted); border-bottom: 1px solid var(--nb-border); text-transform: uppercase; font-size: .72rem; padding: .95rem 1.2rem; }
body.nebula .ui.table tbody td { border-top: 1px solid var(--nb-border); padding: 1rem 1.2rem; }
body.nebula .ui.table tbody tr { transition: background .15s, box-shadow .15s; }
body.nebula .ui.table tbody tr:hover { background: rgba(var(--nb-primary-rgb), .06); box-shadow: inset 3px 0 0 var(--nb-primary); }
body.nebula .ui.table a { font-weight: 700; }
body.nebula .ui.table tr td .ui.avatar.image, body.nebula .ui.table img.avatar { width: 34px; height: 34px; border-radius: var(--nb-radius-sm); }

/* topic / post blocks */
body.nebula #topic-post, body.nebula #topic-reply { margin-bottom: 1.25rem; }
body.nebula #topic-post .ui.segments, body.nebula .ui.segments { border-radius: var(--nb-radius); overflow: hidden; border: 1px solid var(--nb-border); }
body.nebula #post-sidebar { background: linear-gradient(180deg, rgba(var(--nb-primary-rgb), .08), var(--nb-surface-2)) !important; border: 1px solid var(--nb-border); border-radius: var(--nb-radius-sm); }
body.nebula #post-sidebar img { border-radius: var(--nb-radius-sm) !important; image-rendering: pixelated; border: 2px solid var(--nb-border); }
body.nebula #post-sidebar h3, body.nebula #post-sidebar .ui.header { text-transform: uppercase; letter-spacing: .02em; }
body.nebula #post-content { line-height: 1.7; }

/* menus (side navigation of members, user panel…) */
body.nebula .ui.vertical.menu { background: var(--nb-surface); border: 1px solid var(--nb-border); border-radius: var(--nb-radius); overflow: hidden; width: 100%; box-shadow: none; }
body.nebula .ui.vertical.menu .item { padding: .95rem 1.2rem; font-weight: 600; transition: background .15s; }
body.nebula .ui.vertical.menu .item:hover { background: rgba(var(--nb-primary-rgb), .07) !important; }
body.nebula .ui.vertical.menu .active.item { background: rgba(var(--nb-primary-rgb), .13) !important; color: var(--nb-text) !important; box-shadow: inset 3px 0 0 var(--nb-primary); }
body.nebula .ui.menu .header.item, body.nebula .ui.vertical.menu .header { font-family: var(--nb-font-head); font-size: .72rem; text-transform: uppercase; color: var(--nb-muted); }
body.nebula .ui.fluid.button { width: 100%; }
body.nebula .ui.header > .sub.header, body.nebula .ui.segment > h3.ui.header, body.nebula .ui.segment h3.ui.header { font-size: 1rem; text-transform: uppercase; letter-spacing: .06em; }

/* forms */
body.nebula .ui.form input:not([type]), body.nebula .ui.form input[type=text], body.nebula .ui.form input[type=password], body.nebula .ui.form input[type=email], body.nebula .ui.form input[type=number], body.nebula .ui.form input[type=search], body.nebula .ui.form textarea, body.nebula .ui.form select, body.nebula .ui.input > input, body.nebula .ui.selection.dropdown { background: var(--nb-bg); border: 1px solid var(--nb-border); border-radius: var(--nb-radius-sm); padding: .85rem 1rem; color: var(--nb-text); }
body.nebula .ui.action.input > .button { height: auto; }
body.nebula .ui.form .field > label { text-transform: uppercase; letter-spacing: .05em; font-size: .72rem; color: var(--nb-muted); }

/* login / register / forgot password */
body#page-login .nb-content, body#page-register .nb-content, body#page-forgot_password .nb-content { max-width: 560px !important; }
body#page-login .ui.segment, body#page-register .ui.segment { padding: 2rem; border-top: 4px solid var(--nb-primary); }

/* store */
body.nebula .ui.segment > h1 { display: block !important; margin: 0 0 1.2rem; font-size: clamp(1.6rem, 3vw, 2.2rem); }
body.nebula .ui.segment { position: relative; }
body.nebula .ui.segment > span.right.floated { position: absolute; top: 1.5rem; right: 1.6rem; float: none !important; }
body.nebula .ui.segment .right.floated .ui.buttons { gap: .5rem; align-items: center; }
body.nebula .ui.segment .right.floated .ui.buttons > .ui.button { margin: 0; }
body.nebula .ui.top.attached.menu { display: flex; flex-wrap: wrap; gap: .35rem; background: transparent !important; border: 0 !important; padding: 0; margin: 1rem 0 0; box-shadow: none; }
body.nebula .ui.top.attached.menu > .item { border: 1px solid var(--nb-border) !important; border-radius: var(--nb-radius-sm); background: var(--nb-surface-2); font-weight: 800; letter-spacing: .06em; text-transform: uppercase; font-size: .78rem; padding: .85rem 1.2rem; }
body.nebula .ui.top.attached.menu > .item.active { background: var(--nb-surface) !important; color: var(--nb-text) !important; box-shadow: inset 0 -3px 0 var(--nb-accent); }
body.nebula .ui.top.attached.menu > .item:before { display: none; }
body.nebula .ui.bottom.attached.segment { margin-top: 1rem; background: transparent; border: 0; padding: 1rem 0 0; }
body.nebula .ui.centered.stackable.grid { gap: 1.25rem 0; }
body.nebula .ui.centered.stackable.grid > .four.wide.column > .ui.card { width: 100%; position: relative; overflow: hidden; text-align: center; transition: transform .25s, border-color .25s, box-shadow .25s; border-top: 0; }
body.nebula .ui.centered.stackable.grid > .four.wide.column > .ui.card:before { content: ''; display: block; height: 6px; background: var(--nb-primary); }
body.nebula .ui.centered.stackable.grid > .four.wide.column > .ui.card:hover { transform: translateY(-5px); border-color: rgba(var(--nb-primary-rgb), .6); box-shadow: 0 26px 60px -28px rgba(var(--nb-primary-rgb), .7); }
body.nebula .ui.centered.stackable.grid > .four.wide.column > .ui.card > .content > .header { font-family: var(--nb-font-head) !important; font-size: 1.05rem !important; text-transform: uppercase; color: var(--nb-primary) !important; }
body.nebula .ui.centered.stackable.grid > .four.wide.column > .ui.card > .content { padding: 1.4rem 1.2rem 1.2rem; font-size: 1.7rem; font-weight: 900; }
body.nebula .ui.centered.stackable.grid > .four.wide.column > .ui.card > .content .ui.divider { margin: 1rem 0; }
body.nebula .ui.centered.stackable.grid > .four.wide.column > .ui.card > .image { border-bottom: 1px solid var(--nb-border); } body.nebula .ui.centered.stackable.grid > .four.wide.column > .ui.card > .image img { image-rendering: auto; }
body.nebula .ui.centered.stackable.grid > .four.wide.column > .ui.card > .ui.bottom.attached.button { margin: 0; width: 100%; height: 52px; justify-content: center; }
body.nebula .ui.modal { border: 1px solid var(--nb-border); border-radius: var(--nb-radius); overflow: hidden; }
body.nebula .ui.modal > .header { text-transform: uppercase; letter-spacing: .04em; }

/* profile */
body.nebula #profile-header { background: linear-gradient(120deg, rgba(var(--nb-primary-rgb), .22), var(--nb-surface) 62%) !important; border: 1px solid var(--nb-border); }
body.nebula #profile .ui.tabular.menu .item, body.nebula .ui.tabular.menu .item { font-weight: 800; text-transform: uppercase; letter-spacing: .05em; font-size: .78rem; }

body.nebula #topic-post .ui.segment:last-child, body.nebula #topic-reply .ui.segment:last-child { padding-left: 1.4rem; padding-right: 1.4rem; }

/* ---------- responsive ---------- */
@media (max-width: 1100px) {
    .nb-grid--4 { grid-template-columns: repeat(2, 1fr); } .nb-grid--3 { grid-template-columns: repeat(2, 1fr); }
    .nb-split, .nb-season, .nb-server { grid-template-columns: 1fr; }
    .nb-modes { grid-template-columns: repeat(2, 1fr); }
    .nb-gallery { grid-template-columns: repeat(2, 1fr); }
    .nb-footer__grid { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
    .nb-nav__toggle { display: inline-grid; place-items: center; }
    .nb-nav__inner { flex-wrap: wrap; gap: .5rem; padding-block: .6rem; min-height: 64px; }
    .nb-nav__links, .nb-nav__right { display: none; width: 100%; }
    .nb-nav--open { background: var(--nb-nav-bg) !important; backdrop-filter: blur(18px); }
    .nb-nav--open .nb-nav__links { display: flex; flex-direction: column; align-items: stretch; order: 5; padding: .5rem 0; margin: 0; }
    .nb-nav--open .nb-nav__right { display: flex; order: 6; flex-wrap: wrap; padding-bottom: .6rem; margin-left: 0; }
    .nb-nav--open .nb-nav__links .ui.dropdown { flex-direction: column; align-items: stretch; }
    .nb-nav--open .nb-nav__links .ui.dropdown > .menu { display: block !important; position: static; width: 100%; box-shadow: none; border: 0; margin: 0; background: transparent; }
    .nb-nav--open .nb-nav__links .ui.dropdown > .dropdown.icon { display: none; }
    body.nb-nav-overlay.nb-home .nb-nav--open { --nb-text: var(--nb-text); }
    .nb-hero__stats { grid-template-columns: repeat(2, 1fr); }
    .nb-banner { flex-direction: column; align-items: flex-start; }
}
@media (max-width: 640px) {
    .nb-grid--2, .nb-grid--3, .nb-grid--4, .nb-rows, .nb-modes { grid-template-columns: 1fr; }
    .nb-split .nb-grid { grid-template-columns: 1fr; }
    .nb-grid--staff { grid-template-columns: repeat(2, 1fr); }
    .nb-container, .nb-notices, body.nebula .ui.container.nb-content { padding-left: 18px; padding-right: 18px; }
    .nb-footer__grid { grid-template-columns: 1fr; gap: 2rem; }
    .nb-status { margin-left: 0; }
    .nb-gallery { grid-auto-rows: 140px; } .nb-shot:nth-child(1) { grid-row: span 1; }
    .nb-server { padding: 1.4rem; }
    .nb-step { flex-wrap: wrap; } .nb-step__n { display: none; }
    .nb-hero__inner { padding-top: 7rem; }
    .nb-mode { aspect-ratio: 4/5; }
    .nb-count { grid-template-columns: repeat(4, 1fr); gap: .4rem; }
}
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } .nb-marquee__track, .nb-pulse { animation: none !important; } }

/* ---------- mobile fixes: nav drawer, login buttons, store header ---------- */
@media (max-width: 900px) {
    .nb-nav--open .nb-nav__links, .nb-nav--open .nb-nav__right { flex: 0 0 100%; width: 100%; margin-left: 0; justify-content: flex-start; }
    .nb-nav--open .nb-nav__links .item { width: 100%; }
    body.nebula .ui.segment > span.right.floated { position: static; display: block; float: none !important; margin: 0 0 1rem; }
    body.nebula .ui.segment > span.right.floated .ui.buttons { display: flex; flex-wrap: wrap; }
}
body.nebula form#form-login .ui.button, body.nebula form.ui.form .ui.button.right.floated { float: none !important; }
body.nebula form#form-login .ui.button { margin: .35rem .5rem .35rem 0; }
@media (max-width: 640px) {
    body.nebula form#form-login .ui.button { display: flex; width: 100%; margin: .5rem 0; }
}

/* ==========================================================================
   NEBULA layer — neon pixel-city look (hero + status panel, colour server cards,
   info panels, HUD frame). Loaded last, so it overrides the Voltage-derived base.
   ========================================================================== */
:root { --nb-line: rgba(var(--nb-primary-rgb), .38); --nb-glow: 0 0 22px rgba(var(--nb-primary-rgb), .35); --nb-ok-neon: #3df08a; }
body.nebula .nb-btn, body.nebula .ui.button { border-radius: var(--nb-radius); }
.nb-btn--primary { background: linear-gradient(180deg, rgba(var(--nb-primary-rgb), 1), color-mix(in srgb, var(--nb-primary) 70%, #3b0a8f)); box-shadow: 0 0 0 1px rgba(var(--nb-primary-rgb), .6), var(--nb-glow); }
.nb-btn--outline { background: rgba(var(--nb-primary-rgb), .06); color: var(--nb-primary) !important; border-color: var(--nb-line); }
.nb-btn--outline:hover { background: rgba(var(--nb-primary-rgb), .18); border-color: var(--nb-primary); }
body:not(.dark) .nb-btn--outline { color: var(--nb-primary-600) !important; }
.nb-btn--outline-light { border-color: rgba(255,255,255,.28); background: rgba(0,0,0,.35); }

/* HUD frame: neon corner brackets around the viewport */
body.nb-hud:before { content: ''; position: fixed; inset: 10px; z-index: 40; pointer-events: none; opacity: .55;
    --b: linear-gradient(var(--nb-primary), var(--nb-primary));
    background: var(--b) 0 0 / 34px 1px no-repeat, var(--b) 0 0 / 1px 34px no-repeat, var(--b) 100% 0 / 34px 1px no-repeat, var(--b) 100% 0 / 1px 34px no-repeat,
        var(--b) 0 100% / 34px 1px no-repeat, var(--b) 0 100% / 1px 34px no-repeat, var(--b) 100% 100% / 34px 1px no-repeat, var(--b) 100% 100% / 1px 34px no-repeat;
    border: 1px solid rgba(var(--nb-primary-rgb), .1); }
@media (max-width: 900px) { body.nb-hud:before { display: none; } }

/* HUD panel (hero status, info panels) */
.nb-panel { position: relative; background: linear-gradient(180deg, rgba(var(--nb-primary-rgb), .07), rgba(10, 7, 20, .82)); border: 1px solid var(--nb-line); border-radius: 4px; backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); color: var(--nb-text); box-shadow: inset 0 0 30px rgba(var(--nb-primary-rgb), .05); }
body:not(.dark) .nb-panel { background: var(--nb-surface); }
.nb-panel:before { content: ''; position: absolute; left: 14px; top: -1px; width: 56px; height: 2px; background: var(--nb-ok-neon); box-shadow: 0 0 10px var(--nb-ok-neon); }

/* ---------- hero ---------- */
.nb-hero { min-height: 0; }
.nb-hero--tall { min-height: 100svh; } .nb-hero--normal { min-height: 640px; } .nb-hero--short { min-height: 500px; }
.nb-hero__bg { background: radial-gradient(55% 70% at 70% 40%, rgba(var(--nb-primary-rgb), .3), transparent 70%), url(../img/city.svg) 50% 100% / cover no-repeat, #06040d; }
.nb-hero[style*="--nb-hero-image"] .nb-hero__bg { background: var(--nb-hero-image) center / cover no-repeat; }
.nb-hero__shade { background: linear-gradient(90deg, rgba(6,4,13,.92), rgba(6,4,13,.55) 38%, rgba(6,4,13,.05) 70%), linear-gradient(180deg, rgba(6,4,13,.55), transparent 28%, transparent 70%, #06040d); }
.nb-hero__inner { display: grid; grid-template-columns: minmax(0, 1fr) 320px; gap: 2rem; align-items: start; padding-top: 7.5rem; padding-bottom: 5.5rem; }
.nb-hero__main { display: flex; flex-direction: column; align-items: flex-start; min-width: 0; }
.nb-hero__kicker { margin: 0; font-family: var(--nb-font-mono); font-size: 1.15rem; letter-spacing: .32em; text-transform: uppercase; color: #fff; }
.nb-hero__title { margin: .5rem 0 0; max-width: none; font-size: clamp(2.8rem, 7vw, 5.6rem); line-height: .98; letter-spacing: .01em; text-shadow: 0 0 24px rgba(255,255,255,.18); }
.nb-hero__title .nb-accent { color: var(--nb-primary) !important; text-shadow: 0 0 26px rgba(var(--nb-primary-rgb), .75); }
.nb-hero__title small { display: block; margin-top: .4rem; font-family: var(--nb-font-mono); font-size: clamp(1.1rem, 2.2vw, 1.7rem); font-weight: 600; letter-spacing: .14em; text-transform: uppercase; text-shadow: none; }
.nb-hero__sub { max-width: 30rem; margin-top: 1.1rem; font-size: 1rem; color: rgba(255,255,255,.82); }
.nb-hero__actions { margin-top: 1.5rem; gap: .8rem; }
.nb-ip--box { display: flex; align-items: center; gap: .8rem; width: min(100%, 24rem); margin-top: 1rem; padding: .75rem .9rem; border-radius: 4px; border: 1px solid var(--nb-line); background: rgba(6,4,13,.6); }
.nb-ip--box .nb-ip__lead { color: var(--nb-primary); } .nb-ip--box .nb-ip__text { flex: 1; text-align: left; font-weight: 500; color: rgba(255,255,255,.9); }
.nb-ip--box .nb-ip__btn { padding: .3rem .5rem; background: transparent; } .nb-ip--box .nb-ip__lbl { display: none; }
.nb-ip--box:hover { border-color: var(--nb-primary); }

.nb-hero__panel { margin-top: .6rem; padding: 0; align-self: start; }
.nb-panel__head { display: flex; align-items: center; gap: .8rem; padding: 1.1rem 1.2rem 1rem; border-bottom: 1px solid var(--nb-border); }
.nb-panel__head > i { font-size: 1.5rem; color: var(--nb-ok-neon); }
.nb-panel__head span { display: block; font-family: var(--nb-font-mono); font-size: .72rem; letter-spacing: .18em; text-transform: uppercase; color: var(--nb-muted); }
.nb-panel__head b { display: block; font-family: var(--nb-font-mono); font-size: .9rem; letter-spacing: .14em; text-transform: uppercase; } .nb-panel__head b.is-on { color: var(--nb-ok-neon); } .nb-panel__head b.is-off { color: var(--nb-off); }
.nb-panel__row { padding: 1rem 1.2rem; border-bottom: 1px solid var(--nb-border); }
.nb-panel__label { display: block; font-family: var(--nb-font-mono); font-size: .7rem; letter-spacing: .12em; text-transform: uppercase; color: var(--nb-muted); }
.nb-panel__big { display: block; font-family: var(--nb-font-head); font-size: 3rem; line-height: 1.1; color: var(--nb-ok-neon); text-shadow: 0 0 18px rgba(61,240,138,.45); }
.nb-panel__servers { display: flex; align-items: center; gap: .6rem; margin-top: .3rem; font-family: var(--nb-font-mono); font-size: 1.15rem; color: #fff; }
.nb-ring { width: 12px; height: 12px; border-radius: 50%; border: 2px solid var(--nb-ok-neon); box-shadow: 0 0 8px var(--nb-ok-neon); }
.nb-panel__btn { display: flex; align-items: center; justify-content: space-between; margin: 1rem 1.2rem 1.2rem; padding: .7rem .9rem; border: 1px solid var(--nb-line); border-radius: 3px; color: rgba(255,255,255,.9) !important; font-family: var(--nb-font-mono); font-size: .74rem; letter-spacing: .1em; text-transform: uppercase; text-decoration: none; }
.nb-panel__btn:hover { background: rgba(var(--nb-primary-rgb), .16); border-color: var(--nb-primary); }
body:not(.dark) .nb-panel__row, body:not(.dark) .nb-panel__head { border-color: var(--nb-border); }

/* ---------- servers (colour cards) ---------- */
.nb-section--gamemodes { padding: 0 0 1.4rem; margin-top: -3.2rem; z-index: 5; }
.nb-section__head--chip { max-width: none; margin: 0 0 1.2rem; text-align: center; }
.nb-section__head--chip h2 { font-size: clamp(1.8rem, 4vw, 2.8rem); }
.nb-chipbar { display: inline-flex; align-items: center; gap: .7rem; padding: .5rem 1.4rem; border: 1px solid var(--nb-line); border-radius: 3px; background: rgba(6,4,13,.85); font-family: var(--nb-font-mono); font-size: .85rem; letter-spacing: .2em; text-transform: uppercase; color: var(--nb-text); box-shadow: var(--nb-glow); }
.nb-chipbar i { color: var(--nb-primary); font-size: .75rem; } .nb-chipbar .nb-flip { transform: scaleX(-1); }
.nb-modes { grid-template-columns: repeat(auto-fit, minmax(176px, 1fr)); gap: .8rem; }
.nb-tone--green { --c: #3df08a; --c-rgb: 61,240,138; } .nb-tone--blue { --c: #3fa5ff; --c-rgb: 63,165,255; } .nb-tone--red { --c: #ff4d4d; --c-rgb: 255,77,77; }
.nb-tone--purple { --c: #b57bff; --c-rgb: 181,123,255; } .nb-tone--gold { --c: #ffbe2e; --c-rgb: 255,190,46; } .nb-tone--pink { --c: #ff55d6; --c-rgb: 255,85,214; }
.nb-mode { aspect-ratio: auto; display: flex; flex-direction: column; border-radius: 6px; border: 1px solid rgba(var(--c-rgb), .55); background: linear-gradient(180deg, rgba(var(--c-rgb), .08), rgba(10,7,20,.92) 60%); box-shadow: inset 0 0 26px rgba(var(--c-rgb), .08), 0 0 18px -6px rgba(var(--c-rgb), .5); color: var(--nb-text) !important; transition: transform .2s, box-shadow .2s; }
.nb-mode:hover { transform: translateY(-3px); border-color: var(--c); box-shadow: inset 0 0 26px rgba(var(--c-rgb), .12), 0 0 26px -4px rgba(var(--c-rgb), .7); }
.nb-mode:after { display: none; }
.nb-mode__art { position: relative; height: 122px; background-size: cover; background-position: center; background-image: radial-gradient(90% 100% at 50% 110%, rgba(var(--c-rgb), .55), transparent 70%), linear-gradient(180deg, rgba(var(--c-rgb), .22), rgba(10,7,20,.9)); }
.nb-mode__art:before { content: ''; position: absolute; inset: 0; background: repeating-linear-gradient(0deg, rgba(0,0,0,.18) 0 4px, transparent 4px 8px), repeating-linear-gradient(90deg, rgba(0,0,0,.12) 0 4px, transparent 4px 8px); mix-blend-mode: multiply; opacity: .5; }
.nb-mode__art:after { content: ''; position: absolute; inset: 0; background: linear-gradient(180deg, transparent 45%, rgba(10,7,20,.95)); }
.nb-mode__glyph { position: absolute; inset: 0; z-index: 1; display: grid; place-items: center; font-size: 4.6rem; color: rgba(var(--c-rgb), .5); text-shadow: 0 0 22px rgba(var(--c-rgb), .8); }
.nb-mode__art[style*="url"] .nb-mode__glyph { display: none; }
.nb-mode__body { position: static; display: flex; flex-direction: column; flex: 1; padding: .2rem 1rem 1rem; margin-top: -1.4rem; z-index: 2; }
.nb-mode__body h3 { color: var(--c) !important; font-size: 1.3rem; letter-spacing: .08em; text-transform: uppercase; text-shadow: 0 0 14px rgba(var(--c-rgb), .55); }
.nb-mode__tag { margin-top: .15rem; font-family: var(--nb-font-mono); font-size: .64rem; letter-spacing: .14em; text-transform: uppercase; color: var(--nb-muted); }
.nb-mode__players { margin-top: .7rem; display: inline-flex; align-items: center; gap: .45rem; font-family: var(--nb-font-mono); font-size: .76rem; color: var(--nb-text); } .nb-mode__players i { color: var(--c); font-size: .68rem; }
.nb-mode__body p { margin: .6rem 0 1rem; flex: 1; color: var(--nb-muted); font-size: .8rem; line-height: 1.45; }
.nb-mode__btn { display: block; padding: .6rem; text-align: center; border: 1px solid var(--c); border-radius: 3px; color: var(--c) !important; font-family: var(--nb-font-mono); font-size: .7rem; letter-spacing: .14em; text-transform: uppercase; text-decoration: none; background: rgba(var(--c-rgb), .05); transition: background .15s; }
a.nb-mode__btn:hover { background: rgba(var(--c-rgb), .2); }
.nb-mode__btn.is-disabled { opacity: .7; cursor: default; }
.nb-mode.is-soon { filter: saturate(.75); }
.nb-mode.is-soon:hover { transform: none; }

/* ---------- info panels ---------- */
.nb-section--dashboard { padding: 0 0 2.2rem; }
.nb-dash { display: grid; grid-template-columns: repeat(var(--nb-panels, 4), minmax(0, 1fr)); gap: .8rem; }
.nb-dash__panel { padding: 1.1rem 1.2rem 1.2rem; }
.nb-dash__title { display: flex; align-items: center; gap: .6rem; margin: 0 0 .9rem; font-family: var(--nb-font-head); font-size: .95rem; font-weight: 600; letter-spacing: .1em; text-transform: uppercase; color: var(--nb-text); }
.nb-dash__title i { color: var(--nb-primary); font-size: .85rem; }
.nb-dash__list { list-style: none; margin: 0 0 1rem; padding: 0; display: grid; gap: .55rem; }
.nb-dash__list li { display: flex; align-items: center; gap: .65rem; font-size: .84rem; }
.nb-dash__list .pos { width: 1.6rem; font-family: var(--nb-font-mono); font-size: .78rem; color: var(--nb-primary); }
.nb-dash__list .val { margin-left: auto; font-family: var(--nb-font-mono); font-size: .74rem; color: var(--nb-muted); }
.nb-av { width: 26px; height: 26px; flex: none; display: inline-grid; place-items: center; border-radius: 3px; background: hsl(var(--h, 270) 55% 32%); border: 1px solid hsl(var(--h, 270) 70% 55%); color: #fff; font-family: var(--nb-font-head); font-size: .8rem; image-rendering: pixelated; }
img.nb-av { padding: 0; object-fit: cover; background: none; }
.nb-dash__product { display: flex; gap: 1rem; align-items: center; }
.nb-dash__thumb { width: 86px; height: 86px; flex: none; display: grid; place-items: center; border-radius: 4px; border: 1px solid var(--nb-line); background: radial-gradient(circle at 50% 60%, rgba(var(--nb-primary-rgb), .45), rgba(10,7,20,.9)) center / cover; font-size: 2rem; color: var(--nb-primary-300); text-shadow: 0 0 18px var(--nb-primary); }
.nb-dash__thumb[style*="url"] i { display: none; }
.nb-dash__pname { display: block; font-family: var(--nb-font-head); font-size: 1.05rem; letter-spacing: .06em; text-transform: uppercase; color: var(--nb-primary); }
.nb-dash__product ul { list-style: none; margin: .4rem 0 0; padding: 0; font-size: .76rem; color: var(--nb-muted); display: grid; gap: .1rem; } .nb-dash__product li:before { content: '• '; color: var(--nb-primary); }
.nb-dash__buy { display: flex; align-items: center; justify-content: space-between; gap: .8rem; margin-top: 1rem; }
.nb-dash__price { font-family: var(--nb-font-mono); font-size: .82rem; color: var(--nb-accent); }
.nb-dash__feed { list-style: none; margin: 0; padding: 0; display: grid; gap: .6rem; }
.nb-dash__feed li { display: flex; gap: .7rem; align-items: center; }
.nb-dash__feed .ico { width: 30px; height: 30px; flex: none; display: grid; place-items: center; border-radius: 3px; background: rgba(var(--nb-primary-rgb), .16); border: 1px solid var(--nb-line); color: var(--nb-primary); font-size: .78rem; }
.nb-dash__feed p { margin: 0; font-size: .8rem; line-height: 1.3; color: var(--nb-mist); } .nb-dash__feed b { color: var(--nb-text); }
.nb-dash__feed small { font-family: var(--nb-font-mono); font-size: .66rem; color: var(--nb-muted); }
.nb-dash__social { padding: 0; display: grid; gap: .8rem; align-content: start; }
.nb-dash__follow { padding: 1.1rem 1.2rem; } .nb-dash__follow .nb-dash__title { margin-bottom: .3rem; } .nb-dash__follow p { margin: 0 0 .8rem; }
.nb-dash__icons { display: flex; gap: .7rem; } .nb-dash__icons a { font-size: 1.35rem; color: #fff !important; transition: transform .15s, filter .15s; } .nb-dash__icons a:hover { transform: translateY(-2px); filter: drop-shadow(0 0 8px currentColor); }
.nb-dash__icons a:nth-child(1) { color: #7c85ff !important; } .nb-dash__icons a:nth-child(3) { color: #2aa8ff !important; } .nb-dash__icons a:nth-child(4) { color: #ff6ab8 !important; } .nb-dash__icons a:nth-child(5) { color: #ff3b3b !important; }
.nb-dash__discord { display: flex; align-items: center; gap: .9rem; padding: .9rem 1.2rem; text-decoration: none; background: linear-gradient(100deg, rgba(88,101,242,.35), rgba(var(--nb-primary-rgb), .18)); color: var(--nb-text) !important; }
.nb-dash__discord:before { display: none; }
.nb-dash__discord .ico { width: 44px; height: 44px; display: grid; place-items: center; border-radius: 8px; background: #5865f2; color: #fff; font-size: 1.5rem; }
.nb-dash__discord strong { display: block; font-family: var(--nb-font-head); letter-spacing: .08em; text-transform: uppercase; } .nb-dash__discord small { font-family: var(--nb-font-mono); font-size: .66rem; letter-spacing: .08em; text-transform: uppercase; color: var(--nb-muted); }
.nb-dash__discord > i { margin-left: auto; color: var(--nb-primary); }
.nb-dash__discord:hover { border-color: var(--nb-primary); }

/* ---------- navbar polish ---------- */
.nb-logo__main { letter-spacing: .02em; text-transform: none; font-size: 1.35rem; }
.nb-nav__links .item, .nb-nav__item { font-family: var(--nb-font); font-size: .74rem; letter-spacing: .12em; }
.nb-nav__links .item.active { box-shadow: inset 0 -2px 0 var(--nb-primary); border-radius: 0; }

@media (max-width: 1180px) { .nb-dash { grid-template-columns: repeat(2, minmax(0, 1fr)); } }
@media (max-width: 980px) {
    .nb-hero__inner { grid-template-columns: 1fr; padding-top: 6.5rem; padding-bottom: 4.5rem; }
    .nb-hero__panel { max-width: 380px; }
}
@media (max-width: 640px) {
    .nb-dash { grid-template-columns: 1fr; }
    .nb-modes { grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }
    .nb-mode { aspect-ratio: auto; }
    .nb-section--gamemodes { margin-top: -2rem; }
}