/* Approved daytime steampunk player UI. Loaded after legacy/responsive rules. */
body.game-themed.container.game-home {
  --ui-bg: #06172b; --ui-surface: #061b31ec; --ui-surface-strong: #0d2e48;
  --ui-text: #f2f7ff; --ui-muted: #c0d3e6; --ui-border: #32d7ff80;
  --ui-border-strong: #3fcfffb0; --ui-accent: #46eaff; --ui-accent-2: #ffe851;
  --steam-cyan: #35e0ff; --steam-yellow: #ffe745; --steam-red: #ff5b60;
  --ui-radius: 10px; --ui-radius-sm: 6px;
  width: 100%; max-width: none; margin: 0; padding: 0 0 40px;
  background: linear-gradient(#03142c10, #03142c28), url('./home/steampunk-city-day.webp') center / cover fixed;
  color: var(--ui-text); isolation: isolate;
}
.game-themed .player-header { display: flex; flex-wrap: wrap; align-items: center; gap: 12px 22px; position: relative; z-index: 3; padding: 12px clamp(16px, 2.2vw, 36px); margin-bottom: 28px; border-bottom: 1px solid #34dfff; background: #031529f7; box-shadow: 0 6px 24px #04122955; }
.game-themed .player-brand { display: flex; align-items: center; gap: 12px; color: #f5f9ff; text-decoration: none; flex-shrink: 0; }
.player-brand svg { width: 42px; height: 45px; color: #30e1ff; }
.player-brand strong { display: block; font-size: 25px; line-height: 1.15; letter-spacing: .19em; }
.player-brand small { display: block; font-size: 9px; letter-spacing: .3em; color: #42e9ff; margin-top: 4px; }
.player-nav { display: flex; align-self: stretch; align-items: stretch; flex: 1 1 auto; gap: 0; min-width: 0; }
.game-themed .player-nav__link { display: flex; align-items: center; justify-content: center; padding: 12px 13px; border-left: 1px solid #6d91b248; border-bottom: 2px solid transparent; color: #e3edfc; font-weight: 700; text-decoration: none; font-size: 14px; white-space: nowrap; }
.game-themed .player-nav__link.is-current { color: #43e7ff; border-bottom-color: #43e7ff; background: linear-gradient(0deg,#16d4ff20,transparent); }
.game-themed .player-nav__link--gacha.is-current { color: #ffe745; border-bottom-color: #ffe745; }
.game-themed .player-nav__link--battle.is-current { color: #ff7379; border-bottom-color: #ff5b60; }
.game-themed .player-nav__link:hover { color: white; background: #1c526155; }
.player-wallet { display: flex; align-items: center; gap: 7px; padding: 7px 12px; color: #fff; border: 1px solid #99bddd80; border-left: 2px solid #ffe745; border-radius: 7px; background: #071c32; }
.player-wallet svg { width: 27px; height: 27px; color: #ffe745; transform: rotate(-15deg); flex-shrink: 0; }
.player-wallet > span { font-size: 11px; }.player-wallet strong { font-size: 25px; line-height: 1.25; font-variant-numeric: tabular-nums; color: #ffe745; }.player-wallet small { font-size: 11px; }
.player-user { display: flex; gap: 8px; align-items: center; max-width: 150px; min-width: 0; font-size: 11px; color: #d3e4f8; }
.player-user svg { width: 30px; height: 30px; flex-shrink: 0; border: 1px solid #81b4d5; border-radius: 50%; padding: 4px; }
.player-utility { display: flex; gap: 16px; font-size: 11px; }.player-utility a { color: #e4efff; min-height: 32px; display: flex; align-items: center; text-decoration: none; }
.game-themed .player-utility a[aria-current="page"] { color: #ffe745; box-shadow: inset 0 -2px #ffe745; }
.game-themed > .game-home-header, .game-themed > main, .game-themed > .admin-message { width: calc(100% - 64px); max-width: 1480px; margin-left: auto; margin-right: auto; }
.game-themed > .game-home-header { padding: 18px 24px; margin-bottom: 20px; border: 1px solid #36dfff66; border-left: 3px solid #3be6ff; border-radius: 8px; background: linear-gradient(100deg,#03172be8,#062039cf); box-shadow: 0 6px 20px #03203540; }
.game-themed .game-brand__sub, .game-themed .game-panel__label { color: #56eafa; font-size: 11px; letter-spacing: .14em; font-weight: 700; }
.game-themed .game-brand__title { font-size: clamp(24px,2.4vw,36px); margin: 0; color: white; }
.game-themed .game-brand__login { font-size: 13px; color: #d1e1ef; }
.game-themed .game-panel { position: relative; padding: clamp(16px, 1.8vw, 26px); border: 1px solid #28c7efb0; border-radius: 10px; background: linear-gradient(125deg,#06233bef,#05162bf5); box-shadow: inset 0 1px 0 #a7eaff30,0 10px 24px #06172955; }
.game-themed .game-panel::before { content: ''; position: absolute; left: 4px; top: 4px; width: 18px; height: 13px; border-left: 2px solid #36e4ff; border-top: 2px solid #36e4ff; border-radius: 5px 0 0; pointer-events: none; }
.game-themed .game-panel__title { color: #f7fbff; }
.game-themed .game-panel__text, .game-themed .muted { color: #bfd1e4; }
.game-themed .link, .game-themed .game-mini-btn, .game-themed .btn, .game-themed .battle-lobby-btn { background: linear-gradient(125deg,#0d3a51,#061c33); color: #aff6ff; border: 1px solid #36d7f2; border-radius: 6px; box-shadow: inset 0 0 13px #15cbff0d; text-decoration: none; }
.game-themed button:hover:not(:disabled), .game-themed .link:hover { filter: brightness(1.14); }
.game-themed input:not([type=checkbox]):not([type=radio]), .game-themed select, .game-themed textarea { background: #031a30; border-color: #448eae; color: #f3f8ff; border-radius: 6px; }
.game-themed select option { background: #071d32; color: white; }
.game-themed :focus-visible { outline: 3px solid #ffeb74; outline-offset: 3px; }
.game-themed .catalog-filter { border: 1px solid #2bd8ff66; background: #04243bc9; border-radius: 7px; padding: 14px; }
.game-themed .game-ticket-panel { border: 1px solid #ffea5288; background: #061a2ded; border-radius: 8px; }
.game-themed .game-ticket-panel__value { color: #ffe745; }
.game-themed .card { background: #071d32ee; border-color: #42d7ff66; }
.game-themed .error, .game-themed .admin-message--error { color: #ffe5e7; background: #441b2cf5; border-color: #ff7186; }
@media (min-width: 1500px) { .game-themed .player-header { flex-wrap: nowrap; gap: 18px; }.player-nav { justify-content: center; } }
@media (max-width: 1499px) { .game-themed .player-header { gap: 10px 20px; }.player-nav { order: 5; flex-basis: 100%; justify-content: center; }.player-nav__link { flex: 1; }.player-wallet { margin-left: auto; }.player-user { max-width: 260px; }.game-themed .player-nav__link { padding: 10px; } }
@media (max-width: 760px) {
  body.game-themed { background-attachment: scroll; padding-bottom: 24px; }
  .game-themed .player-header { margin-bottom: 16px; padding: 12px 14px; gap: 9px 12px; }
  .player-brand svg { width: 30px; height: 35px; }.player-brand strong { font-size: 20px; }.player-brand small { font-size: 7px; }.game-themed .player-brand { gap: 8px; }
  .player-wallet { padding: 6px 8px; gap: 5px; }.player-wallet svg { width: 20px; }.player-wallet strong { font-size: 20px; }.player-wallet > span { font-size: 9px; }
  .player-user { flex: 1 1 160px; max-width: calc(100% - 135px); font-size: 10px; }.player-user svg { width: 24px; height: 24px; }.player-utility { margin-left: auto; font-size: 10px; gap: 12px; }
  .player-nav { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 5px; }.game-themed .player-nav__link { white-space: normal; border: 1px solid #588ca548; border-radius: 4px; font-size: 12px; padding: 8px 3px; min-height: 40px; }.game-themed .player-nav__link.is-current { border-color: currentColor; }
  .game-themed > .game-home-header, .game-themed > main, .game-themed > .admin-message { width: calc(100% - 24px); }
  .game-themed > .game-home-header { padding: 16px; }.game-themed .game-panel { padding: 16px; }.game-themed .game-brand__login { font-size: 12px; }
}
@media (max-width: 360px) { .player-wallet > span { display: none; }.game-themed .player-header { gap: 8px; }.player-brand strong { font-size: 19px; }.player-wallet { gap: 4px; } }
@media (prefers-reduced-motion: reduce) { .game-themed *, .game-themed *::before, .game-themed *::after { transition: none !important; animation: none !important; } }
