:root {
    --bg: #202022;
    --page: #252527;
    --panel: #343437;
    --panel-soft: #3b3b3e;
    --line: #47474b;
    --text: #f4f4f6;
    --muted: #b9b9bf;
    --dim: #888891;
    --blue: #118fdb;
    --blue-dark: #0e638f;
    --green: #31cf54;
    --red: #ff333b;
    --yellow: #ffc400;
}
* { box-sizing: border-box; }
html, body { margin: 0; min-height: 100%; }
body {
    background: var(--bg);
    color: var(--text);
    font-family: Arial, Helvetica, sans-serif;
    font-weight: 700;
    line-height: 1.25;
}
a { color: inherit; text-decoration: none; }
a:hover { text-decoration: underline; }
img { display: block; max-width: 100%; }
button, input, select, textarea { font: inherit; }
button { cursor: pointer; }
.bh-wrap, .page-wrap { max-width: 1180px; margin: 0 auto; padding: 0 14px; }
.bh-header { position: sticky; top: 0; z-index: 50; box-shadow: 0 1px 0 rgba(255,255,255,.05); }
.bh-primary { background: #1b1b1c; }
.bh-primary .bh-wrap { min-height: 43px; display: flex; align-items: center; justify-content: space-between; gap: 14px; }
.bh-main-nav { display: flex; align-items: center; gap: 0; }
.bh-main-nav a {
    display: flex; align-items: center; height: 43px; padding: 0 12px;
    font-size: 19px; font-weight: 900; color: #fff;
}
.bh-main-nav a.active, .bh-main-nav a:hover { background: #2a2a2c; text-decoration: none; }
.bh-account { display: flex; align-items: center; gap: 8px; margin-left: auto; }
.bh-login, .bh-register {
    height: 32px; line-height: 30px; padding: 0 8px; border-radius: 4px;
    color: #fff; font-size: 18px; font-weight: 900; border: 1px solid;
}
.bh-login { border-color: #14c647; }
.bh-register { border-color: #00a6d8; }
.bh-wallet { height: 34px; display: flex; align-items: center; background: #38383b; border-radius: 4px; overflow: hidden; }
.bh-wallet a { height: 34px; display: flex; align-items: center; padding: 0 11px; color: #fff; font-weight: 900; }
.bh-wallet a:hover { background: #444448; text-decoration: none; }
.bh-user-menu { position: relative; }
.bh-user-menu summary {
    list-style: none; height: 43px; display: flex; align-items: center; gap: 8px;
    padding: 0 10px; cursor: pointer; font-size: 20px; font-weight: 900;
}
.bh-user-menu summary::-webkit-details-marker { display: none; }
.bh-user-menu summary:after { content: '⌄'; margin-left: 2px; color: #fff; }
.bh-user-menu[open] summary { background: #2a2a2c; }
.bh-user-menu div {
    position: absolute; right: 0; top: 43px; width: 176px; padding: 6px 0;
    background: #626266; border-radius: 4px; box-shadow: 0 10px 24px rgba(0,0,0,.38);
}
.bh-user-menu div:before {
    content: ''; position: absolute; right: 44px; top: -9px;
    border-left: 9px solid transparent; border-right: 9px solid transparent; border-bottom: 9px solid #626266;
}
.bh-user-menu div a { display: block; padding: 12px; color: #fff; font-size: 18px; font-weight: 900; }
.bh-user-menu div a:hover { background: #707074; text-decoration: none; }
.bh-secondary { background: #353537; }
.bh-secondary nav { min-height: 34px; display: flex; align-items: center; gap: 0; overflow-x: auto; }
.bh-secondary a { height: 34px; display: flex; align-items: center; padding: 0 10px; color: #bfe7ff; font-size: 16px; font-weight: 800; white-space: nowrap; }
.bh-secondary a.active, .bh-secondary a:hover { color: #fff; background: #444447; text-decoration: none; }
.bh-page { min-height: calc(100vh - 155px); padding: 28px 0 60px; }
.bh-footer { background: #171719; color: #d7d7dc; text-align: center; padding: 24px 0; font-size: 18px; font-weight: 800; }
.bh-footer a { color: #fff; }
.panel { background: var(--panel); border: 1px solid #29292b; border-radius: 4px; overflow: hidden; box-shadow: 0 2px 8px rgba(0,0,0,.22); }
.panel + .panel, .news-card { margin-top: 12px; }
.panel-head { padding: 10px 12px; font-size: 19px; font-weight: 900; border-bottom: 1px solid #535357; }
.panel-head.blue { background: var(--blue-dark); color: #9ad1ff; border-bottom-color: #1ab3ff; }
.panel-head.green { background: #09681e; color: #95ef93; border-bottom-color: #35d65b; }
.panel-head.red { background: #5a1418; color: #ff8b90; border-bottom-color: #ff343c; }
.panel-head.yellow { background: #5d4800; color: #ffd059; border-bottom-color: #ff9900; }
.panel-body { padding: 12px; }
.btn {
    display: inline-flex; align-items: center; justify-content: center; min-height: 38px;
    padding: 0 16px; border-radius: 4px; border: 1px solid #5b5b60;
    background: #47474b; color: #fff; font-weight: 900; text-decoration: none;
}
.btn:hover { filter: brightness(1.08); text-decoration: none; }
.btn.green { background: var(--green); border-color: #4ee86d; }
.btn.blue { background: #1d96d4; border-color: #23b9ff; }
.btn.yellow { background: #f5b600; border-color: #ffd058; }
.btn.red { background: #df2d34; border-color: #ff5057; }
.btn.large { height: 78px; min-width: 250px; font-size: 38px; }
.btn.full { width: 100%; }
.muted { color: var(--muted); }
.dim { color: var(--dim); }
.small-copy { margin: 4px 0 12px; font-size: 14px; }
.error, .success { padding: 9px 10px; border-radius: 4px; margin-bottom: 12px; }
.error { background: #54161a; border: 1px solid #ff333b; color: #fff; }
.success { background: #0d5720; border: 1px solid #27da4d; color: #fff; }
input, select, textarea { border-radius: 4px; }

/* landing */
.landing-hero { min-height: 360px; display: grid; place-items: center; text-align: center; background: linear-gradient(180deg, #0d8fdf 0%, #1660a0 100%); border-bottom: 8px solid #1b1b1d; }
.landing-hero h1 { margin: 0; font-size: 78px; line-height: .9; color: #fff; letter-spacing: -3px; text-shadow: 0 5px 0 #0265ac; }
.landing-hero p { color: #fff; font-size: 19px; max-width: 760px; margin: 18px auto; }
.landing-actions { display: flex; justify-content: center; gap: 12px; }
.landing-section { max-width: 1180px; margin: 0 auto; padding: 56px 14px; display: grid; grid-template-columns: 1fr 1fr; gap: 48px; align-items: center; }
.landing-section h2 { margin: 0 0 14px; font-size: 32px; }
.landing-section p { color: #f1f1f3; font-size: 18px; }
.landing-art { height: 220px; background: linear-gradient(135deg, #0f6fa3, #20a9e8); border: 1px solid #444; position: relative; overflow: hidden; }
.landing-art:before {
    content: ''; position: absolute; inset: 0;
    background: linear-gradient(#fff2 1px, transparent 1px), linear-gradient(90deg, #fff2 1px, transparent 1px);
    background-size: 26px 26px;
}
.home-grid { display: grid; grid-template-columns: 350px minmax(0, 1fr); gap: 22px; }
.beta-banner { background: #22d35a; color: #fff; text-align: center; font-size: 21px; padding: 12px; border-radius: 5px; margin-bottom: 14px; }
.profile-card { text-align: center; }
.profile-card h2 { margin: 10px 0; font-size: 24px; }
.profile-stats { display: grid; grid-template-columns: repeat(3, 1fr); border-top: 1px solid var(--line); padding-top: 10px; }
.profile-stats b { display: block; font-size: 23px; }
.profile-stats span { color: #aaa; font-size: 14px; text-transform: uppercase; }
.feed-form label { display: block; margin: 8px 0 4px; font-size: 20px; color: #ccc; }
.feed-form input, .feed-form textarea { width: 100%; background: #fff; border: 1px solid #bbb; color: #111; padding: 9px; }
.feed-form textarea { min-height: 96px; }

/* game grid */
.play-layout { display: grid; grid-template-columns: 210px minmax(0, 1fr); gap: 22px; }
.game-side h1 { margin: 0 0 8px; font-size: 35px; }
.side-link, .check-row { display: block; color: #d3d3d8; font-size: 17px; font-weight: 900; margin: 10px 0; }
.side-section { margin: 30px 0; }
.play-tools { display: grid; grid-template-columns: 1fr 150px 110px; gap: 12px; margin-bottom: 20px; }
.play-tools input, .play-tools select { height: 36px; background: #29292c; color: #fff; border: 1px solid #444; padding: 0 12px; }
.game-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(210px, 1fr)); gap: 18px; }
.game-card h3 { font-size: 21px; line-height: 1.05; margin: 8px 0 0; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.game-card p { margin: 2px 0; color: #ddd; }
.playing { color: var(--red); font-weight: 900; }
.game-thumb { height: 132px; background: #333; border: 1px solid #444; overflow: hidden; position: relative; }
.game-thumb img { width: 100%; height: 100%; object-fit: cover; }

/* game detail */
.game-page-title { font-size: 39px; margin: 0 0 14px; }
.game-hero { display: grid; grid-template-columns: 560px minmax(0, 1fr); gap: 24px; }
.game-hero .game-thumb { height: 360px; }
.game-play-info .now { color: var(--red); font-size: 20px; margin-bottom: 10px; }
.game-meta-table { margin-top: 26px; display: grid; grid-template-columns: 130px 1fr; gap: 12px 18px; font-size: 21px; }
.game-meta-table b { color: #d8d8dc; text-transform: uppercase; }
.vote-row { border-top: 1px solid #444; border-bottom: 1px solid #444; margin-top: 18px; padding: 12px 0; display: flex; flex-wrap: wrap; gap: 26px; align-items: center; font-size: 21px; }
.vote-bar { height: 7px; background: var(--red); margin-top: 6px; width: 250px; max-width: 100%; }
.vote-bar i { display: block; height: 100%; background: var(--green); }
.description { margin-top: 18px; }
.description h2 { font-size: 34px; margin: 0 0 14px; }
.description p { color: #fff; white-space: pre-line; font-size: 20px; }
.comments-title { text-align: center; margin: 34px 0 8px; font-size: 24px; border-bottom: 5px solid var(--blue); padding-bottom: 10px; }
.comment { border-top: 1px solid #3e3e42; padding: 12px 0 12px 150px; }
.servers-block { margin-top: 22px; }
.server-row { display: grid; grid-template-columns: 1.5fr 1fr 1fr auto; gap: 12px; padding: 10px; border-top: 1px solid #444; align-items: center; }
.server-row:first-child { border-top: 0; }
.server-row.head { color: #aaa; text-transform: uppercase; font-size: 13px; }

/* auth */
.auth-wrap { max-width: 760px; margin: 0 auto; }
.auth-card { background: #363638; border-radius: 4px; box-shadow: 0 2px 8px rgba(0,0,0,.25); overflow: hidden; }
.auth-body { padding: 16px; display: grid; grid-template-columns: 1fr 300px; gap: 30px; }
.auth-body.single { grid-template-columns: 1fr; }
.auth-card label { display: block; margin-bottom: 8px; }
.auth-card label span { display: block; color: #d6d6da; font-size: 22px; font-weight: 900; }
.auth-card small { display: block; color: #b7b7bc; font-size: 14px; }
.auth-card input, .auth-card select { width: 240px; max-width: 100%; height: 31px; background: #29292c; color: #fff; border: 1px solid #202022; padding: 0 8px; }
.auth-help { border: 1px solid #999; border-radius: 5px; padding: 10px; color: #ddd; }
.fake-captcha { width: 310px; max-width: 100%; height: 76px; background: #fff; color: #555; margin: 12px 0; border-radius: 4px; display: flex; align-items: center; gap: 14px; padding: 12px; }
.fake-check { width: 30px; height: 30px; border: 1px solid #aaa; border-radius: 3px; }

/* avatar editor */
.avatar-layout-v2 { display: grid; grid-template-columns: minmax(0, 1fr) 330px; gap: 22px; align-items: start; }
.avatar-main-column, .avatar-side-column { min-width: 0; }
.avatar-builder-body { padding: 18px; }
.avatar-builder-grid { display: grid; grid-template-columns: 520px minmax(0, 1fr); gap: 24px; align-items: start; }
.avatar-stage-card { background: #2f3034; border: 1px solid #47484e; border-radius: 4px; padding: 12px; }
.avatar-canvas { display: block; width: 100%; height: 510px; background: linear-gradient(180deg, #383a40 0%, #32343a 100%); border-radius: 4px; }
.avatar3d-failed { background: #2b2b2d; }
.avatar-help { margin: 12px 0 0; color: #c7c7cc; font-size: 14px; font-weight: 800; }
.avatar-control-card h2 { margin: 0; font-size: 28px; }
.avatar-part-list { display: grid; gap: 10px; margin-top: 16px; }
.part-row { width: 100%; min-height: 70px; display: flex; align-items: center; justify-content: space-between; padding: 0 16px; color: #fff; background: #2b2c31; border: 1px solid #4c4d53; border-radius: 6px; font-weight: 900; }
.part-row span { font-size: 21px; }
.part-row:hover, .part-row.active { border-color: var(--blue); background: #33353b; }
.part-color-chip { display: block; width: 68px; height: 42px; border: 1px solid rgba(255,255,255,.28); border-radius: 3px; }
.editor-palette { display: grid; grid-template-columns: repeat(auto-fill, minmax(54px, 54px)); gap: 10px; margin-top: 20px; }
.color-swatch { width: 54px; height: 54px; border-radius: 6px; border: 2px solid rgba(255,255,255,.14); }
.color-swatch:hover { outline: 3px solid var(--blue); }
.avatar-form-actions { margin-top: 20px; display: flex; align-items: center; gap: 10px; }
.reset-camera-btn { min-height: 34px; padding: 0 12px; font-size: 14px; }
.save-avatar-btn { min-width: 160px; min-height: 46px; font-size: 19px; }
.clean-links { display: flex; flex-wrap: wrap; justify-content: center; gap: 7px; font-size: 20px; }
.clean-links a { font-weight: 900; }
.clean-links a:not(:last-child):after { content: ' |'; color: #aaa; margin-left: 7px; }
.wearing-empty { color: #b7b7bc; font-size: 17px; }
.saved-render-box { display: grid; place-items: center; min-height: 240px; }
.saved-render-img, .profile-render-img { width: min(100%, 250px); height: auto; image-rendering: auto; }
.profile-render-img { margin: 0 auto 18px; }
.compact-item-slots { display: grid; grid-template-columns: 1fr 1fr; gap: 10px; }
.item-slots div { height: 82px; border: 1px dashed #666; border-radius: 4px; display: grid; place-items: center; color: #aaa; background: #2d2d30; }
.item-slots p { grid-column: 1 / -1; margin: 0; color: #bfbfc5; }

/* shop/forum/users */
.shop-layout { display: grid; grid-template-columns: minmax(0,1fr) 280px; gap: 22px; }
.shop-search { display: grid; grid-template-columns: 1fr 130px 130px; gap: 10px; background: #fff; padding: 10px; border-radius: 4px; box-shadow: 0 2px 8px rgba(0,0,0,.18); }
.shop-search input, .shop-search select { height: 42px; border: 1px solid #ccc; padding: 0 12px; color: #222; }
.shop-tabs { display: flex; justify-content: space-around; flex-wrap: wrap; border-top: 1px solid #ccc; margin-top: 8px; padding-top: 10px; color: #777; }
.shop-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(230px, 1fr)); gap: 16px; margin-top: 14px; }
.shop-card { background: #fff; color: #333; border-radius: 4px; box-shadow: 0 2px 8px rgba(0,0,0,.18); overflow: hidden; }
.shop-img { height: 250px; background: #555; display: grid; place-items: center; }
.shop-card h3 { padding: 12px 14px 0; margin: 0; font-size: 22px; }
.shop-card p { padding: 0 14px 14px; margin: 0; color: #666; }
.placeholder-page { max-width: 1000px; margin: 0 auto; }
.board-layout { display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 20px; }
.forum-table { background: #363638; border-radius: 4px; overflow: hidden; }
.forum-head, .forum-row { display: grid; grid-template-columns: 1fr 100px 100px 160px; }
.forum-head { background: #0d5a91; padding: 11px; color: #aeb7ff; }
.forum-row { padding: 14px; border-top: 1px solid #444; }
.forum-row b { font-size: 18px; }
.forum-row p { margin: 2px 0; color: #fff; }
.user-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(150px, 1fr)); gap: 14px; }
.user-card { text-align: center; background: #303032; border: 1px solid #444; border-radius: 4px; padding: 12px; }
.grid-two { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; }
.narrow { max-width: 620px; }

/* launch modal */
.launch-modal { position: fixed; inset: 0; background: rgba(0,0,0,.65); display: none; align-items: center; justify-content: center; z-index: 100; padding: 20px; }
.launch-modal.open { display: flex; }
.launch-card { width: min(500px, 100%); background: #343436; border: 1px solid #555; padding: 22px; text-align: center; border-radius: 4px; }
.launch-actions { display: flex; justify-content: center; gap: 10px; }
.spinner { width: 32px; height: 32px; border: 4px solid #555; border-top-color: #fff; border-radius: 50%; animation: spin 1s linear infinite; margin: 0 auto; }
@keyframes spin { to { transform: rotate(360deg); } }

@media (max-width: 900px) {
    .bh-primary .bh-wrap { flex-wrap: wrap; }
    .bh-main-nav { width: 100%; overflow-x: auto; }
    .bh-account { width: 100%; justify-content: flex-end; }
    .home-grid, .game-hero, .play-layout, .avatar-layout-v2, .avatar-builder-grid, .shop-layout, .board-layout, .auth-body, .landing-section { grid-template-columns: 1fr; }
    .avatar-canvas { height: 380px; }
    .game-hero .game-thumb { height: 230px; }
    .play-tools, .shop-search { grid-template-columns: 1fr; }
    .forum-head, .forum-row { grid-template-columns: 1fr; }
    .forum-head span:not(:first-child), .forum-row span { display: none; }
    .landing-hero h1 { font-size: 46px; }
    .comment { padding-left: 0; }
    .server-row { grid-template-columns: 1fr; }
}

/* rendered avatar images, not CSS avatars */
.header-avatar-img { width: 30px; height: 30px; object-fit: contain; display: inline-block; vertical-align: middle; }
.user-render-img { width: 100%; height: 250px; object-fit: contain; display: block; margin: 0 auto 8px; }
.shop-render-img { width: 100%; height: 245px; object-fit: contain; display: block; }
.profile-render-img { width: min(100%, 300px); max-height: 420px; object-fit: contain; display: block; }
.user-card { min-height: 335px; }
.user-card a { display: block; }
.user-card h3 { margin-top: 6px; }
.bh-user-menu summary .header-avatar-img { flex: 0 0 auto; }

.bootstrap-avatar-canvas { position: fixed; left: -9999px; top: -9999px; width: 520px; height: 520px; pointer-events: none; opacity: 0; }
.empty-shop-img { background:#555; color:#bbb; display:grid; place-items:center; min-height:250px; }
.empty-shop-img span { opacity:.55; font-size:18px; }

.launch-ticket { max-width: 920px; }
.ticket-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 12px; margin: 18px 0; text-align: left; }
.ticket-grid label { display: block; }
.ticket-grid label.wide { grid-column: 1 / -1; }
.ticket-grid span { display: block; color: #9ad1ff; font-size: 14px; text-transform: uppercase; margin-bottom: 5px; }
.ticket-grid input, .ticket-grid textarea { width: 100%; background: #171719; color: #fff; border: 1px solid #505055; border-radius: 4px; padding: 10px; font-family: monospace; font-weight: 700; }
.ticket-grid textarea { min-height: 86px; resize: vertical; }
.launch-actions-row { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; margin-top: 12px; }
@media (max-width: 800px) { .ticket-grid { grid-template-columns: 1fr; } }
.rating-box { margin-top:18px; border-top:1px solid #444; border-bottom:1px solid #444; padding:12px 0; }
.rating-actions { display:flex; flex-wrap:wrap; gap:8px; margin-bottom:10px; }
.rating-actions form { margin:0; }
.btn.small { min-height:31px; padding:0 10px; font-size:14px; }
.rating-stats { display:flex; flex-wrap:wrap; gap:12px; color:#ddd; font-size:15px; }
.server-row.compact-server { grid-template-columns:1fr auto; gap:12px; }
.compact-server > div { display:flex; align-items:center; gap:14px; flex-wrap:wrap; }
.server-avatar-stack { display:flex; align-items:center; min-height:34px; }
.server-avatar-letter { margin-left:-7px; }
.server-avatar-letter:first-child { margin-left:0; }
.server-avatar-img { width:34px; height:34px; object-fit:contain; border-radius:50%; background:#252527; border:1px solid #555; }
.server-avatar-letter, .server-more { width:34px; height:34px; border-radius:50%; background:#222; border:1px solid #555; display:grid; place-items:center; color:#fff; font-size:13px; }
.server-more { width:auto; min-width:34px; border-radius:14px; padding:0 8px; }
.small-grid { grid-template-columns:repeat(auto-fill, minmax(170px, 1fr)); }
.profile-about h3 { margin:0 0 4px; color:#ddd; }
.profile-about p { margin:0 0 14px; color:#fff; font-weight:700; white-space:pre-line; }
.download-box { text-align:center; padding:80px 20px; }
.download-box h1 { font-size:38px; margin:0 0 10px; }
.download-buttons { display:flex; justify-content:center; gap:12px; flex-wrap:wrap; margin:24px 0; }
.upload-form { display:grid; gap:12px; max-width:720px; }
.upload-form label { display:grid; gap:6px; color:#ddd; }
.upload-form input, .upload-form textarea { width:100%; background:#171719; color:#fff; border:1px solid #555; padding:10px; }
.upload-form textarea { min-height:100px; }
.shirt-preview-img { width:120px; height:120px; object-fit:contain; background:#202022; border:1px solid #555; margin-top:10px; }
.compact-launch .launch-panel { max-width:560px; margin:0 auto; text-align:center; }
.launch-panel .large.spinner { margin-bottom:18px; }
.avatar-auto-render-canvas, .bootstrap-avatar-canvas {
  position: fixed !important;
  left: -9999px !important;
  top: -9999px !important;
  width: 512px !important;
  height: 512px !important;
  opacity: 0 !important;
  pointer-events: none !important;
}

.shop-search { background: #303032; border: 1px solid #444; box-shadow: 0 2px 8px rgba(0,0,0,.22); }
.shop-search input, .shop-search select, .shop-sort-panel select { background: #1f1f21; color: #fff; border: 1px solid #555; }
.shop-tabs { border-top-color: #48484c; color: #b9b9bf; }
.shop-tabs a { color: #b9b9bf; padding: 4px 8px; border-radius: 3px; }
.shop-tabs a.active, .shop-tabs a:hover { color: #fff; background: #45454a; text-decoration: none; }
.shop-card { background: #303032; color: #fff; border: 1px solid #45454a; box-shadow: 0 2px 8px rgba(0,0,0,.22); }
.shop-card a { display: block; color: inherit; text-decoration: none; }
.shop-card a:hover h3 { text-decoration: underline; }
.shop-img { background: #2a2a2d; min-height: 250px; position: relative; overflow: hidden; }
.shop-info { background: #272729; border-top: 1px solid #444; min-height: 88px; }
.shop-card h3 { color: #fff; }
.shop-card p { color: #bfc0c7; }
.shop-render-img { width: 100%; height: 250px; object-fit: contain; display: block; margin: 0 auto; }
.shop-render-img:not([src]) { visibility: hidden; }
.item-render-box { display: block; }
.catalog-auto-render-canvas, .avatar-auto-render-canvas { position: fixed; left: -2000px; top: -2000px; width: 512px !important; height: 512px !important; opacity: 0; pointer-events: none; }
.create-layout { display: grid; grid-template-columns: 1fr 1fr; gap: 18px; align-items: start; }
.create-layout .full-row { grid-column: 1 / -1; }
.upload-form { display: grid; gap: 12px; }
.upload-form label { display: grid; gap: 5px; color: #d8d8dc; font-size: 18px; }
.upload-form input, .upload-form select, .upload-form textarea { width: 100%; background: #202022; color: #fff; border: 1px solid #555; padding: 9px 10px; }
.upload-form textarea { min-height: 96px; resize: vertical; }
.feed-form input, .feed-form textarea { background: #202022; border: 1px solid #555; color: #fff; }
.compact-shop-grid .shop-img { min-height: 190px; }
.compact-shop-grid .shop-render-img { height: 190px; }
@media (max-width: 900px) { .create-layout { grid-template-columns: 1fr; } }

.item-page { max-width: 1120px; }
.item-actions-top { display: flex; gap: 10px; margin-bottom: 14px; }
.item-detail-card { display: grid; grid-template-columns: 500px minmax(0, 1fr); gap: 18px; background: #303032; border: 1px solid #45454a; border-radius: 4px; padding: 14px; box-shadow: 0 2px 8px rgba(0,0,0,.22); }
.item-detail-art { background: #2a2a2d; border: 1px solid #45454a; border-radius: 4px; min-height: 500px; display: grid; place-items: center; overflow: hidden; }
.item-detail-art .shop-img { width: 100%; height: 500px; min-height: 500px; background: #2a2a2d; }
.item-detail-art .shop-render-img { height: 500px; }
.item-detail-info h1 { font-size: 34px; margin: 0 0 4px; }
.item-subline { margin: 0 0 14px; color: #bfc0c7; font-size: 18px; }
.item-meta-grid { display: grid; grid-template-columns: 120px 1fr; gap: 8px 14px; margin: 18px 0; font-size: 18px; }
.item-meta-grid b { color: #9ad1ff; text-transform: uppercase; }
.item-detail-info h2 { margin: 22px 0 8px; font-size: 24px; }
.item-description { color: #fff; white-space: normal; font-weight: 700; }
.item-buy-box { margin-top: 22px; }
.large-buy { min-height: 56px; min-width: 180px; font-size: 22px; }
.owned-pill { display: inline-flex; align-items: center; justify-content: center; min-height: 46px; padding: 0 18px; border-radius: 4px; background: #1d6c32; color: #fff; border: 1px solid #35d65b; font-size: 20px; font-weight: 900; }
.shop-search, .shop-card, .shop-info, .shop-sort-panel, .panel, .item-detail-card, .item-detail-art { color-scheme: dark; }
.shop-sort-panel select { width: 100%; min-height: 34px; }
@media (max-width: 900px) { .item-detail-card { grid-template-columns: 1fr; } .item-detail-art, .item-detail-art .shop-img { min-height: 360px; height: 360px; } .item-detail-art .shop-render-img { height: 360px; } }

/* avatar inventory */
.inventory-panel-body { padding: 12px; }
.avatar-inventory-tabs { display: flex; flex-wrap: wrap; gap: 7px; justify-content: center; margin-bottom: 12px; }
.avatar-inventory-tabs a { color: #d7d7dc; background: #2b2b2e; border: 1px solid #4a4a50; border-radius: 4px; padding: 5px 8px; font-size: 14px; font-weight: 900; text-decoration: none; }
.avatar-inventory-tabs a.active, .avatar-inventory-tabs a:hover { color: #fff; background: #1d96d4; border-color: #23b9ff; }
.avatar-inventory-list { display: grid; gap: 10px; max-height: 520px; overflow: auto; padding-right: 4px; }
.inventory-item-row { display: grid; grid-template-columns: 74px minmax(0,1fr); gap: 10px; align-items: center; background: #2b2b2e; border: 1px solid #47474d; border-radius: 4px; padding: 8px; }
.inventory-thumb { display: block; width: 74px; height: 74px; overflow: hidden; border-radius: 4px; background: #232326; border: 1px solid #444; }
.inventory-thumb .shop-img { width: 74px; height: 74px; min-height: 74px; background: #232326; }
.inventory-thumb .shop-render-img { width: 74px; height: 74px; object-fit: contain; }
.inventory-item-main { display: grid; gap: 4px; min-width: 0; }
.inventory-item-name { color: #fff; font-size: 15px; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.inventory-item-main span { color: #aaaab0; font-size: 13px; font-weight: 800; }
.inventory-item-main form { margin: 0; }
.btn.small-btn, .inventory-item-main button.small-btn { min-height: 28px; padding: 0 9px; font-size: 13px; }
.wearing-list { display: grid; gap: 8px; }
.wearing-row { display: grid; grid-template-columns: 54px minmax(0,1fr) auto; gap: 8px; align-items: center; border-bottom: 1px solid #47474d; padding-bottom: 8px; }
.wearing-row span { color: #9ad1ff; font-size: 13px; font-weight: 900; text-transform: uppercase; }
.wearing-row a { color: #fff; font-weight: 900; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.wearing-row form { margin: 0; }
.wearing-row button { min-height: 26px; padding: 0 7px; background: #45454a; border: 1px solid #62626a; color: #fff; border-radius: 3px; font-weight: 900; cursor: pointer; }
.rerender-avatar-btn { margin-top: 10px; min-height: 34px; padding: 0 12px; font-size: 14px; }
.item-buy-box { display: flex; flex-wrap: wrap; gap: 10px; align-items: center; }

.shop-search { background: #303032; border: 1px solid #45454a; color-scheme: dark; }
.shop-search input, .shop-search select, .shop-sort-panel select { background: #202022; color: #fff; border: 1px solid #555; }
.shop-search input::placeholder { color: #9b9ba1; }
.shop-tabs { border-top-color: #505055; }
.shop-tabs a { color: #c7c7ce; padding: 5px 9px; border-radius: 4px; }
.shop-tabs a.active, .shop-tabs a:hover { background: #47474b; color: #fff; text-decoration: none; }
.shop-card { background: #303032; color: #fff; border: 1px solid #45454a; box-shadow: none; }
.shop-card p { color: #bebec5; }
.shop-info { background: #303032; }
.shop-img, .item-render-box { background: #2a2a2d; }
.item-detail-art { position: relative; }
.item-detail-art [data-normal-item-render] { width: 100%; height: 100%; }
.tryon-canvas { display: none; width: 100%; height: 500px; background: #2a2a2d; }
.item-detail-art .tryon-visible { display: block; }
.avatar-auto-render-canvas { position: fixed; left: -2000px; top: -2000px; width: 512px; height: 512px; opacity: 0; pointer-events: none; }
.catalog-auto-render-canvas { position: fixed; left: -2000px; top: -2000px; width: 512px; height: 512px; opacity: 0; pointer-events: none; }
.item-buy-box form { margin: 0; }
.item-action-btn, .item-buy-box .btn, .item-buy-box button { min-width: 132px; min-height: 46px; font-size: 18px; }
.create-side-links { display: flex; flex-wrap: wrap; gap: 8px; justify-content: center; }
.create-side-links a { display: inline-flex; min-height: 36px; align-items: center; color: #fff; font-weight: 900; padding: 0 10px; background: #2b2b2e; border: 1px solid #4a4a50; border-radius: 4px; }
.create-side-links a:hover { background: #1d96d4; text-decoration: none; }
.play-tools a.btn { height: 46px; }
@media (max-width: 900px) { .tryon-canvas { height: 360px; } }

/* game tabs and shared comments */
.game-tabs { margin-top: 24px; }
.tab-buttons { display: flex; gap: 8px; border-bottom: 1px solid #45454a; margin-bottom: 0; }
.tab-buttons button { min-height: 44px; padding: 0 22px; background: #2f2f32; color: #cfcfd6; border: 1px solid #45454a; border-bottom: 0; border-radius: 4px 4px 0 0; font-size: 18px; font-weight: 900; cursor: pointer; }
.tab-buttons button.active, .tab-buttons button:hover { background: #126f9b; color: #fff; border-color: #1d96d4; }
.tab-panel { background: #303032; border: 1px solid #45454a; border-top: 0; padding: 14px; }
.tab-panel[hidden] { display: none; }
.tab-panel .servers-block { margin-top: 0; }
.comments-panel { display: grid; gap: 14px; }
.comment-form-card { background: #2a2a2d; border: 1px solid #444; border-radius: 4px; padding: 14px; }
.site-comment-form { display: grid; gap: 10px; }
.site-comment-form label span { display: block; color: #fff; font-size: 24px; font-weight: 900; margin-bottom: 6px; }
.site-comment-form textarea { width: 100%; min-height: 110px; resize: vertical; background: #1f1f21; color: #fff; border: 1px solid #555; border-radius: 4px; padding: 10px; font: inherit; }
.site-comment-form textarea::placeholder { color: #8f8f96; }
.comment-list { display: grid; gap: 10px; }
.comment-row { display: grid; grid-template-columns: 64px minmax(0,1fr); gap: 12px; background: #2a2a2d; border: 1px solid #444; border-radius: 4px; padding: 12px; }
.comment-avatar-img { width: 64px; height: 64px; object-fit: contain; display: block; }
.comment-author { color: #9ad1ff; font-weight: 900; font-size: 18px; }
.comment-row time { display: block; color: #9999a1; font-size: 13px; font-weight: 800; margin-top: 2px; }
.comment-row p { margin: 8px 0 0; color: #fff; white-space: pre-line; font-size: 16px; }
.no-comments { margin: 0; padding: 12px; background: #2a2a2d; border: 1px solid #444; border-radius: 4px; }
.item-comments-wrap { margin-top: 20px; }
.item-comments-wrap .comments-title { text-align: left; border-bottom: 0; margin: 0 0 10px; padding-bottom: 0; }
@media (max-width: 700px) { .comment-row { grid-template-columns: 1fr; } .comment-avatar-img { width: 48px; height: 48px; } }

/* v20.2 game layout fixes */
.page-wrap.play-layout,
.page-wrap.game-detail-wrap,
.page-wrap.create-layout { max-width: 1420px; }
.games-browser-wrap { grid-template-columns: 230px minmax(0, 1fr); align-items: start; }
.games-main { min-width: 0; }
.side-link.active,
.genre-link.active { color: #fff; background: #353539; border-radius: 4px; padding: 5px 8px; margin-left: -8px; }
.games-tools { grid-template-columns: minmax(260px, 1fr) 170px 150px 160px 130px; align-items: stretch; }
.games-tools .btn,
.games-tools button { min-height: 46px; display: inline-flex; align-items: center; justify-content: center; }
.games-browser-wrap .game-grid { grid-template-columns: repeat(auto-fill, minmax(250px, 1fr)); gap: 26px; }
.games-browser-wrap .game-thumb { height: 150px; }
.game-detail-wrap { max-width: 1320px; }
.game-detail-wrap .game-hero { grid-template-columns: minmax(480px, 1.25fr) minmax(330px, .75fr); align-items: start; }
.game-detail-wrap .game-thumb.detail-thumb { height: 395px; }
.game-tabs .tab-panel { padding: 0; }
.server-list-tab { padding: 14px; }
.server-list-tab .dim { margin: 0; padding: 14px; }
.server-list-tab .server-row { border-top: 0; border-bottom: 1px solid #45454a; }
.server-list-tab .server-row:last-child { border-bottom: 0; }
.vote-bar i[style*="width:0%"],
.vote-bar i[style*="width: 0%"] { width: 0 !important; }
.game-create-layout { grid-template-columns: minmax(420px, 560px) minmax(0, 1fr); }
.my-games-panel { min-width: 0; }
.my-games-list { display: grid; gap: 12px; }
.my-game-row { display: grid; grid-template-columns: 180px minmax(0,1fr) auto; align-items: center; gap: 12px; padding: 10px; border: 1px solid #444; border-radius: 4px; background: #2b2b2e; }
.my-game-row.no-thumb { grid-template-columns: minmax(0,1fr) auto; }
.my-game-thumb .game-thumb { height: 100px; }
.my-game-info h3 { margin: 0 0 4px; font-size: 20px; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.my-game-info span { color: #aaaab0; font-size: 14px; }
@media (max-width: 1050px) {
  .games-browser-wrap,
  .game-detail-wrap .game-hero,
  .game-create-layout { grid-template-columns: 1fr; }
  .games-tools { grid-template-columns: 1fr; }
  .my-game-row { grid-template-columns: 130px minmax(0,1fr); }
  .my-game-row .btn { grid-column: 1 / -1; }
}

.page-wrap.game-detail-wrap {
    width: 100%;
    max-width: 1500px;
}
.game-detail-wrap .game-hero {
    grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
    gap: 32px;
    align-items: start;
}
.game-detail-wrap .game-hero > div,
.game-detail-wrap .game-play-info {
    min-width: 0;
}

.game-hero.no-thumbnail {
    grid-template-columns: minmax(0, 1fr);
}
.game-hero.no-thumbnail .game-play-info {
    max-width: 760px;
}
.game-detail-wrap .game-thumb.detail-thumb {
    width: 100%;
    height: 430px;
}
.game-thumb.image {
    background: #2b2b2e;
}
.game-thumb.image img {
    width: 100%;
    height: 100%;
    object-fit: cover;
}
.game-play-info .btn.large {
    width: 320px;
    max-width: 100%;
}
.rating-box.is-unrated .rating-stats {
    color: #c7c7cc;
}
.vote-bar {
    background: var(--red);
    overflow: hidden;
}
.vote-bar.unrated {
    background: #626267;
}
.vote-bar.unrated i {
    width: 0 !important;
}
@media (max-width: 1050px) {
    .game-detail-wrap .game-hero {
        grid-template-columns: 1fr;
    }
    .game-detail-wrap .game-thumb.detail-thumb {
        height: 300px;
    }
}
.game-thumbnail {
    display: block;
    width: 100%;
    height: 132px;
    object-fit: cover;
    border: 1px solid #444;
    background: transparent;
}
.games-browser-wrap .game-thumbnail {
    height: 150px;
}
.game-detail-wrap .game-thumbnail.detail-thumb {
    height: 430px;
}
.my-game-thumb .game-thumbnail {
    height: 100px;
}
.game-card a .game-thumbnail {
    margin-bottom: 8px;
}
.game-hero.no-thumbnail {
    grid-template-columns: minmax(0, 1fr);
}
.game-hero.no-thumbnail .game-play-info {
    max-width: 760px;
}
.vote-bar.unrated {
    background: #626267 !important;
}
.vote-bar.unrated i {
    width: 0 !important;
}
@media (max-width: 1050px) {
    .game-detail-wrap .game-thumbnail.detail-thumb {
        height: 300px;
    }
}

.fa,
.far,
.fas {
    display: inline-block;
    min-width: 16px;
    font-style: normal;
    line-height: 1;
    text-align: center;
}
.fa-thumbs-up:before { content: '▲'; }
.fa-thumbs-down:before { content: '▼'; }
.fa-star:before { content: '☆'; }
.fas.fa-star:before { content: '★'; }
.icon-btn {
    gap: 7px;
}
.icon-btn i {
    font-size: 16px;
}
.rating-actions .btn.small {
    min-height: 36px;
    padding: 0 13px;
}
.rating-stats {
    align-items: center;
}
.rating-stats span {
    display: inline-flex;
    align-items: center;
    gap: 5px;
}
.rating-stats .fa-thumbs-up,
.rating-actions .fa-thumbs-up {
    color: #66f082;
}
.rating-stats .fa-thumbs-down,
.rating-actions .fa-thumbs-down {
    color: #ff5c62;
}
.rating-stats .fa-star,
.rating-actions .fa-star {
    color: #ffc400;
}
.rating-actions .btn.green i,
.rating-actions .btn.red i,
.rating-actions .btn.yellow i {
    color: #fff;
}
.vote-bar,
.vote-bar.rated,
.vote-bar.unrated {
    display: flex;
    width: 320px;
    max-width: 100%;
    height: 8px;
    margin-top: 9px;
    overflow: hidden;
    background: #626267;
}
.vote-bar.rated {
    background: transparent;
}
.vote-bar.rated .vote-like,
.vote-bar.rated .vote-dislike {
    display: block;
    height: 100%;
}
.vote-bar.rated .vote-like {
    background: var(--green);
}
.vote-bar.rated .vote-dislike {
    background: var(--red);
}
.vote-bar.unrated i,
.vote-bar.unrated b {
    display: none !important;
}

/* v20.3 site cleanup, feed, forum, email verification */
.email-confirm-banner { background:#b71922; color:#fff; border-bottom:1px solid #ff535a; font-size:16px; font-weight:900; }
.email-confirm-banner .bh-wrap { padding-top:9px; padding-bottom:9px; }
.email-confirm-banner a { color:#fff; text-decoration:underline; }
.beta-banner { display:none !important; }
.g-recaptcha { margin:12px 0; }
.fake-captcha { display:none !important; }
.auth-card input, .auth-card select { min-height:36px; }
.auth-card .g-recaptcha iframe { max-width:100%; }
.game-play-info .btn.large { font-size:34px; line-height:1.05; overflow:hidden; white-space:normal; text-align:center; }
.game-play-info .btn.large:empty { display:none; }
.game-hero.no-thumbnail .game-play-info { max-width:620px; }
.feed-post-form { display:grid; gap:10px; margin-bottom:14px; }
.feed-post-form textarea { width:100%; min-height:88px; resize:vertical; }
.feed-list { display:grid; gap:10px; }
.feed-post { display:grid; grid-template-columns:56px minmax(0,1fr); gap:10px; padding:10px; background:#29292c; border:1px solid #48484d; border-radius:4px; }
.feed-avatar-img { width:56px; height:56px; object-fit:contain; }
.feed-author { color:#9ad1ff; font-size:17px; font-weight:900; }
.feed-post time { display:block; color:#9999a1; font-size:12px; margin-top:2px; }
.feed-post p { margin:8px 0 0; white-space:pre-line; color:#fff; font-size:15px; font-weight:700; }
.forum-page .forum-table { margin-bottom:14px; }
.forum-row-link { color:inherit; text-decoration:none; }
.forum-row-link:hover { background:#404045; text-decoration:none; }
.topic-table .forum-head, .topic-table .forum-row { grid-template-columns:minmax(0,1fr) 100px 170px; }
.forum-topic-panel h1 { margin:0 0 4px; font-size:32px; }
.forum-post-list { display:grid; gap:10px; margin:14px 0; }
.forum-post { display:grid; grid-template-columns:150px minmax(0,1fr); gap:12px; background:#303032; border:1px solid #45454a; border-radius:4px; padding:12px; }
.forum-post aside { border-right:1px solid #45454a; padding-right:12px; }
.forum-avatar-img { width:96px; height:96px; object-fit:contain; margin-bottom:8px; }
.forum-post aside a { color:#9ad1ff; font-weight:900; }
.forum-post time { color:#aaaab0; font-size:13px; }
.forum-post p { margin:10px 0 0; white-space:pre-line; font-weight:700; }
.forum-compose form { display:grid; gap:10px; }
.forum-compose input, .forum-compose textarea { width:100%; background:#1f1f21; color:#fff; border:1px solid #555; border-radius:4px; padding:10px; }
.forum-compose textarea { min-height:140px; resize:vertical; }
.recent-topics { display:grid; gap:8px; }
.recent-topics a { display:block; padding:8px; background:#29292c; border:1px solid #45454a; border-radius:4px; }
.recent-topics a b { display:block; color:#fff; font-size:14px; }
.recent-topics a span { display:block; color:#9ad1ff; font-size:12px; margin-top:2px; }
@media (max-width:700px) { .forum-post, .feed-post { grid-template-columns:1fr; } .forum-post aside { border-right:0; border-bottom:1px solid #45454a; padding:0 0 10px; } }

/* v20.4 social/economy/clans cleanup */
.cube-logo { height: 43px; display: flex; align-items: center; padding: 0 16px 0 0; text-decoration: none; }
.cube-logo-mark { display: inline-block; color: #fff; font-size: 28px; line-height: 43px; font-weight: 900; letter-spacing: -1px; font-family: Arial, Helvetica, sans-serif; }
.cube-logo:hover { text-decoration: none; }
.bh-wallet .fa-money-bill, .currency-page .fa-money-bill, .item-meta-grid .fa-money-bill { color: #6dff8e; margin-right: 5px; }
.game-card .game-thumbnail, .game-thumb .game-thumbnail, .my-game-thumb .game-thumbnail { width: 100%; height: 100%; object-fit: cover; color: transparent; font-size: 0; }
.game-card a > .game-thumbnail { height: 132px; background: #333; border: 1px solid #444; }
.game-card a:has(> .game-thumbnail) { display:block; }
.profile-about p { font-size: 18px; color: #fff; }
.see-all-games { margin-top: 14px; }
.see-all-games summary { display: inline-flex; align-items: center; min-height: 34px; padding: 0 14px; border-radius: 4px; background: #44444a; color: #fff; cursor: pointer; }
.see-all-games[open] summary { margin-bottom: 12px; }
.currency-balance-panel h1 { margin: 0; font-size: 42px; }
.transaction-table { display: grid; gap: 0; border: 1px solid #49494d; }
.transaction-row { display: grid; grid-template-columns: 140px 145px 120px 120px minmax(0,1fr); gap: 10px; padding: 9px 10px; border-top: 1px solid #49494d; align-items: center; }
.transaction-row:first-child { border-top: 0; }
.transaction-head { background: #2b2b2e; color: #aaa; text-transform: uppercase; font-size: 13px; }
.transaction-row.positive span:nth-child(3) { color: #63ff83; }
.transaction-row.negative span:nth-child(3) { color: #ff686e; }
.membership-hero { text-align: center; background: linear-gradient(135deg,#106b9d,#1e9edd); }
.membership-hero h1 { font-size: 48px; margin: 0 0 8px; }
.membership-grid { display: grid; grid-template-columns: repeat(3,1fr); gap: 16px; margin-top: 16px; }
.membership-grid h2 { margin: 0 0 8px; font-size: 30px; }
.settings-page .upload-form small, .create-layout .upload-form small { display: block; color: #aaa; margin-top: 4px; font-size: 13px; }
.clans-list-layout { display: grid; grid-template-columns: minmax(0,1fr) 330px; gap: 18px; }
.clan-card-grid { display: grid; grid-template-columns: repeat(auto-fill,minmax(190px,1fr)); gap: 14px; margin-top: 14px; }
.clan-card { display: block; background: #2b2b2e; border: 1px solid #46464a; padding: 12px; border-radius: 4px; }
.clan-card:hover { text-decoration: none; background: #333337; }
.clan-card h3 { margin: 8px 0 2px; font-size: 22px; }
.clan-card p { margin: 0; color: #aaa; }
.clan-thumb { width: 140px; height: 140px; background: #222; border: 1px solid #555; display: grid; place-items: center; overflow: hidden; border-radius: 4px; flex: 0 0 auto; }
.clan-thumb.small { width: 100%; height: 120px; }
.clan-thumb img { width: 100%; height: 100%; object-fit: cover; }
.clan-thumb span { font-size: 24px; color: #fff; font-weight: 900; letter-spacing: -0.5px; font-family: Arial, Helvetica, sans-serif; }
.clan-thumb.small span { font-size: 21px; }
.create-clan-panel { max-width: 560px; margin: 0 auto; }
.form-actions { display: flex; gap: 10px; flex-wrap: wrap; align-items: center; }
.full-width { width: 100%; justify-content: center; text-align: center; }
.clan-hero .panel-body { display: flex; gap: 16px; align-items: center; }
.clan-hero h1 { margin: 0 0 6px; font-size: 42px; }
.clan-actions { margin-left: auto; display: flex; flex-direction: column; gap: 8px; }
.clan-grid { display: grid; grid-template-columns: minmax(0,1fr) 360px; gap: 18px; margin-top: 18px; }
.clan-member-list { display: grid; gap: 8px; }
.clan-member-row { background: #2b2b2e; border: 1px solid #46464a; padding: 8px; display: grid; grid-template-columns: 1fr auto; gap: 8px; align-items: center; }
.clan-member-row form { grid-column: 1 / -1; display: flex; gap: 6px; flex-wrap: wrap; }
.clan-member-row button { background: #4b4b50; color: #fff; border: 1px solid #666; border-radius: 3px; padding: 4px 8px; }
.clean-links a span { color: #aaa; font-size: 13px; margin-left: 4px; }
.email-confirm-banner { background: #d51e28; color: #fff; padding: 9px 0; text-align: center; font-weight: 900; }
.email-confirm-banner a { text-decoration: underline; }
@media (max-width: 900px) {
  .membership-grid, .clans-list-layout, .clan-grid, .clan-hero .panel-body, .transaction-row { grid-template-columns: 1fr; display: grid; }
  .clan-actions { margin-left: 0; }
  .bh-primary .bh-wrap { flex-wrap: wrap; }
}

/* v20.6 compact site scale */
@supports (zoom: 1) {
  body { zoom: var(--site-ui-scale, .75); }
}
@supports not (zoom: 1) {
  body { font-size: calc(16px * var(--site-ui-scale, .75)); }
  .bh-wrap, .page-wrap { max-width: calc(1420px / var(--site-ui-scale, .75)); }
}
.template-links { display:flex; flex-wrap:wrap; gap:8px; margin:10px 0; }
.template-links .btn.small { min-height:30px; padding:0 10px; font-size:13px; }
.upload-form small { display:block; color:var(--muted); font-size:12px; margin-top:3px; }
.catalog-auto-render-canvas { width:100%; height:100%; }

/* v20.7 clan list / create cleanup */
.clan-search { grid-template-columns: 1fr 120px 120px; align-items: center; }
.clan-search .btn { height: 42px; display: inline-flex; align-items: center; justify-content: center; }
@media (max-width: 800px) { .clan-search { grid-template-columns: 1fr; } }


/* v20.8 footer / compact zoom correction */
html { min-height: 100%; background: var(--bg); }
body { min-height: 100vh; }
.bh-footer { width: 100%; margin-top: auto; }
@supports (zoom: 1) {
  body { min-height: calc(100vh / var(--site-ui-scale, .75)); display: flex; flex-direction: column; }
  .bh-page { flex: 1 0 auto; min-height: calc((100vh / var(--site-ui-scale, .75)) - 155px); }
  .bh-footer { flex: 0 0 auto; }
}