.game-hud { display: flex; align-items: center; gap: 12px; margin-bottom: 12px; flex-wrap: wrap; }
.bal-pill { display: flex; align-items: center; gap: 6px; background: var(--parch-2); border: 2px solid var(--parch-edge); border-radius: 8px; padding: 5px 11px; font-weight: 700; color: var(--ink); }
.level-pill { display: flex; align-items: center; gap: 8px; color: var(--ink-2); font-weight: 700; }
.level-pill b { color: var(--ink); }
.xp-bar { width: 90px; height: 9px; background: var(--parch-3); border: 1px solid var(--parch-edge); border-radius: 999px; overflow: hidden; }
.xp-fill { display: block; height: 100%; width: 0%; background: var(--green); }
.rate-pill { color: var(--ink-2); font-weight: 700; }

#tycoon-canvas { width: 100%; height: auto; background: #b9a578; border: 3px solid var(--parch-edge); border-radius: 8px; display: block; }

.game-controls { margin-top: 12px; }
.buy-panel { display: flex; gap: 10px; flex-wrap: wrap; margin-top: 12px; }
.buy-card { flex: 1; min-width: 180px; background: var(--parch-2); border: 2px solid var(--parch-edge); border-radius: 6px; padding: 10px; text-align: left; }
.buy-card .name { font-family: var(--font-display); font-weight: 700; color: var(--title); }
.buy-card .meta { color: var(--ink-2); font-size: 13px; margin: 4px 0 8px; }
.buy-card button { width: 100%; }
.buy-card button:disabled { opacity: 0.5; cursor: not-allowed; box-shadow: none; transform: none; }

.lb { width: 100%; border-collapse: collapse; }
.lb th, .lb td { text-align: left; padding: 8px 10px; border-bottom: 1px solid var(--parch-edge); }
.lb th { color: var(--ink-2); font-size: 12px; text-transform: uppercase; letter-spacing: 0.5px; }
.lb td:nth-child(3) { text-align: right; color: var(--title); font-weight: 900; }
.lb tr.you { background: rgba(255,204,51,0.22); }
.lb tr.you td { font-weight: 900; }

.badge-grid { display: grid; grid-template-columns: repeat(auto-fit, minmax(180px, 1fr)); gap: 10px; }
.badge { background: var(--parch-2); border: 2px solid var(--parch-edge); border-radius: 6px; padding: 12px; }
.badge.off { opacity: 0.55; }
.badge.on { border-color: var(--gold); box-shadow: 0 0 0 1px var(--gold); }
.badge-name { font-family: var(--font-display); font-weight: 700; color: var(--title); }
.badge-desc { color: var(--ink-2); font-size: 13px; margin: 4px 0 8px; }
.badge-state { font-size: 12px; font-weight: 900; }
.badge.on .badge-state { color: var(--green); }
.badge.off .badge-state { color: var(--ink-dim); }