/* ==========================================================================
   Blockhaven for NamelessMC — blocky, bevelled UI inspired by the game's own look.
   Colours / fonts / bevel size are injected as CSS variables by PHP (Blockhaven::themeCss).
   ========================================================================== */

:root {
    --bh-primary: #3c8527; --bh-primary-rgb: 60,133,39; --bh-primary-600: #2b6019; --bh-primary-700: #1e4311; --bh-primary-300: #5aa743;
    --bh-accent: #f2c230; --bh-accent-rgb: 242,194,48;
    --bh-px: 3px; --bh-radius: 0px; --bh-radius-sm: 0px;
    --bh-font: 'Montserrat', system-ui, sans-serif;
    --bh-font-head: 'Minecraft', 'Pixelify Sans', monospace;
    --bh-head-spacing: .02em; --bh-head-weight: 400;
    --bh-container: 1180px;

    --bh-sky: #6fb1ee; --bh-sky-2: #c4e3fb; --bh-far: #7aa3d3; --bh-mid: #4f8f3a; --bh-near: #34692a;

    /* light surfaces */
    --bh-bg: #dcdedc;
    --bh-surface: #f4f4f2;
    --bh-surface-2: #e4e5e3;
    --bh-border: rgba(0, 0, 0, .14);
    --bh-edge: #1a1a1a;                 /* the black outline blocks have */
    --bh-text: #1c1d1f;
    --bh-muted: #585c60;
    --bh-shadow: 0 4px 0 rgba(0, 0, 0, .18);
    --bh-ok: #3c8527; --bh-off: #c0392b;
}
body.dark {
    --bh-bg: #171818;
    --bh-surface: #242526;
    --bh-surface-2: #313233;
    --bh-border: rgba(255, 255, 255, .09);
    --bh-edge: #000;
    --bh-text: #f2f2f2;
    --bh-muted: #a9abae;
    --bh-shadow: 0 4px 0 rgba(0, 0, 0, .45);
    color-scheme: dark;
}

/* ---------- base ---------- */
html { scroll-behavior: smooth; height: auto !important; }
body.blockhaven {
    height: auto !important;
    font-family: var(--bh-font);
    background: var(--bh-bg);
    color: var(--bh-text);
    -webkit-font-smoothing: antialiased;
    line-height: 1.65;
    min-height: 100vh;
    overflow-x: hidden;
}
body.bh-tex-dirt { background-image: var(--bh-tex-dirt); background-size: 64px; image-rendering: pixelated; background-blend-mode: normal; }
body.bh-tex-stone { background-image: var(--bh-tex-stone); background-size: 64px; }
body.bh-tex-deepslate { background-image: var(--bh-tex-deepslate); background-size: 64px; }
body.blockhaven h1, body.blockhaven h2, body.blockhaven h3, body.blockhaven h4, body.blockhaven h5, body.blockhaven .ui.header {
    font-family: var(--bh-font-head); font-weight: var(--bh-head-weight); letter-spacing: var(--bh-head-spacing); color: var(--bh-text); line-height: 1.25;
}
body.blockhaven a { color: var(--bh-primary-300); }
body.blockhaven:not(.dark) a { color: var(--bh-primary-600); }
body.blockhaven a:hover { color: var(--bh-accent); }
body.blockhaven ::selection { background: var(--bh-primary); color: #fff; }
.bh-container { width: 100%; max-width: var(--bh-container); margin: 0 auto; padding: 0 24px; }
.bh-container--narrow { max-width: 860px; }
.bh-center { text-align: center; }
.bh-muted { color: var(--bh-muted); }
.bh-small { font-size: .875rem; }
.bh-grad { color: var(--bh-accent); text-shadow: 0 var(--bh-px) 0 rgba(0, 0, 0, .5); }
body.blockhaven #wrapper, .bh-wrapper { background: transparent; }
.bh-px-text { text-shadow: 0 var(--bh-px) 0 rgba(0, 0, 0, .55); }

/* ---------- blocks: the shared bevelled surface ---------- */
.bh-card, .bh-block {
    background: var(--bh-surface);
    border: var(--bh-px) solid var(--bh-edge);
    border-radius: var(--bh-radius);
    box-shadow: inset 0 var(--bh-px) 0 rgba(255, 255, 255, .07), inset 0 calc(var(--bh-px) * -1) 0 rgba(0, 0, 0, .22), var(--bh-shadow);
    padding: 1.5rem;
    transition: transform .15s ease, border-color .15s ease;
}
body:not(.dark) .bh-card, body:not(.dark) .bh-block { box-shadow: inset 0 var(--bh-px) 0 rgba(255, 255, 255, .8), inset 0 calc(var(--bh-px) * -1) 0 rgba(0, 0, 0, .1), var(--bh-shadow); }
.bh-card h3 { margin: 0 0 .5rem; font-size: 1.05rem; }
.bh-card p { margin: 0; color: var(--bh-muted); font-size: .94rem; }
.bh-reveal { opacity: 0; transform: translateY(14px); transition: opacity .5s steps(6), transform .5s steps(6); }
.bh-reveal.is-in { opacity: 1; transform: none; }
.bh-no-anim .bh-reveal { opacity: 1; transform: none; transition: none; }

/* ---------- buttons (the game's chunky buttons) ---------- */
.bh-btn, body.blockhaven .ui.button {
    display: inline-flex; align-items: center; justify-content: center; gap: .55rem;
    font-family: var(--bh-font-head); font-weight: var(--bh-head-weight); letter-spacing: var(--bh-head-spacing);
    text-transform: uppercase; font-size: .9rem; line-height: 1.1; text-decoration: none; cursor: pointer;
    padding: .85rem 1.3rem; border-radius: var(--bh-radius);
    color: #fff !important; background: var(--bh-primary);
    border: var(--bh-px) solid var(--bh-edge);
    box-shadow: inset 0 calc(var(--bh-px) * -2) 0 rgba(0, 0, 0, .34), inset var(--bh-px) var(--bh-px) 0 rgba(255, 255, 255, .3);
    text-shadow: 0 2px 0 rgba(0, 0, 0, .5);
    transition: background .08s, transform .08s;
    margin: 0;
}
.bh-btn:hover, body.blockhaven .ui.button:hover { background: var(--bh-primary-300); color: #fff !important; text-decoration: none; }
.bh-btn:active, body.blockhaven .ui.button:active { transform: translateY(2px); box-shadow: inset 0 calc(var(--bh-px) * -1) 0 rgba(0, 0, 0, .34), inset var(--bh-px) var(--bh-px) 0 rgba(255, 255, 255, .2); }
.bh-btn--sm { padding: .6rem 1rem; font-size: .78rem; }
.bh-btn--lg { padding: 1.05rem 1.7rem; font-size: 1rem; }
.bh-btn--block { width: 100%; }
.bh-btn--primary { background: var(--bh-primary); }
.bh-btn--ghost, body.blockhaven .ui.basic.button, body.blockhaven .ui.default.button, body.blockhaven .ui.button.bh-ghost {
    background: #6b6c6e; color: #fff !important;
}
.bh-btn--ghost:hover, body.blockhaven .ui.basic.button:hover, body.blockhaven .ui.default.button:hover { background: #848587; }
.bh-btn--light { background: #fff; color: #111 !important; text-shadow: none; }
.bh-btn--light:hover { background: #e9e9e9; color: #111 !important; }
.bh-btn--gold { background: var(--bh-accent); color: #1a1405 !important; text-shadow: none; }
.bh-btn--gold:hover { filter: brightness(1.1); background: var(--bh-accent); color: #1a1405 !important; }
body.blockhaven .ui.red.button, body.blockhaven .ui.negative.button { background: #b3322b; }
body.blockhaven .ui.green.button, body.blockhaven .ui.positive.button, body.blockhaven .ui.primary.button, body.blockhaven .ui.blue.button { background: var(--bh-primary); }
.bh-iconbtn, body.blockhaven .ui.icon.button.bh-iconbtn {
    display: inline-grid; place-items: center; width: 42px; height: 42px; padding: 0; margin: 0; cursor: pointer;
    background: #3b3c3d; color: #fff !important; border: var(--bh-px) solid var(--bh-edge); border-radius: var(--bh-radius);
    box-shadow: inset 0 calc(var(--bh-px) * -1.5) 0 rgba(0, 0, 0, .35), inset var(--bh-px) var(--bh-px) 0 rgba(255, 255, 255, .15);
}
.bh-iconbtn:hover { background: #55565a; }
.bh-iconbtn i.icon { margin: 0; }
.bh-ico-light { display: none; }
body.dark .bh-ico-dark { display: none; }
body.dark .bh-ico-light { display: inline; }

/* ---------- announcement ---------- */
.bh-announce { background: var(--bh-primary-600); color: #fff; font-size: .85rem; padding: .55rem 0; text-align: center; border-bottom: var(--bh-px) solid var(--bh-edge); }
.bh-announce a { color: var(--bh-accent) !important; font-weight: 700; margin-left: .75rem; }
.bh-announce--gradient { background: linear-gradient(90deg, var(--bh-primary-600), var(--bh-primary)); }
.bh-announce--subtle { background: var(--bh-surface-2); color: var(--bh-text); }

/* ---------- navbar ---------- */
.bh-nav { position: relative; z-index: 60; background: #1b1b1c; border-bottom: var(--bh-px) solid #000; box-shadow: inset 0 calc(var(--bh-px) * -1) 0 rgba(255, 255, 255, .06); }
.bh-nav__inner { display: flex; align-items: center; gap: 1.2rem; min-height: 64px; }
.bh-logo { display: inline-flex; align-items: center; gap: .6rem; color: #fff !important; text-decoration: none; font-family: var(--bh-font-head); font-size: 1.15rem; letter-spacing: .03em; text-shadow: 0 2px 0 rgba(0, 0, 0, .6); }
.bh-logo img { max-height: 40px; }
.bh-logo b { color: var(--bh-accent); font-weight: inherit; }
.bh-logo__mark { display: inline-grid; place-items: center; width: 32px; height: 32px; background: var(--bh-primary); border: var(--bh-px) solid #000; box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .35), inset 2px 2px 0 rgba(255, 255, 255, .3); color: #fff; font-size: .8rem; }
.bh-nav__links { display: flex; align-items: center; justify-content: center; gap: .15rem; flex: 1; flex-wrap: wrap; }
.bh-nav__links .item, .bh-nav__item {
    display: inline-flex; align-items: center; gap: .45rem; padding: .55rem .9rem; color: #d7d8da !important; text-decoration: none; cursor: pointer;
    font-family: var(--bh-font-head); font-size: .85rem; letter-spacing: .04em; text-transform: uppercase; position: relative; text-shadow: 0 2px 0 rgba(0, 0, 0, .5);
}
.bh-nav__links .item:hover { color: #fff !important; background: rgba(255, 255, 255, .08); }
.bh-nav__links .item.active { color: #fff !important; }
.bh-nav__links .item.active:after { content: ''; position: absolute; left: .9rem; right: .9rem; bottom: 2px; height: var(--bh-px); background: var(--bh-primary-300); }
.bh-nav__links .item i.icon { margin: 0; }
.bh-nav__links .ui.dropdown .menu { background: #232324; border: var(--bh-px) solid #000; border-radius: 0; box-shadow: var(--bh-shadow); margin-top: 4px; }
.bh-nav__links .ui.dropdown .menu .item { color: #e5e5e5 !important; padding: .7rem 1rem !important; border-top-color: rgba(255, 255, 255, .06); display: flex; }
.bh-nav__links .ui.dropdown .menu .header { color: var(--bh-muted); font-size: .7rem; padding: .6rem 1rem 0; }
.bh-nav__right { display: flex; align-items: center; gap: .5rem; margin-left: auto; }
.bh-nav__toggle { display: none; background: #3b3c3d; border: var(--bh-px) solid #000; color: #fff; width: 44px; height: 44px; margin-left: auto; font-size: 1.1rem; }
.bh-account.ui.label, body.blockhaven .ui.medium.image.label.bh-account { background: #3b3c3d !important; color: #fff !important; border: var(--bh-px) solid #000; border-radius: 0; padding: .3rem .9rem .3rem .3rem !important; font-family: var(--bh-font-head); font-size: .8rem; font-weight: 400; }
.bh-account img { border-radius: 0 !important; }
body.bh-nav-overlay.bh-home .bh-nav { position: absolute; left: 0; right: 0; top: 0; background: linear-gradient(rgba(0, 0, 0, .55), transparent); border: 0; box-shadow: none; }
body.bh-nav-overlay.bh-home .bh-nav .bh-logo { display: none; }
body.bh-nav-overlay.bh-home .bh-nav__links { position: absolute; left: 50%; transform: translateX(-50%); flex: none; }
body.bh-nav-overlay.bh-home .bh-nav__inner { min-height: 76px; }

/* popups (user menu) */
body.blockhaven .ui.popup { border-radius: 0; background: var(--bh-surface); color: var(--bh-text); border: var(--bh-px) solid var(--bh-edge); box-shadow: var(--bh-shadow); }
body.blockhaven .ui.popup:before { background: var(--bh-surface); box-shadow: none; border-color: var(--bh-edge); }
body.blockhaven .ui.popup .header, body.blockhaven .ui.popup .ui.header { color: var(--bh-text); }
body.blockhaven .ui.link.list .item, body.blockhaven .ui.link.list a.item { color: var(--bh-muted) !important; }
body.blockhaven .ui.link.list a.item:hover { color: var(--bh-primary-300) !important; }
body.blockhaven .ui.divider { border-color: var(--bh-border); }

/* ---------- inner page header ---------- */
.bh-page-head { padding: 2.6rem 0 1.8rem; margin-bottom: 2rem; position: relative; background: var(--bh-surface-2); border-bottom: var(--bh-px) solid var(--bh-edge); overflow: hidden; }
.bh-page-head:before { content: ''; position: absolute; inset: 0; background: var(--bh-tex-stone); background-size: 64px; opacity: .8; }
.bh-page-head .bh-container { position: relative; }
.bh-page-head h1 { font-size: clamp(1.5rem, 3vw, 2.2rem); margin: 0; text-shadow: 0 var(--bh-px) 0 rgba(0, 0, 0, .35); }
.bh-main { min-height: 60vh; }
.bh-content { padding-bottom: 4rem; }
.bh-notices { max-width: var(--bh-container); margin: 0 auto; padding: 0 24px; }
.bh-notices .ui.message:first-child { margin-top: 1rem; }
body.blockhaven .ui.container.bh-content { width: 100% !important; max-width: var(--bh-container) !important; margin: 0 auto !important; padding: 0 24px; }

/* ---------- hero: layered pixel landscape + centred logo (server-showcase layout) ---------- */
.bh-hero { position: relative; overflow: hidden; isolation: isolate; border-bottom: var(--bh-px) solid var(--bh-edge); display: flex; align-items: center; min-height: 520px; }
.bh-hero > .bh-container { width: 100%; }
.bh-hero__scene { position: absolute; inset: 0; z-index: -1; background: linear-gradient(var(--bh-sky), var(--bh-sky-2)); }
.bh-hero[style*="--bh-hero-image"] .bh-hero__scene { background: var(--bh-hero-image) center / cover no-repeat; }
.bh-hero[style*="--bh-hero-image"] .bh-landscape { display: none; }
.bh-hero__scene:after { content: ''; position: absolute; inset: 0; background: linear-gradient(rgba(0, 0, 0, .35), rgba(0, 0, 0, .05) 40%, rgba(0, 0, 0, .55)); }
.bh-landscape { position: absolute; left: 0; right: 0; bottom: 0; width: 100%; height: 100%; }
.bh-ls-cloud { fill: #fff; opacity: .85; }
.bh-ls-far { fill: var(--bh-far); }
.bh-ls-mid { fill: var(--bh-mid); }
.bh-ls-trunk { fill: #5b3f23; }
.bh-ls-leaf { fill: var(--bh-near); opacity: .95; }
.bh-ls-near { fill: var(--bh-near); }
.bh-ls-edge { fill: var(--bh-primary-300); }
.bh-hero__inner { display: grid; grid-template-columns: 1fr auto 1fr; align-items: center; gap: 2rem; padding-top: 6rem; padding-bottom: 6.5rem; }
.bh-hero--tall { min-height: 680px; }
.bh-hero--normal { min-height: 520px; }
.bh-hero--full { min-height: calc(100vh - 4px); display: flex; align-items: center; }
.bh-hero--full .bh-hero__inner { width: 100%; }
.bh-hero__logo { text-align: center; }
.bh-hero__logo img { max-width: min(460px, 70vw); max-height: 220px; filter: drop-shadow(0 6px 0 rgba(0, 0, 0, .35)); }
.bh-title { margin: 0; font-family: var(--bh-font-head); font-weight: var(--bh-head-weight); font-size: clamp(2.2rem, 6.4vw, 4.8rem); line-height: 1.02; color: #fff !important; text-transform: uppercase; letter-spacing: .02em;
    text-shadow: 0 .06em 0 var(--bh-primary-700), 0 .12em 0 rgba(0, 0, 0, .55), .04em .04em 0 var(--bh-primary-600); }
.bh-title span { color: var(--bh-accent); text-shadow: 0 .06em 0 #7a5d0a, 0 .12em 0 rgba(0, 0, 0, .55); }
.bh-hero__tag { margin: 1rem auto 0; max-width: 34ch; color: #fff; font-weight: 600; text-shadow: 0 2px 0 rgba(0, 0, 0, .7); }
.bh-badge { display: inline-flex; align-items: center; gap: .5rem; margin-bottom: 1rem; padding: .3rem .8rem; background: rgba(0, 0, 0, .55); color: var(--bh-accent); font-family: var(--bh-font-head); font-size: .75rem; text-transform: uppercase; border: 2px solid #000; }
.bh-dot { width: 9px; height: 9px; background: var(--bh-primary-300); display: inline-block; }
.bh-badge .bh-dot { animation: bh-blink 1.2s steps(2) infinite; }
@keyframes bh-blink { 50% { opacity: .25; } }
.bh-hero__side { display: flex; align-items: center; gap: 1.1rem; color: #fff; }
.bh-hero__side--left { justify-content: flex-end; text-align: right; }
.bh-hero__side--right { justify-content: flex-start; }
.bh-hero__side small { display: block; font-size: .72rem; letter-spacing: .08em; text-transform: uppercase; opacity: .9; }
.bh-hero__side strong { display: block; font-family: var(--bh-font-head); font-weight: 400; font-size: 1.15rem; color: #fff; text-shadow: 0 2px 0 rgba(0, 0, 0, .7); text-transform: uppercase; }
.bh-hero__side strong em { font-style: normal; color: var(--bh-accent); }
.bh-hero__side .bh-ipline { font-size: .85rem; font-weight: 700; text-shadow: 0 2px 0 rgba(0, 0, 0, .7); font-family: ui-monospace, monospace; }
.bh-playbtn { display: inline-grid; place-items: center; width: 64px; height: 64px; background: var(--bh-primary); color: #fff !important; font-size: 1.5rem; text-decoration: none; cursor: pointer;
    border: var(--bh-px) solid #000; box-shadow: inset 0 calc(var(--bh-px) * -2) 0 rgba(0, 0, 0, .34), inset var(--bh-px) var(--bh-px) 0 rgba(255, 255, 255, .3); }
.bh-playbtn:hover { background: var(--bh-primary-300); }
.bh-playbtn--discord { background: #5865f2; }
.bh-playbtn--discord:hover { background: #7683f5; }
.bh-playbtn.is-copied { background: var(--bh-accent); color: #111 !important; }

/* ---------- welcome bar (overlaps the hero) ---------- */
.bh-section--welcome { padding: 0; margin-top: -3.2rem; position: relative; z-index: 3; }
.bh-welcome { display: grid; grid-template-columns: 1fr 340px; gap: 1.2rem; align-items: stretch; }
.bh-welcome__panel { display: flex; align-items: center; gap: 1.4rem; padding: 1.2rem 1.5rem; }
.bh-welcome__skin { width: 76px; height: 76px; flex: none; image-rendering: pixelated; background: var(--bh-surface-2); border: var(--bh-px) solid var(--bh-edge); object-fit: cover; }
.bh-welcome__text { flex: 1; min-width: 0; }
.bh-welcome__text h2 { margin: 0 0 .2rem; font-size: 1.25rem; color: var(--bh-primary-300); }
body:not(.dark) .bh-welcome__text h2 { color: var(--bh-primary-600); }
.bh-welcome__text p { margin: 0; color: var(--bh-muted); font-size: .92rem; }
.bh-welcome__actions { display: flex; gap: .6rem; flex-wrap: wrap; }
.bh-promo { position: relative; display: grid; align-content: center; gap: .3rem; padding: 1.2rem 1.5rem; min-height: 112px; overflow: hidden; color: #fff !important; text-decoration: none;
    background: linear-gradient(135deg, var(--bh-primary-600), var(--bh-primary)); border: var(--bh-px) solid var(--bh-edge); box-shadow: inset 0 var(--bh-px) 0 rgba(255, 255, 255, .25), inset 0 calc(var(--bh-px) * -1) 0 rgba(0, 0, 0, .3), var(--bh-shadow); }
.bh-promo[style*="url"] { background-size: cover; background-position: center; }
.bh-promo:before { content: ''; position: absolute; inset: 0; background: linear-gradient(90deg, rgba(0, 0, 0, .55), rgba(0, 0, 0, .1)); }
.bh-promo > * { position: relative; }
.bh-promo h3 { margin: 0; color: #fff; font-size: 1.5rem; text-transform: uppercase; text-shadow: 0 3px 0 rgba(0, 0, 0, .55); }
.bh-promo span { font-weight: 600; text-shadow: 0 2px 0 rgba(0, 0, 0, .6); }
.bh-promo i { position: absolute; right: 1.3rem; top: 50%; transform: translateY(-50%); font-size: 2rem; opacity: .9; }
.bh-promo:hover { filter: brightness(1.1); }

/* ---------- sections ---------- */
.bh-section { padding: clamp(2.6rem, 6vw, 5rem) 0; position: relative; }
.bh-bg-alt { background: var(--bh-surface-2); border-block: var(--bh-px) solid var(--bh-edge); background-image: var(--bh-tex-stone); background-size: 64px; }
.bh-bg-glow { background: radial-gradient(60% 80% at 50% 0%, rgba(var(--bh-primary-rgb), .22), transparent 70%); }
.bh-section--stats, .bh-section--partners { padding: 1.4rem 0; }
.bh-section--server_status { padding-top: 2.4rem; }
.bh-section__head { max-width: 720px; margin: 0 auto 2.6rem; text-align: center; }
.bh-section__head h2 { font-size: clamp(1.5rem, 3.2vw, 2.3rem); margin: .5rem 0 .8rem; text-transform: uppercase; text-shadow: 0 var(--bh-px) 0 rgba(0, 0, 0, .35); }
.bh-section__head p { font-size: 1.02rem; margin: 0; }
.bh-eyebrow { display: inline-block; font-family: var(--bh-font-head); font-size: .78rem; letter-spacing: .1em; text-transform: uppercase; color: var(--bh-accent); background: rgba(0, 0, 0, .35); padding: .2rem .6rem; border: 2px solid rgba(0, 0, 0, .6); }
body:not(.dark) .bh-eyebrow { color: #fff; background: var(--bh-primary-600); }
.bh-grid { display: grid; gap: 1.2rem; }
.bh-grid--2 { grid-template-columns: repeat(2, 1fr); }
.bh-grid--3 { grid-template-columns: repeat(3, 1fr); }
.bh-grid--4 { grid-template-columns: repeat(4, 1fr); }

.bh-icon { display: inline-grid; place-items: center; width: 48px; height: 48px; margin-bottom: 1rem; background: var(--bh-primary); color: #fff; font-size: 1.15rem; border: var(--bh-px) solid var(--bh-edge);
    box-shadow: inset 0 calc(var(--bh-px) * -1.5) 0 rgba(0, 0, 0, .3), inset var(--bh-px) var(--bh-px) 0 rgba(255, 255, 255, .3); }
.bh-icon--sm { width: 40px; height: 40px; font-size: 1rem; margin-bottom: .5rem; }
.bh-icon i { margin: 0; }
.bh-feature:hover, .bh-person:hover { transform: translateY(-4px); }
.bh-pill { display: inline-flex; align-items: center; padding: .12rem .55rem; background: var(--bh-primary-600); color: #fff; font-family: var(--bh-font-head); font-size: .66rem; text-transform: uppercase; border: 2px solid var(--bh-edge); }
.bh-chip { display: inline-flex; align-items: center; gap: .5rem; padding: .25rem .7rem; background: rgba(0, 0, 0, .45); color: #fff; font-family: var(--bh-font-head); font-size: .75rem; text-transform: uppercase; border: 2px solid #000; }
.bh-chip--ok .bh-dot { background: #6fe04a; }
.bh-chip--off .bh-dot { background: #e0524a; }
.bh-ip { display: inline-flex; align-items: center; gap: .7rem; background: rgba(0, 0, 0, .6); border: var(--bh-px) solid #000; color: #fff; font-family: ui-monospace, SFMono-Regular, Menlo, monospace; font-size: .95rem; font-weight: 700; padding: .6rem 1rem; cursor: pointer; }
.bh-ip:hover { background: rgba(0, 0, 0, .8); }
.bh-ip.is-copied { border-color: var(--bh-primary-300); }
.bh-ip--block { width: 100%; justify-content: center; margin-bottom: .75rem; }
.bh-ip__icon { opacity: .7; }

/* ---------- server status ---------- */
.bh-server { display: grid; grid-template-columns: 1.2fr 1fr; gap: 1.6rem; align-items: center; padding: 2rem; }
.bh-server h2 { margin: .8rem 0 .3rem; font-size: 1.5rem; text-transform: uppercase; }
.bh-server__meta { list-style: none; padding: 0; margin: 1rem 0 0; display: grid; gap: .4rem; color: var(--bh-muted); font-size: .9rem; }
.bh-server__meta i { width: 1.4rem; color: var(--bh-primary-300); }
.bh-server__card { background: var(--bh-surface-2); border: var(--bh-px) solid var(--bh-edge); padding: 1.3rem; }
.bh-server__players { display: flex; align-items: baseline; gap: .5rem; margin-bottom: .7rem; }
.bh-server__players strong { font-family: var(--bh-font-head); font-weight: 400; font-size: 2.4rem; line-height: 1; }
.bh-server__players span { color: var(--bh-muted); }
.bh-bar { height: 16px; background: #0c0c0c; border: var(--bh-px) solid #000; margin-bottom: 1.1rem; padding: 1px; }
.bh-bar span { display: block; height: 100%; background: repeating-linear-gradient(90deg, var(--bh-primary-300) 0 8px, var(--bh-primary) 8px 12px); }
.bh-server .bh-chip { background: var(--bh-surface-2); color: var(--bh-text); border-color: var(--bh-edge); }

/* ---------- game modes ---------- */
.bh-mode { display: flex; flex-direction: column; background: var(--bh-surface); border: var(--bh-px) solid var(--bh-edge); color: var(--bh-text) !important; text-decoration: none; box-shadow: var(--bh-shadow); transition: transform .15s; }
.bh-mode:hover { transform: translateY(-5px); border-color: var(--bh-primary-300); }
.bh-mode__img { position: relative; aspect-ratio: 16/10; background-size: cover; background-position: center; display: grid; place-items: center; border-bottom: var(--bh-px) solid var(--bh-edge); overflow: hidden; }
.bh-mode__img:after { content: ''; position: absolute; inset: 0; background: var(--bh-tex-stone); background-size: 48px; mix-blend-mode: overlay; opacity: .9; }
.bh-mode__img .bh-pill { position: absolute; top: 10px; left: 10px; z-index: 2; background: var(--bh-accent); color: #1a1405; }
.bh-mode__glyph { position: relative; z-index: 1; font-family: var(--bh-font-head); font-size: 4rem; color: rgba(255, 255, 255, .6); text-shadow: 0 4px 0 rgba(0, 0, 0, .35); }
.bh-mode__img[style*="url"] .bh-mode__glyph { display: none; }
.bh-mode--0 .bh-mode__img { background-image: linear-gradient(180deg, #78b4ee 0 45%, #5a9a38 45% 55%, #6b4a2b 55%); }
.bh-mode--1 .bh-mode__img { background-image: linear-gradient(180deg, #2a5fa8, #8ed0f0); }
.bh-mode--2 .bh-mode__img { background-image: linear-gradient(180deg, #5a1a14, #d0561f); }
.bh-mode--3 .bh-mode__img { background-image: linear-gradient(180deg, #1c1030, #6b3fb0); }
.bh-mode--4 .bh-mode__img { background-image: linear-gradient(180deg, #5aa8e8, #e8cf88); }
.bh-mode--5 .bh-mode__img { background-image: linear-gradient(180deg, #123a4a, #2aa6a0); }
.bh-mode__body { padding: 1.1rem 1.2rem 1.3rem; display: grid; gap: .35rem; }
.bh-mode__body h3 { margin: 0; font-size: 1rem; text-transform: uppercase; }
.bh-mode__body p { margin: 0; color: var(--bh-muted); font-size: .9rem; }

/* ---------- stats ---------- */
.bh-stats { display: grid; grid-template-columns: repeat(auto-fit, minmax(190px, 1fr)); gap: 1rem; }
.bh-stat { text-align: center; padding: 1.2rem 1rem; background: var(--bh-surface); border: var(--bh-px) solid var(--bh-edge); box-shadow: var(--bh-shadow); display: grid; justify-items: center; }
.bh-stat strong { font-family: var(--bh-font-head); font-weight: 400; font-size: 2rem; line-height: 1.2; color: var(--bh-accent); text-shadow: 0 3px 0 rgba(0, 0, 0, .4); font-variant-numeric: tabular-nums; }

/* ---------- news (featured + grid) ---------- */
.bh-news.bh-news-feature { display: grid; grid-template-columns: 1.15fr 1fr; padding: 0; overflow: hidden; margin-bottom: 1.4rem; }
.bh-news-feature .bh-news__cover { aspect-ratio: auto; min-height: 320px; }
.bh-news-feature .bh-news__body { padding: 2rem; justify-content: center; }
.bh-news-feature h3 { font-size: 1.5rem; }
.bh-news { padding: 0; overflow: hidden; display: flex; flex-direction: column; }
.bh-news:hover { transform: translateY(-3px); border-color: var(--bh-primary-300); }
.bh-news__cover { aspect-ratio: 16/9; position: relative; display: grid; place-items: center; background-size: cover; background-position: center; border-bottom: var(--bh-px) solid var(--bh-edge); overflow: hidden; }
.bh-news-feature .bh-news__cover { border-bottom: 0; border-right: var(--bh-px) solid var(--bh-edge); }
.bh-news__cover:after { content: ''; position: absolute; inset: 0; background: var(--bh-tex-stone); background-size: 48px; mix-blend-mode: overlay; }
.bh-news__cover > span { position: relative; z-index: 1; font-family: var(--bh-font-head); font-size: 3.6rem; color: rgba(255, 255, 255, .55); text-shadow: 0 4px 0 rgba(0, 0, 0, .35); }
.bh-news__cover[style*="url"] > span { display: none; }
.bh-news__cover--0 { background-image: linear-gradient(135deg, var(--bh-primary-600), var(--bh-primary-300)); }
.bh-news__cover--1 { background-image: linear-gradient(135deg, #8a2a14, #e07a24); }
.bh-news__cover--2 { background-image: linear-gradient(135deg, #14506a, #34b6c0); }
.bh-news__cover--3 { background-image: linear-gradient(135deg, #3c2470, #9a63e0); }
.bh-news__cover--4 { background-image: linear-gradient(135deg, #7a5a10, #e8c040); }
.bh-news__cover--5 { background-image: linear-gradient(135deg, #1c3a5a, #6aa6d8); }
.bh-news__body { padding: 1.2rem 1.3rem 1.3rem; display: flex; flex-direction: column; gap: .55rem; flex: 1; }
.bh-news__tags { display: flex; gap: .5rem; flex-wrap: wrap; font-family: var(--bh-font-head); font-size: .74rem; text-transform: uppercase; }
.bh-news__tags .t0 { color: #e0624a; } .bh-news__tags .t1 { color: #58b845; } .bh-news__tags .t2 { color: #3fb7d0; }
.bh-news__body h3 { margin: 0; font-size: 1.1rem; }
.bh-news__body h3 a { color: var(--bh-primary-300) !important; text-decoration: none; }
body:not(.dark) .bh-news__body h3 a { color: var(--bh-primary-600) !important; }
.bh-news__body h3 a:hover { color: var(--bh-accent) !important; }
.bh-news__body p { color: var(--bh-muted); margin: 0; font-size: .92rem; }
.bh-news__foot { margin-top: auto; padding-top: .8rem; display: flex; align-items: center; gap: .7rem; font-size: .85rem; }
.bh-news__foot img { width: 34px; height: 34px; image-rendering: pixelated; border: 2px solid var(--bh-edge); }
.bh-news__foot .who { display: grid; line-height: 1.25; }
.bh-news__foot .who a { color: #e0524a !important; font-weight: 700; }
.bh-news__foot .read { margin-left: auto; background: var(--bh-surface-2); padding: .25rem .6rem; font-size: .75rem; font-weight: 600; border: 2px solid var(--bh-border); }

/* ---------- pricing ---------- */
.bh-grid--pricing { align-items: stretch; }
.bh-price { position: relative; display: flex; flex-direction: column; gap: 1rem; padding: 1.8rem 1.6rem; }
.bh-price h3 { font-size: 1.1rem; text-transform: uppercase; }
.bh-price__amount strong { font-family: var(--bh-font-head); font-weight: 400; font-size: 2.3rem; line-height: 1; }
.bh-price__amount span { color: var(--bh-muted); margin-left: .3rem; }
.bh-price ul { list-style: none; padding: 0; margin: 0 0 .5rem; display: grid; gap: .6rem; flex: 1; }
.bh-price li { display: flex; gap: .6rem; align-items: flex-start; color: var(--bh-muted); font-size: .92rem; }
.bh-price li i { color: var(--bh-primary-300); margin-top: .3rem; font-size: .8rem; }
.bh-price--featured { border-color: var(--bh-accent); transform: scale(1.03); }
.bh-ribbon { position: absolute; top: -17px; left: 50%; transform: translateX(-50%); background: var(--bh-accent); color: #1a1405; font-family: var(--bh-font-head); font-size: .7rem; text-transform: uppercase; padding: .3rem .9rem; border: 2px solid #000; white-space: nowrap; }

/* ---------- staff ---------- */
.bh-person { display: grid; justify-items: center; gap: .6rem; padding: 1.4rem 1rem; text-align: center; color: var(--bh-text) !important; text-decoration: none; }
.bh-person img { width: 84px; height: 84px; image-rendering: pixelated; background: var(--bh-surface-2); border: var(--bh-px) solid var(--bh-edge); }
.bh-person strong { font-family: var(--bh-font-head); font-weight: 400; font-size: .95rem; }

/* ---------- gallery ---------- */
.bh-gallery { display: grid; grid-template-columns: repeat(4, 1fr); grid-auto-rows: 180px; gap: 1rem; }
.bh-shot { position: relative; margin: 0; overflow: hidden; background-size: cover; background-position: center; border: var(--bh-px) solid var(--bh-edge); box-shadow: var(--bh-shadow); transition: transform .15s; }
.bh-shot:hover { transform: scale(1.015); }
.bh-shot:nth-child(1) { grid-column: span 2; grid-row: span 2; }
.bh-shot:nth-child(4) { grid-column: span 2; }
.bh-shot--0 { background-image: linear-gradient(180deg, #78b4ee 0 55%, #5a9a38 55%); }
.bh-shot--1 { background-image: linear-gradient(135deg, #14506a, #34b6c0); }
.bh-shot--2 { background-image: linear-gradient(135deg, #8a2a14, #e07a24); }
.bh-shot--3 { background-image: linear-gradient(135deg, #3c2470, #9a63e0); }
.bh-shot--4 { background-image: linear-gradient(135deg, #7a5a10, #e8c040); }
.bh-shot--5 { background-image: linear-gradient(135deg, #1c3a5a, #6aa6d8); }
.bh-shot figcaption { position: absolute; left: 0; right: 0; bottom: 0; padding: 1.4rem 1rem .7rem; color: #fff; font-family: var(--bh-font-head); font-size: .85rem; background: linear-gradient(transparent, rgba(0, 0, 0, .75)); }

/* ---------- faq ---------- */
.bh-faq { display: grid; gap: .8rem; }
.bh-faq__item { padding: 0; }
.bh-faq__item summary { cursor: pointer; list-style: none; display: flex; justify-content: space-between; align-items: center; gap: 1rem; padding: 1.1rem 1.4rem; font-family: var(--bh-font-head); font-size: .92rem; }
.bh-faq__item summary::-webkit-details-marker { display: none; }
.bh-faq__item summary i { color: var(--bh-primary-300); transition: transform .15s; font-size: .8rem; }
.bh-faq__item[open] summary i { transform: rotate(45deg); }
.bh-faq__item p { padding: 0 1.4rem 1.2rem; }

/* ---------- banners ---------- */
.bh-banner { display: flex; align-items: center; gap: 2rem; padding: 2.2rem 2.4rem; color: #fff; position: relative; overflow: hidden; border: var(--bh-px) solid #000; box-shadow: inset 0 var(--bh-px) 0 rgba(255, 255, 255, .25), inset 0 calc(var(--bh-px) * -1) 0 rgba(0, 0, 0, .3), var(--bh-shadow); }
.bh-banner h2 { margin: 0 0 .5rem; color: #fff !important; font-size: clamp(1.2rem, 2.4vw, 1.8rem); text-transform: uppercase; text-shadow: 0 3px 0 rgba(0, 0, 0, .5); }
.bh-banner p { margin: 0 0 .8rem; opacity: .95; }
.bh-banner__text { flex: 1; }
.bh-banner__actions { display: flex; gap: .8rem; flex-wrap: wrap; }
.bh-banner--discord { background: #5865f2; }
.bh-banner__icon { font-size: 3.4rem; }
.bh-banner--cta { background: var(--bh-primary); background-image: var(--bh-tex-grass); background-size: 64px; }
.bh-section--discord, .bh-section--cta { padding: 1.5rem 0; }
.bh-section--cta { padding-bottom: 4.5rem; }
.bh-partners__row { display: flex; flex-wrap: wrap; justify-content: center; align-items: center; gap: 1rem 3rem; margin-top: 1rem; }
.bh-partners__row a { color: var(--bh-muted) !important; font-family: var(--bh-font-head); opacity: .8; text-decoration: none; }
.bh-partners__row a:hover { opacity: 1; color: var(--bh-accent) !important; }
.bh-partners__row img { max-height: 32px; filter: grayscale(1); }
.bh-richtext { color: var(--bh-text); }

/* ---------- footer (grass over dirt) ---------- */
.bh-footer { position: relative; margin-top: 3rem; padding: 3.4rem 0 1.4rem; background-color: #5b3f23; background-image: var(--bh-tex-dirt); background-size: 64px; color: #e6dccf; border-top: var(--bh-px) solid #000; }
.bh-footer:before { content: ''; position: absolute; left: 0; right: 0; top: calc(var(--bh-px) * -1); height: 22px; transform: translateY(-100%); background-color: var(--bh-primary); background-image: var(--bh-tex-grass); background-size: 64px; border-bottom: var(--bh-px) solid #000; }
.bh-footer:after { content: ''; position: absolute; inset: 0; background: rgba(0, 0, 0, .38); pointer-events: none; }
.bh-footer > .bh-container { position: relative; z-index: 1; }
.bh-footer__grid { display: grid; grid-template-columns: 1.6fr 1fr 1fr; gap: 3rem; }
.bh-footer h4 { font-size: .85rem; text-transform: uppercase; color: var(--bh-accent) !important; margin: 0 0 1rem; text-shadow: 0 2px 0 rgba(0, 0, 0, .6); }
.bh-footer__brand p { color: #d6cabb; max-width: 40ch; margin: 1rem 0; }
.bh-footer__list { list-style: none; padding: 0; margin: 0; display: grid; gap: .55rem; }
.bh-footer__list a { color: #f1e9de !important; text-decoration: none; }
.bh-footer__list a:hover { color: var(--bh-accent) !important; }
.bh-social { display: flex; gap: .5rem; }
.bh-social a { display: grid; place-items: center; width: 40px; height: 40px; background: #3b3c3d; color: #fff !important; border: var(--bh-px) solid #000; box-shadow: inset 0 -3px 0 rgba(0, 0, 0, .35), inset 2px 2px 0 rgba(255, 255, 255, .15); }
.bh-social a:hover { background: var(--bh-primary); }
.bh-footer__bottom { display: flex; flex-wrap: wrap; gap: .5rem 2rem; margin-top: 2.4rem; padding-top: 1.3rem; border-top: 2px solid rgba(0, 0, 0, .5); color: #cdbfae; font-size: .85rem; }
.bh-footer__bottom a { color: #e8dccb !important; }
.bh-footer__bottom > :last-child { margin-left: auto; }
.bh-disclaimer { width: 100%; font-size: .78rem; opacity: .75; }

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

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

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

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

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

/* login / register — centred auth card */
body#page-login .bh-content > .ui.stackable.grid, body#page-register .bh-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.blockhaven .ui.secondary.segment:not(.inverted), body.blockhaven .ui.segments > .segment, body.blockhaven #topic-post .ui.segment, body.blockhaven #topic-reply .ui.segment {
    background: var(--bh-surface) !important; color: var(--bh-text);
}
body.blockhaven #topic-post .ui.secondary.segment, body.blockhaven #post-content { background: transparent !important; }
body.blockhaven .ui.segments { border: var(--bh-px) solid var(--bh-edge); border-radius: var(--bh-radius); box-shadow: var(--bh-shadow); }
body.blockhaven .ui.segments > .segment { border-color: var(--bh-border); box-shadow: none; }
body.blockhaven .ui.grey.segment, body.blockhaven .ui.basic.segment { background: transparent !important; box-shadow: none; border: 0; }


/* extras for the Fomantic skin */
body.blockhaven .ui.segment { box-shadow: inset 0 var(--bh-px) 0 rgba(255,255,255,.06), inset 0 calc(var(--bh-px) * -1) 0 rgba(0,0,0,.22), var(--bh-shadow); }
body.dark.blockhaven .ui.segment .ui.segment { background: var(--bh-surface-2); }
body.blockhaven .ui.menu:not(.inverted) { border-color: var(--bh-edge); }
body.blockhaven .ui.label { font-family: var(--bh-font-head); font-weight: 400; }
body.blockhaven .ui.top.attached.header, body.blockhaven #forum-index .ui.segment.cc_forum_cat { background: var(--bh-surface-2) !important; }
body.blockhaven .ui.form input:focus, body.blockhaven .ui.form textarea:focus, body.blockhaven .ui.input > input:focus { border-color: var(--bh-primary-300); box-shadow: 0 0 0 var(--bh-px) rgba(var(--bh-primary-rgb), .35); }
body.blockhaven .ui.avatar.image, body.blockhaven img.ui.avatar { image-rendering: pixelated; border-radius: 0; }

/* ---------- responsive ---------- */
@media (max-width: 1024px) {
    .bh-grid--4, .bh-grid--3 { grid-template-columns: repeat(2, 1fr); }
    .bh-server, .bh-welcome, .bh-news.bh-news-feature { grid-template-columns: 1fr; }
    .bh-news-feature .bh-news__cover { min-height: 220px; border-right: 0; border-bottom: var(--bh-px) solid var(--bh-edge); }
    .bh-gallery { grid-template-columns: repeat(2, 1fr); }
    .bh-footer__grid { grid-template-columns: 1fr 1fr; }
    .bh-price--featured { transform: none; }
    .bh-hero__inner { grid-template-columns: 1fr; justify-items: center; gap: 1.4rem; }
    .bh-hero__side--left, .bh-hero__side--right { justify-content: center; text-align: left; order: 2; }
    .bh-hero__logo { order: 1; }
}
@media (max-width: 860px) {
    .bh-nav__toggle { display: inline-grid; place-items: center; }
    .bh-nav__inner { flex-wrap: wrap; gap: .5rem; padding-block: .6rem; }
    .bh-nav__links, .bh-nav__right { display: none; width: 100%; }
    body.bh-nav-overlay.bh-home .bh-nav { background: #1b1b1c; position: relative; }
    body.bh-nav-overlay.bh-home .bh-nav .bh-logo { display: inline-flex; }
    body.bh-nav-overlay.bh-home .bh-nav__links { position: static; transform: none; }
    .bh-nav--open .bh-nav__links { display: flex; flex-direction: column; align-items: stretch; order: 5; padding: .5rem 0; }
    .bh-nav--open .bh-nav__right { display: flex; order: 6; flex-wrap: wrap; padding-bottom: .5rem; margin-left: 0; }
    .bh-nav--open .bh-nav__links .ui.dropdown { flex-direction: column; align-items: stretch; }
    .bh-nav--open .bh-nav__links .ui.dropdown > .menu { display: block !important; position: static; width: 100%; box-shadow: none; border: 0; margin: 0; background: transparent; }
    .bh-nav--open .bh-nav__links .ui.dropdown > .dropdown.icon { display: none; }
    .bh-banner { flex-direction: column; align-items: flex-start; padding: 1.6rem; }
    .bh-hero__inner, .bh-hero--tall .bh-hero__inner { padding-top: 3.5rem; padding-bottom: 6rem; }
}
@media (max-width: 640px) {
    .bh-grid--2, .bh-grid--3, .bh-grid--4 { grid-template-columns: 1fr; }
    .bh-grid--staff, .bh-grid--modes { grid-template-columns: repeat(2, 1fr); }
    .bh-mode__img { aspect-ratio: 16/9; }
    .bh-mode__glyph { font-size: 2.6rem; }
    .bh-stats { grid-template-columns: repeat(2, 1fr); }
    .bh-section { padding: 2.4rem 0; }
    .bh-footer__grid { grid-template-columns: 1fr; gap: 2rem; }
    .bh-container { padding: 0 16px; }
    .bh-footer__bottom > :last-child { margin-left: 0; }
    .bh-gallery { grid-auto-rows: 140px; }
    .bh-shot:nth-child(1) { grid-row: span 1; }
    .bh-server { padding: 1.3rem; }
    .bh-welcome__panel { flex-wrap: wrap; }
}

body.blockhaven .ui.circular.image, body.blockhaven img.ui.circular, body.blockhaven .ui.circular.label, body.blockhaven .ui.image.label img, body.blockhaven .ui.avatar.image img { border-radius: 0 !important; image-rendering: pixelated; }
body.blockhaven .ui.circular.button { border-radius: 0 !important; }