/* Wild Wherever display branding. Save identifiers and routes remain stable. */
.sidebar .brand{justify-content:center;letter-spacing:normal}
.sidebar .brand-logo{display:block;width:142px;height:142px;object-fit:contain}
.sidebar .side-caption{margin-top:8px;margin-bottom:25px;text-align:center;line-height:1.7}
.mobile-brand{display:none}
.game-brand{display:inline-flex;align-items:center;gap:8px;min-height:44px;max-width:100%}
.game-brand img,.brand-emblem{display:block;object-fit:contain;flex:none}
.account-brand-logo{display:block;width:130px;height:130px;object-fit:contain;margin-bottom:12px}
.hero-art .hero-brand-logo{position:absolute;inset:0;display:block;width:100%;height:100%;object-fit:contain;padding:8px 14px 28px;filter:drop-shadow(0 18px 18px #183d3220)}
.hero-art .compass{display:none}
.top .brand{gap:8px}.top .brand span{font-size:22px}
@media(max-width:1180px){.sidebar .brand-logo{width:125px;height:125px}}
@media(max-width:700px){
 .mobile-brand{display:inline-flex;align-items:center;gap:6px;flex:none;text-decoration:none;color:#234638;font:750 12px/1.05 system-ui;letter-spacing:-.2px}
 .mobile-brand img{width:32px;height:32px;object-fit:contain}
 .workspace>header>.breadcrumb,.workspace>header .demo-badge{display:none}
 .workspace>header{gap:6px}.workspace>header .header-right{margin-left:auto;gap:6px;min-width:0}
 .account-brand-logo{width:108px;height:108px;margin-bottom:8px}
 .game-brand{font-size:12px;gap:6px}
 body:has(.race-card) .game-brand img{display:none}
}
@media(max-width:560px){.top .brand span{font-size:17px;max-width:104px;line-height:1.12}.top .brand-emblem{width:37px;height:37px}.hero-art .hero-brand-logo{padding:4px 12px 25px}}
@media(max-width:360px){.mobile-brand{font-size:11px}.mobile-brand img{width:28px;height:28px}.workspace>header .journey-save-status{font-size:9px!important;padding:6px 7px!important}}

/* Keep the complete approved wordmark readable in compact return links. */
.game-brand img{width:44px;height:44px;object-fit:contain}

/* The guides use the same complete approved artwork, never a cropped emblem. */
.learn-body .guide-brand-back{display:inline-flex;align-items:center;gap:14px;max-width:100%;min-height:96px;text-decoration:none}
.learn-body .guide-brand-back img{display:block;width:96px;height:96px;flex:none;object-fit:contain}
.learn-body .guide-brand-back span{line-height:1.5}
.learn-body .guide-brand-back:focus-visible{outline:3px solid #b18e43;outline-offset:4px;border-radius:8px}


/* Animal Games visual refinement, 2026-10-31. Scoped to the racing screen only.
   Keep geometry and progression unchanged; brand.css loads after the race styles. */
#race-app .course-card{border-color:#c6ae76;box-shadow:0 12px 28px #102d2452,inset 0 0 0 1px #ffebbb48;transition:transform .18s ease,box-shadow .18s ease,border-color .18s ease}
#race-app .course-card:not(:disabled):hover{transform:translateY(-2px);border-color:#ffe4a8;box-shadow:0 16px 32px #102d2470,inset 0 0 0 1px #ffebbb7a}
#race-app .course-card:focus-visible{outline:4px solid #f7cf78;outline-offset:4px}
#race-app .course-card .racer-art{border-color:#fff3c5;box-shadow:0 8px 21px #0a231d78,0 0 0 3px #f4d38b55}
#race-app .race-scene{isolation:isolate;border:2px solid #dfcfaa;border-radius:20px;box-shadow:inset 0 0 40px #183c3445,0 11px 28px #133b3050;overflow:hidden}
#race-app .race-scene .course-label{background:linear-gradient(90deg,#163d32e8,#285344bd);border:1px solid #f4dea45e;border-radius:12px;color:#fff4cf;text-shadow:0 1px 3px #11271d}
#race-app .race-scene .race-lane{border-bottom-color:#f8edcba8;box-shadow:inset 0 1px #fff7d055}
#race-app .race-scene .lane-name{background:#143c32eb;border:1px solid #f1d391;color:#fff4dc;box-shadow:0 2px 7px #0d2927b0}
#race-app .race-scene .runner .racer-art{border:2px solid #fff3cf;box-shadow:0 3px 10px #091f1d8c,0 0 0 2px #f4d28c44;background:#e9f0d9}
#race-app .race-scene .finish-post{filter:drop-shadow(0 3px 5px #153d3699)}
#race-app .race-card{border-color:#c9d2b1;background:linear-gradient(145deg,#fffefa,#f1f4e8);box-shadow:0 6px 22px #153d3023}
#race-app .race-card .race-hud>*{background:linear-gradient(155deg,#f8f5e7,#e5eee4);border:1px solid #bdd0b9!important;border-radius:13px;box-shadow:inset 0 1px #fff;color:#234b37}
#race-app .race-card .track,#race-app .race-card .meter{background:#d1ddcb;border:1px solid #a9bea6;box-shadow:inset 0 2px 3px #34594026}
#race-app .race-card .track i,#race-app .race-card .meter i{background:linear-gradient(90deg,#2f775b,#6abf8c,#f2ce77)}
#race-app .race-card .track.rival i{background:linear-gradient(90deg,#926544,#d8a76c)}
#race-app .race-card .prompt{background:#fff2cb;border:1px solid #e3c580;border-left:5px solid #a47d38;color:#3c4e31;box-shadow:0 2px 8px #755b2520}
#race-app .race-card .controls button,#race-app .race-card .race-arrow-buttons button,#race-app .race-card .race-input-button{background:linear-gradient(180deg,#f4d58f,#dfb361);border:1px solid #f9e2ab;border-bottom:6px solid #ac7b31;border-radius:15px;color:#1e4636;text-shadow:none;box-shadow:0 5px 14px #16423442;transition:filter .12s ease,transform .12s ease}
#race-app .race-card .controls button:active,#race-app .race-card .race-arrow-buttons button:active{transform:translateY(3px);border-bottom-width:3px;filter:brightness(1.05)}
#race-app .race-card .gesture-pad{background:linear-gradient(180deg,#39795c,#20523f);border:2px solid #d7b46e;box-shadow:inset 0 1px #ffffff3d,0 5px 13px #0d2a2450;color:#fff5d6;border-radius:15px}
#race-app .race-card button:focus-visible,#race-app .race-card .gesture-pad:focus-visible{outline:4px solid #d9a754;outline-offset:3px}
#race-app .race-result-card,#race-app .podium{border-radius:18px;border:1px solid #dbb978;box-shadow:0 8px 25px #15392f40}
#race-app .race-result-actions button{background:linear-gradient(160deg,#2b684c,#164735);border-color:#2a664a;color:#fff8e4;min-height:48px}
@media(max-width:700px){#race-app .course-card{box-shadow:0 7px 17px #102d243b}#race-app .race-scene{border-radius:14px;border-width:1px}#race-app .race-card .prompt{padding:10px;border-left-width:4px}#race-app .race-card .controls button,#race-app .race-card .race-arrow-buttons button{min-height:56px}}
@media(prefers-reduced-motion:reduce){#race-app .course-card,#race-app .race-card button{transition:none!important}#race-app .course-card:not(:disabled):hover{transform:none}}