/* V-3B.4. Home demo only; all source artwork remains frozen. */
.br-home { background: radial-gradient(ellipse at 68% 40%,#233331,#0d151b 72%); }
.br-home main.container { max-width: 1320px; padding: 8px 24px 12px !important; }
.br-home .home-masthead { position: relative; z-index: 5; }
.br-home .home-brand { position: absolute; z-index: 8; left: 17px; top: 8px; width: 184px; display: block; filter: drop-shadow(0 2px 1px #0006); }
.br-home .home-brand img { display: block; width: 100%; height: auto; }

/* System HUD: inset counters and compact controls above the separate season rail. */
.br-home .home-hud { display: flex; justify-content: flex-end; align-items: center; gap: 14px; min-height: 66px; padding: 7px 16px 7px 220px; background: linear-gradient(#263637,#152428); border: 1px solid #495958; border-bottom: 3px solid #080f13; box-shadow: inset 0 2px 0 #71837633; }
.br-home .home-languages { display: flex; gap: 0; margin-right: auto; }
.br-home .home-languages a { display: grid; place-items: center; min-width: 44px; min-height: 44px; font-size: .7rem; font-weight: 800; text-decoration: none; border: 1px solid transparent; border-radius: 5px; }
.br-home .home-languages [aria-current] { color: var(--br-gold); background: #0d191b; border-color: #7c7044; box-shadow: inset 0 -3px 0 #bfa34d; }
.br-home .home-counters { display: flex; gap: 10px; }
.br-home .home-counters .br-currency { min-width: 122px; flex: 0 1 auto; padding: 3px 12px 3px 7px; gap: 8px; background: #0d191c; border: 1px solid #526153; border-radius: 6px 14px 6px 6px; box-shadow: inset 0 2px 3px #0009,0 1px 0 #98a38a33; }
.br-home .home-counters .br-placeholder-icon { width: 27px; height: 27px; flex-basis: 27px; }
.br-home .home-counters .br-currency-reading strong { font-size: 1.02rem; }
.br-home .home-counters .br-currency-reading > span { font-size: .58rem; letter-spacing: .08em; }
.br-home .home-wallet { min-width: 152px; }
.br-home .home-wallet .br-wallet-status { display: none; }
.br-home .home-wallet .br-wallet-button { --button-body: #46385e; min-height: 44px; padding: .45rem .65rem; font-size: .7rem; border-radius: 6px; }
/* Normal account access is secondary; the existing purple wallet CTA is unchanged. */
.br-home .home-account-entry { display:flex; align-items:center; justify-content:center; flex-shrink:0; min-width:44px; min-height:44px; padding:6px; border:1px solid #526153; border-radius:5px; background:#0d191c; color:var(--br-text); box-shadow:inset 0 1px 0 #71837633; font-size:.7rem; font-weight:800; line-height:1.2; white-space:nowrap; text-decoration:none; }
.br-home .home-account-entry:hover { border-color:var(--br-gold); color:var(--br-gold); }

/* Genesis is a status rail, not an explanatory card. */
.br-home .home-genesis .br-genesis-widget { position: relative; display: grid; grid-template-columns: minmax(190px,1fr) minmax(300px,1.8fr) auto; gap: 3px 18px; padding: 10px 16px 10px 220px; align-items: center; border: 0; border-bottom: 2px solid #8f7f47; border-radius: 0; box-shadow: inset 0 -3px 0 #070f1344; background: linear-gradient(100deg,#26392b,#19282a 70%); }
.br-home .home-genesis .br-genesis-heading { grid-column: 1; grid-row: 1; gap: 7px; }
.br-home .home-genesis .br-genesis-heading h3 { font-size: .8rem; margin: 0; letter-spacing: .02em; }
.br-home .home-genesis .br-genesis-mark { font-size: 1.2rem; }
.br-home .home-genesis .br-genesis-copy { grid-column: 1; grid-row: 2; margin: 0; font-size: .63rem; line-height: 1.4; color: #c5cec0; }
.br-home .home-genesis .br-genesis-stats { grid-column: 2; grid-row: 1/3; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; margin: 0; }
.br-home .home-genesis .br-genesis-stats > div { padding-left: 13px; border-left: 2px solid #67744877; }
.br-home .home-genesis .br-genesis-stats > div:last-child { grid-column: auto; display: block; border-top: 0; padding-top: 0; }
.br-home .home-genesis .br-genesis-stats dt { font-size: .6rem; margin-bottom: 3px; text-transform: uppercase; letter-spacing: .045em; color: #c0c9b7; }
.br-home .home-genesis .br-genesis-stats dd { font-size: .78rem; }
.br-home .home-genesis .br-genesis-stats > div:first-child dd { color: #e8efc6; font-size: 1rem; line-height: 1.1; }
.br-home .home-genesis .br-wallet-state { grid-column: 3; grid-row: 1/3; }
.br-home .home-genesis .br-wallet-status { font-size: .6rem; margin: 0; color: var(--br-text-muted); }
.br-home .home-genesis .br-wallet-button { display: none; }

/* One abstract 2D arena, with a foreground unit and an opposite-side target. */
.br-home .home-game { position: relative; isolation: isolate; height: clamp(520px,calc(100svh - 220px),676px); background: #17282b; }
.br-home .home-stage { position: absolute; inset: 0; overflow: hidden; isolation: isolate; background: radial-gradient(ellipse at 74% 24%,#89946b45,transparent 49%),linear-gradient(135deg,#102329,#304c45 62%,#192b2d); }
.br-home .home-stage::before { content: ''; position: absolute; inset: 0; z-index: 0; background: radial-gradient(ellipse at 73% 44%,#cfce9130,transparent 39%),linear-gradient(177deg,transparent 38%,#ced8a90a 38.2%,transparent 38.8%,transparent 44%,#ced8a910 44.2%,transparent 44.8%); mask-image: linear-gradient(90deg,transparent 22%,#000 57%,#000 80%,transparent);  pointer-events: none; }
.br-home .home-stage::after { content: ''; position: absolute; inset: 0; z-index: 3; background: radial-gradient(ellipse at 52% 39%,transparent 35%,#06121677 100%); pointer-events: none; }
.br-home .home-ground { position: absolute; z-index: 0; inset: 45% -3% 0; border-radius: 50% 50% 0 0 / 6% 6% 0 0; background: radial-gradient(ellipse at 75% 12%,#88835830,transparent 46%),linear-gradient(180deg,#3e4833,#353e2e 60%,#202d26); border-top: 1px solid #91a57533; box-shadow: 0 -10px 25px #64745614; }
.br-home .home-ground::before { content: ''; position: absolute; inset: 0; opacity: .35; background: repeating-linear-gradient(0deg,transparent 0 41px,#b3ae6f0e 42px,transparent 43px 71px); mask-image: radial-gradient(ellipse at 57% 30%,#000,transparent 65%); }
.br-home .home-stage-tagline { position: absolute; z-index: 3; top: 22px; left: 28px; max-width: 44%; margin: 0; color: #f2e1a3; font-weight: 900; font-style: italic; font-size: clamp(1.05rem,1.55vw,1.4rem); line-height: 1.4; text-shadow: 2px 3px 0 #0d211e; }
.br-home .home-moo-foreground, .br-home .home-wall-target { position: absolute; aspect-ratio: 1; }
.br-home .home-moo-foreground { z-index: 2; width: 56%; left: -15%; bottom: -12%; }
.br-home .home-wall-target { z-index: 1; width: 42%; right: -1%; top: 4%; }
.br-home .home-moo, .br-home .home-wall { display: block; position: relative; object-fit: contain; width: 100%; height: auto; filter: drop-shadow(4px 8px 2px #0b160d88); }
.br-home .home-moo { aspect-ratio: 1; }
.br-home .home-moo-frame { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: contain; }
.br-home .home-moo-frame[hidden] { display: none; }
@media (prefers-reduced-motion: reduce) {
    .br-home .home-moo-frame { visibility: hidden; }
    .br-home .home-moo-frame:first-child { display: block; visibility: visible; }
}
.br-home .home-contact-shadow { position: absolute; width: 100%; height: 12%; left: 1%; bottom: 11%; border-radius: 50%; background: radial-gradient(ellipse,#08110a 8%,#08110abd 36%,transparent 72%); transform: scaleX(1.07); }
.br-home .home-moo-foreground .home-contact-shadow { bottom: 17%; width: 100%; height: 16%; left: 6%; background: radial-gradient(ellipse,#08110a 12%,#08110abf 44%,transparent 72%); }
.br-home .home-wall-label { position: absolute; z-index: 3; top: 17px; right: 9%; display: grid; justify-items: center; gap: 3px; padding: 5px 24px; color: #f1e8c4; background: linear-gradient(90deg,transparent,#14211dbb,transparent); text-align: center; }
.br-home .home-wall-label::before, .br-home .home-wall-label::after { content: ''; position: absolute; top: 10px; bottom: 5px; width: 7px; border-block: 2px solid #bca766; }
.br-home .home-wall-label::before { left: 0; border-left: 2px solid #bca766; }
.br-home .home-wall-label::after { right: 0; border-right: 2px solid #bca766; }
.br-home .home-wall-label > span { color: #c2c7a5; font-size: .52rem; font-weight: 800; letter-spacing: .18em; }
.br-home .home-wall-label > strong { font-size: .85rem; font-weight: 900; letter-spacing: .06em; }

/* The meter and strike key share one compact, inset console inside the arena. */
.br-home .home-game-actions { position: absolute; z-index: 4; right: 5%; bottom: 16px; width: 45%; display: grid; justify-items: center; gap: 7px; border: 0; background: none; }
.br-home .home-control-core { position: relative; isolation: isolate; width: 100%; display: grid; justify-items: center; gap: 4px; padding: 5px 16px 8px; }
.br-home .home-control-core::before { content: ''; position: absolute; z-index: -1; inset: 0; background: linear-gradient(160deg,#72815c,#344634 32%,#102420 67%); border: 1px solid #85915c; border-radius: 14px 14px 24px 24px; box-shadow: inset 0 3px 0 #e9eac329,inset 0 -5px 0 #071313,0 5px 0 #060d10,0 12px 20px #07131166; }
.br-home .home-control-core::after { content: ''; position: absolute; z-index: -1; inset: 4px; border: 1px solid #101f1a; border-radius: 9px 9px 19px 19px; pointer-events: none; }
.br-home .home-game-actions .br-market-progress { width: 100%; padding: 0 3px; background: none; border: 0; border-radius: 0; box-shadow: none; }
.br-home .home-game-actions .br-progress-heading { margin-bottom: 5px; font-size: .73rem; text-shadow: 0 2px 1px #000; }
.br-home .home-game-actions .br-progress-heading > strong { font-size: .65rem; color: #dce8b1; }
.br-home .home-game-actions .br-progress-track { height: 24px; border-width: 3px; border-radius: 6px; box-shadow: 0 1px 0 #b2c27d55; }
.br-home .home-game-actions .br-btn-primary { position: relative; width: 96%; min-height: 66px; padding: .55rem 2rem; border-radius: 9px 9px 15px 15px; border-width: 3px; font-size: 1.85rem; letter-spacing: .055em; background: linear-gradient(#ffe476,#ffcd3e 40%,#dca321); box-shadow: inset 0 3px 0 #fff4b2,inset 0 -6px 0 #9c691e,0 5px 0 #071012; }
.br-home .home-game-actions .br-btn-primary::before, .br-home .home-game-actions .br-btn-primary::after { content: ''; position: absolute; top: 37%; width: 7px; height: 16px; border-block: 2px solid #79551f88; }
.br-home .home-game-actions .br-btn-primary::before { left: 15px; border-left: 3px solid #79551f88; }
.br-home .home-game-actions .br-btn-primary::after { right: 15px; border-right: 3px solid #79551f88; }
.br-home .home-preview-note { min-height: 14px; margin: 0; color: #c7d0c1; text-align: center; font-size: .6rem; line-height: 1.4; text-shadow: 0 1px 2px #000; }

/* A single function dock; selection has a raised edge and marker, not color alone. */
.br-home main > .br-bottom-nav { margin-top: 0; gap: 2px; padding: 5px 10px; border: 2px solid #080f13; border-top: 1px solid #7b865c; border-radius: 0 0 10px 10px; background: linear-gradient(#25362f,#101e22); box-shadow: inset 0 2px 0 #b6c08a22,0 4px 0 #080f13; }
.br-home .br-nav-item { position: relative; min-height: 57px; padding: 5px; flex-direction: row; gap: 10px; font-size: .68rem; background: transparent; border-radius: 6px; color: #a3b1ae; }
.br-home .br-nav-item .br-placeholder-icon { width: 29px; height: 29px; flex-basis: 29px; color: inherit; border-width: 1px; border-radius: 8px; }
.br-home .br-nav-item .br-placeholder-icon::before { font-size: 23px; }
.br-home .br-nav-item.is-active { border-color: #bca657; background: linear-gradient(#54492b,#242d23); box-shadow: inset 0 2px 0 #ffe7a699,inset 0 -3px 0 #beaa57,0 2px 0 #060e12; color: #ffe393; }
.br-home .br-nav-item.is-active::after { content: ''; position: absolute; top: -2px; width: 28px; height: 3px; background: #ffe393; }
.br-home .br-nav-item.is-active .br-placeholder-icon { border-width: 2px; transform: translateY(-1px); }
.br-home .br-nav-item:not(.is-active):hover { background: #30423a; border-color: #6e7c65; }

@media (min-width: 768px) and (max-width: 1100px) {
    .br-home .home-account-entry { padding-inline:1px; font-size:.6rem; }
    .br-home .home-brand { width: 155px; top: 18px; }
    .br-home .home-hud { padding-left: 185px; gap: 7px; }
    .br-home .home-counters .br-currency { min-width: 75px; padding: 4px 7px; }
    .br-home .home-counters .br-placeholder-icon { display: none; }
    .br-home .home-genesis .br-genesis-widget { padding-left: 185px; grid-template-columns: 1fr 1.6fr; }
    .br-home .home-genesis .br-wallet-state { grid-column: 2; grid-row: 2; }
    .br-home .home-genesis .br-genesis-stats { grid-row: 1; }
    .br-home .home-moo-foreground { width: 69%; left: -20%; bottom: -7%; }
    .br-home .home-wall-target { width: 45%; top: 14%; }
    .br-home .home-game-actions { width: 47%; right: 3%; }
}
@media (max-width: 767.98px) {
    .br-home main.container { display: flex; flex-direction: column; min-height: 100svh; padding: 4px 8px calc(70px + env(safe-area-inset-bottom)) !important; }
    .br-home .home-masthead { flex-shrink: 0; }
    .br-home .home-brand { left: 5px; top: 36px; width: 100px; }
    .br-home .home-hud { display: grid; grid-template-columns: minmax(0,1fr) 96px; gap: 0 7px; padding: 0 5px 0 116px; min-height: 92px; }
    .br-home .home-languages { grid-column: 1/-1; justify-content: flex-end; margin: 0; }
    /* Share row one with the right-aligned locales; keep the original two-row HUD. */
    .br-home .home-hud .home-languages { grid-row:1; }
    .br-home .home-hud .home-account-entry { grid-column:1; grid-row:1; justify-self:start; align-self:center; z-index:1; padding-inline:2px; font-size:.6rem; }
    .br-home .home-hud .home-counters { grid-column:1; grid-row:2; }
    .br-home .home-hud .home-wallet { grid-column:2; grid-row:2; }
    .br-home .home-languages a { font-size: .65rem; }
    .br-home .home-counters { gap: 6px; min-width: 0; }
    .br-home .home-counters .br-currency { min-width: 0; flex: 1; gap: 0; padding: 3px 4px; border-radius: 4px; }
    .br-home .home-counters .br-placeholder-icon { display: none; }
    .br-home .home-counters .br-currency-reading strong { font-size: .72rem; }
    .br-home .home-counters .br-currency-reading > span { font-size: .5rem; }
    .br-home .home-wallet { min-width: 0; }
    .br-home .home-wallet .br-wallet-button { font-size: .6rem; padding: 6px 4px; }
    .br-home .home-wallet .br-placeholder-icon { display: none; }
    .br-home .home-genesis .br-genesis-widget { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 4px; padding: 5px 8px 6px; }
    .br-home .home-genesis .br-genesis-heading { grid-column: 1/-1; grid-row: 1; padding-left: 100px; min-height: 18px; }
    .br-home .home-genesis .br-genesis-heading h3 { font-size: .7rem; }
    .br-home .home-genesis .br-genesis-mark { display: none; }
    .br-home .home-genesis .br-genesis-copy { display: none; }
    .br-home .home-genesis .br-genesis-stats { display: contents; }
    .br-home .home-genesis .br-genesis-stats > div { grid-row: 2; padding-left: 7px; }
    .br-home .home-genesis .br-genesis-stats dt { font-size: .55rem; letter-spacing: 0; }
    .br-home .home-genesis .br-genesis-stats dd { font-size: .68rem; }
    .br-home .home-genesis .br-genesis-stats > div:first-child dd { font-size: .8rem; }
    .br-home .home-genesis .br-wallet-state { position: absolute; right: 8px; top: 7px; }
    .br-home .home-genesis .br-wallet-status { font-size: .55rem; }
    .br-home .home-game { flex: 1 0 480px; height: auto; min-height: 480px; }
    .br-home .home-stage-tagline { top: 15px; left: 13px; max-width: 57%; font-size: .84rem; }
    .br-home .home-ground { inset: 36% -3% 0; }
    .br-home .home-moo-foreground { width: 100%; left: -30%; bottom: 20%; }
    .br-home .home-wall-target { width: 65%; right: -10%; top: 11%; }
    .br-home .home-wall-label { top: 16px; right: 6px; max-width: 37%; padding: 5px 9px; gap: 2px; }
    .br-home .home-wall-label > span { font-size: .42rem; letter-spacing: .05em; }
    .br-home .home-wall-label > strong { font-size: .62rem; }
    .br-home .home-game-actions { left: 13px; right: 13px; bottom: 13px; width: auto; gap: 8px; }
    .br-home .home-control-core { padding: 4px 10px 7px; gap: 4px; }
    .br-home .home-game-actions .br-progress-heading { font-size: .65rem; }
    .br-home .home-game-actions .br-progress-heading > strong { font-size: .6rem; }
    .br-home .home-game-actions .br-progress-track { height: 23px; }
    .br-home .home-game-actions .br-btn-primary { min-height: 60px; width: 100%; font-size: 1.7rem; }
    .br-home .home-preview-note { min-height: 13px; font-size: .57rem; }
    .br-home main > .br-bottom-nav { border-radius: 0; padding: 4px max(4px,env(safe-area-inset-right)) calc(4px + env(safe-area-inset-bottom)) max(4px,env(safe-area-inset-left)); }
    .br-home .br-nav-item { min-height: 60px; flex-direction: column; padding: 4px 2px; gap: 3px; font-size: .55rem; }
    .br-home .br-nav-item .br-placeholder-icon { width: 27px; height: 27px; flex-basis: 27px; }
}