/* Старый HUD убран — баланс рисует canvas-виджет игры. */ #hudBar { display: none !important; } /* HUD-кнопки рисуются в canvas (canvas-hud.js). HTML-разметка оставлена, но скрыта, чтобы не мелькала до инициализации canvas-кнопок. */ #hudFloat { display: none !important; } /* ───── Float-кнопки (legacy HTML, не используются) ───── */ #hudFloat { position: fixed; top: calc(env(safe-area-inset-top, 0px) + 14px); right: 14px; display: flex; gap: 10px; z-index: 200; font-family: var(--font-body); } #hudFloat button { width: 44px; height: 44px; background: linear-gradient(180deg, #2A1A47, #14092B); border: 1px solid rgba(212, 169, 92, 0.55); color: var(--gold-bright); border-radius: 50%; cursor: pointer; display: inline-flex; align-items: center; justify-content: center; padding: 0; position: relative; isolation: isolate; box-shadow: 0 8px 22px -8px rgba(0,0,0,0.85), 0 0 0 2px rgba(20, 9, 43, 0.5), inset 0 1px 0 rgba(244, 213, 141, 0.22); transition: transform 220ms cubic-bezier(.22,.61,.36,1), border-color 220ms ease, box-shadow 220ms ease; } #hudFloat button::before { content: ''; position: absolute; inset: 1px; border-radius: 50%; background: radial-gradient(ellipse at 50% 0%, rgba(244,213,141,0.22), transparent 60%); pointer-events: none; z-index: -1; } #hudFloat button:hover { transform: translateY(-1px) scale(1.04); border-color: rgba(244, 213, 141, 0.65); box-shadow: 0 10px 28px -6px rgba(0,0,0,0.7), 0 0 24px -4px rgba(244, 213, 141, 0.35), inset 0 1px 0 rgba(244, 213, 141, 0.30); } #hudFloat button:active { transform: translateY(0) scale(0.98); } #hudFloat button svg { width: 18px; height: 18px; display: block; stroke: currentColor; fill: none; stroke-width: 1.5; stroke-linecap: round; stroke-linejoin: round; } @media (max-width: 480px) { /* Stack on the same horizontal band as the canvas-rendered gear (~110px CSS), and leave room on the right for the gear itself (~60px from the right edge). */ #hudFloat { top: calc(env(safe-area-inset-top, 0px) + 110px); right: 60px; gap: 8px; } #hudFloat button { width: 40px; height: 40px; } #hudFloat button svg { width: 16px; height: 16px; } } /* Кабинет игрока: фон на весь экран, содержимое — колонкой. Отступы кабинету считает сам HUD (demo edit #11) по переменной --hud-col, но скретч единственный её не объявляет: его чипы висят по краям окна, а не по колонке, и двигать их незачем. Поэтому переменная объявляется только внутри кабинета — формулу она накормит, а до чипов снаружи не дотянется. Без неё в широком окне содержимое кабинета растягивалось во всю ширину: на 3440 px строки «Кошелёк» и «История» уезжали к самым краям. На телефоне min(480px, 100vw) даёт ширину окна, и отступы обнуляются. */ .hud-profile-overlay { --hud-col: 480px; } /* Монета FUN в чипе баланса. Жалоба со стенда: «баланс кошелька отличается, не фирменный с нашей логикой». Так и было: у пяти остальных игр рядом с числом стоит золотая монета с буквой F — они передают её в BalanceChip своим узлом (games/molot FunCoin, games/basketball Ton, games/obryv GramIcon). У скретча худ поднимает standalone-бандл, а тот принимает только `icon: 'none'` либо встроенный синий ромб TON. Ромб здесь неверен — стенд намеренно расфирмлен на игровые FUN, — поэтому и стояло 'none', и чип оставался единственным без монеты. Псевдоэлемент, а не вставка узла: разметку чипа рисует React, и добавленный руками потомок жил бы до первой перерисовки баланса. Чип — flex с зазором в 6 точек, так что ::after встаёт ровно туда же, куда у остальных игр встаёт переданная иконка. */ /* Host mode (coordinator follow-up, Task 3.5): the golden "F" coin is FUN demo branding — wrong next to a real EUR/USD balance. hud-bridge.js's mountHud() toggles .sg-host onto once the session (host or demo) is known, so this rule only fires for the demo path. */ html:not(.sg-host) .hud-balance-chip::after { content: ''; width: 18px; height: 18px; flex: 0 0 auto; background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 56 56'%3E%3Ccircle cx='28' cy='28' r='28' fill='%23F5B531'/%3E%3Ccircle cx='28' cy='28' r='22' fill='none' stroke='%23B67F16' stroke-width='2.4' opacity='.7'/%3E%3Ctext x='28' y='39' text-anchor='middle' font-size='30' font-weight='900' fill='%237A4D08' font-family='sans-serif'%3EF%3C/text%3E%3C/svg%3E") center / contain no-repeat; } /* HostBar (Task 3.5, js/app/host-bar.js) — the two host-mode-only navigation buttons (Deposit, Back to lobby), drawn outside the vendored cabinet since that library has no hook for external-URL navigation. Bottom-of-screen, out of the way of the game itself and the library's own top-row chips (mirrors matreshka's .dm-hostbar). */ .sg-hostbar { position: fixed; left: 0; right: 0; bottom: max(env(safe-area-inset-bottom, 0px), 12px); z-index: 2001; display: flex; justify-content: center; gap: 8px; padding: 0 16px; } .sg-hostbar__btn { border: 1px solid rgba(255, 255, 255, 0.24); border-radius: 12px; padding: 10px 16px; background: rgba(10, 12, 24, 0.82); color: #fff; -webkit-backdrop-filter: blur(6px); backdrop-filter: blur(6px); font-weight: 700; font-size: 13px; cursor: pointer; } .sg-hostbar__btn--primary { background: #f5b531; color: #2a1c04; border-color: transparent; } .sg-hostbar__btn:active { transform: scale(0.97); } /* Host mode (coordinator follow-up, I1): referrals, wallet (deposit/ withdraw — real deposits go through host-bar.js's own deposit_url instead) and support have no host-mode backend (server/src/games/ scratch/routes.ts answers 404 NOT_AVAILABLE_IN_HOST_MODE for all three, see /referral/info, /wallet/deposit, /wallet/withdraw, /support); hidden the same way matreshka's .dm-host already hides the equivalent [data-track="menu_*"] rows. .sg-host is toggled onto by hud-bridge.js's mountHud() once the session (host or demo) is known. */ html.sg-host [data-track="menu_referrals"], html.sg-host [data-track="menu_wallet"], html.sg-host [data-track="menu_help"] { display: none !important; } /* Host mode (R2, coordinator follow-up): quick_deposit (the profile hub's own "Пополнить" button) is a SEPARATE element from menu_wallet above — hiding one never hid the other. hud-bridge.js's interceptWalletOpen also stops the balance chip's own click (which has no data-track of its own to target with CSS) from opening the same wallet sheet. */ html.sg-host [data-track="quick_deposit"] { display: none !important; }