/* RS visual edition: generated WebP artwork, graphite, ruby and champagne. */
:root {
  color-scheme: dark;
  color: #f4eee5;
  background: #0b0b0e;
  --paper: #111114;
  --surface: #1b1a20;
  --ink: #f4eee5;
  --muted: #a8a1aa;
  --line: #302d34;
  --brand: #e3bf84;
  --brand-hover: #f3d8ab;
  --brand-soft: #332a23;
  --gold: #d3ac71;
  --positive: #67d3a3;
}
body { background: #0b0b0e; }
.app-shell { background: var(--paper); }
.site-header { min-height: 76px; }
.brand-mark { background: transparent; border-radius: 0; }
.brand-label { color: #a99d9d; letter-spacing: .08em; }
.header-account { background: #30231f; color: #eed1a0; border: 1px solid #5a3e2c; }
.language-button { border-color: #343037; background: #1a191e; color: #ddd3d3; }
.hero { aspect-ratio: 2.5; border: 1px solid #6b4a2f70; border-radius: 20px; background: #18100e; }
.hero-art { object-position: center; }
.hero:after { background: linear-gradient(90deg,#140f1229,transparent 70%); }
.hero-copy { left: 30px; }
.hero-copy small { color: #b99a73; font-size: 9px; letter-spacing: .17em; }
.hero-copy h1 { font-size: 32px; letter-spacing: .035em; font-weight: 650; }
.hero-copy h1 span:last-child { color: #f2d3a0; }
.hero-copy p { color: #c0afac; }
.announcement { color: #a89b9f; min-height: 38px; margin: 5px 0 12px; padding: 3px 0; }
.announcement-label { color: #d6b484; font-size: 11px; }
.announcement button { color: #ad989b; }
.member-strip { background: linear-gradient(110deg,#2b2423,#1d1b20 70%); border: 1px solid #5c443352; box-shadow: inset 0 1px #c4a4770d; padding: 18px 22px; }
.member-identity img { filter: drop-shadow(0 3px 5px #0004); }
.member-identity small,.wallet>span { color: #b6a6a5; }
.member-identity b { color: #eee4db; }
.wallet { border-color: #66503e55; }
.wallet b { color: #f0d199; font-size: 29px; }
.member-entry { background: #ffffff05; color: #d4b899; }
.lobby-heading h2 { font-weight: 650; font-size: 21px; }
.lobby-heading p { color: #8f858f; }
.catalog-label { color: #927956; font-size: 9px; }
.type-tabs { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; min-height: 66px; border: 0; margin-bottom: 16px; }
.type-tabs button { display: flex; gap: 9px; align-items: center; justify-content: center; min-height: 66px; padding: 8px 12px; border: 1px solid #302a31; border-radius: 13px; background: linear-gradient(125deg,#232026,#1a181e); color: #c1b5bd; font-size: 14px; }
.type-tabs button.active { color: #ffdbaf; border-color: #b36a48; background: linear-gradient(120deg,#5d252c,#342026); box-shadow: inset 0 1px #f5b27320; }
.type-tabs button.active:after { display: none; }
.category-picture { width: 39px; height: 39px; flex: none; object-fit: contain; filter: drop-shadow(0 3px 4px #0005); }
.provider-tabs { scrollbar-color: #4d3a3e transparent; }
.provider-tabs button { border-color: #302b32; background: #1d1a20; color: #b6a7b1; }
.provider-tabs button.active { border-color: #9f794d; background: #31271f; color: #f4d498; }
.provider-tabs button.provider-icon { border-radius: 11px; }
.provider-icon img { background: #19151d; }
.catalog-toolbar>button { border-color: #342c34; background: #211b22; color: #c9b9bd; }
.game-search { background: #1c191f; border-color: #342d35; border-radius: 12px; }
.game-search input { background: transparent; color: #f4ece7; }
.game-search input::placeholder { color: #9d8d98; }
.game-search svg { color: #b39aa7; }
.game-search:focus-within { border-color: #b48c5e; box-shadow: 0 0 0 3px #cda66d0b; }
.game-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 20px 16px; }
.game-card { overflow: visible; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.game-card:hover { border: 0; box-shadow: none; }
.game-art { border: 1px solid #ffffff16; border-radius: 15px; background: #26212a; box-shadow: 0 4px 14px #0003; }
.game-card:hover .game-art { border-color: #b8885e; }
.game-meta { gap: 5px; padding: 10px 2px 0; background: transparent; }
.game-meta b { min-height: 2.8em; color: #eee5e3; font-size: 14px; font-weight: 500; line-height: 1.4; }
.game-meta small { color: #97828e; font-size: 9px; }
.empty-state { color: #b9a6b2; border-color: #54404b; }
.bottom-nav { min-height: calc(74px + env(safe-area-inset-bottom)); padding-top: 7px; border-color: #443039; background: #1b171cf5; box-shadow: 0 -10px 30px #09080a66; }
.bottom-nav button { color: #ab98a5; }
.bottom-nav button.active { color: #f1c88a; }
.bottom-nav button.active svg { background: #543326; box-shadow: 0 0 0 7px #543326; }
.bottom-nav button:hover { background: #ffffff04; }
.lobby-footnote { color: #87727d; border-color: #33282f; }
.login-dialog,.language-dialog { border: 1px solid #72533c70; background: #211b20; box-shadow: 0 24px 100px #0009; }
.login-dialog::backdrop,.language-dialog::backdrop { background: #070509bc; backdrop-filter: blur(7px); }
.dialog-card,.language-glass { background: linear-gradient(145deg,#2c2226 0,#201b21 42%,#1c191e); color: #eee4df; }
.dialog-card h2 { color: #f4e9df; }
.dialog-card>p:first-of-type,.panel-heading p,.panel-hero p { color: #c6a070; }
.dialog-card label { color: #c7b6bf; font-weight: 400; }
.dialog-card input { border-color: #4b3945; background: #17141b; color: #f5edeb; }
.dialog-card input:focus { border-color: #bf945f; box-shadow: 0 0 0 3px #c89e6712; }
.dialog-card .close,.language-close { border-color: #54404b; background: #352831; color: #d8c5ce; border-radius: 50%; }
.close:hover,.language-close:hover { background: #50313a; color: #ffe0ad; border-color: #9b6d4c; }
.close:focus-visible,.language-close:focus-visible { outline-color: #cba46b; }
.login-mascot { position: absolute; right: 68px; top: 20px; width: 86px; height: 86px; pointer-events: none; object-fit: contain; }
#loginForm>h2 { padding-right: 100px; }
#loginForm .help-text { padding-top: 8px; }
.help-text,.login-footnote { color: #b7a3af; }
.password-toggle { color: #b29aa9; }
.primary { background: linear-gradient(105deg,#bd3a48,#9a263c); border: 1px solid #d26560; box-shadow: inset 0 1px #ffc29b18; color: #fff3e5; }
.primary:hover:not(:disabled) { background: #bc3c50; }
.outline { color: #d4bcbf; border-color: #60444e; background: #291f28; }
.outline:hover:not(:disabled) { background: #3a2933; border-color: #9e6d66; }
.panel-symbol { color: #e4bc83; background: #4b2e2d; }
.history-period { background: #161318; padding: 4px; border: 1px solid #48323d; }
.history-period button { color: #af98a7; }
.history-period button.active { color: #f4d39b; background: #493039; box-shadow: 0 1px 4px #0004; }
.history-toolbar,.history-caption,.points-pagination>span { color: #a38b9c; }
.records-list,.profile-scroll,.player-points { scrollbar-color: #795264 transparent; }
.record-game { color: #f0e5e1; }
.record-kind { color: #aa91a1; }
.record-kind>span:first-child { color: #d1a5b7; background: #3d2935; }
.records-list small { color: #ae95a4; }
.record-detail summary { color: #d4b386; }
.record-detail p { color: #bfa5b5; background: #17131a; }
.positive { color: #67d3a3; }
.negative { color: #f48c9d; }
.neutral { color: #b4a0ad; }
.history-empty { color: #ae94a3; }
.history-empty>span { color: #c1a47f; background: #34252e; }
.history-empty b { color: #ddc6d0; }
.history-empty small { color: #ae94a3; }
.support-shop { position: relative; overflow: hidden; padding-right: 115px; border-color: #79513a88; background: linear-gradient(110deg,#4d2d2d,#2b2029); }
.support-shop:after { position: absolute; bottom: 0; right: 4px; width: 112px; height: 126px; content: ''; background: url('/player/assets/game-carousel/player-avatar.webp') center bottom/contain no-repeat; pointer-events: none; }
.support-shop small { color: #d7b288; }
.support-shop h3 { color: #ffe3b0; }
.support-shop p { color: #cbb0b6; }
.support-topics article>span { color: #dfb881; background: #3a292d; }
.support-topics p { color: #bca2b0; }
.support-note { color: #b89d9f; }
.profile-wallet { position: relative; overflow: hidden; border: 1px solid #8e634355; background: linear-gradient(90deg,#3b2529f5,#3b2529d9),url('/player/assets/game-carousel/seth.webp') right center/cover; color: #ffe1a7; }
.profile-wallet>span { color: #d9b594; }
.profile-wallet strong { color: #ffe2ae; }
.profile-wallet button { color: #f7d3a5; border-color: #c89e6755; background: #5c39303d; }
.member-details dt { color: #b498aa; }
.machine-code-card { border-color: #4e3742; background: #201820; }
.machine-code-card p,.member-section-heading p,.member-section-heading small { color: #b29aac; }
.panel-footer button { color: #e5bc8e; }
.player-points b { color: #e7d7de; }
.player-points small { color: #b29aac; }
.first-password-symbol { color: #e3b47f; background: #4b3032; }
.language-option { background: #251b25; color: #e1cdd8; border-color: #513643; }
.language-option[aria-checked=true] { background: #4a2c34; border-color: #be865e; }
#confirmLanguage { color: #fff0dc; background: #a63547; }
.form-error { color: #ff9aaf; }
.toast { background: #35212ef5; color: #ffe9dd; border-color: #a0735755; }
.preview-switcher { color: #b998aa; background: #251a25; }
.preview-switcher a { color: #e6bb8b; }
@media(min-width:901px) {
  .hero { min-height: 218px; aspect-ratio: 2.65; }
  .hero-copy h1 { font-size: 31px; }
  .member-strip { padding: 22px; }
  .type-tabs { padding-right: 356px; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
  .type-tabs button { padding: 7px 10px; }
  .category-picture { width: 32px; height: 32px; }
  .game-search { top: 63px; }
}
@media(max-width:900px) {
  .hero { aspect-ratio: 2.7; }
  .game-grid { grid-template-columns: repeat(3,minmax(0,1fr)); }
}
@media(max-width:540px) {
  body { background: #111114; }
  .preview-switcher { display: none; }
  .app-shell { padding-left: 16px; padding-right: 16px; }
  .site-header { min-height: 61px; }
  .brand-mark { width: 76px; height: 36px; }
  .header-account { padding: 7px 9px; font-size: 11px; }
  .hero { aspect-ratio: 2.65; border-radius: 16px; }
  .hero-art { object-position: center; }
  .hero-copy { left: 18px; max-width: 54%; }
  .hero-copy small { font-size: 7px; letter-spacing: .12em; }
  .hero-copy h1 { font-size: 23px; line-height: 1.4; margin-top: 8px; }
  .announcement { min-height: 30px; padding: 0; margin: 5px 0 8px; }
  .announcement button { height: 30px; }
  .member-strip { min-height: 72px; padding: 11px 12px; margin-bottom: 16px; gap: 7px; border-radius: 13px; }
  .member-identity img { width: 34px; height: 38px; }
  .member-identity small,.wallet>span { font-size: 9px; margin-bottom: 5px; }
  .member-identity b { font-size: 12px; }
  .wallet { padding-left: 10px; }
  .wallet b { font-size: 20px; }
  .member-entry { width: 20px; }
  .lobby-heading { margin-bottom: 8px; }
  .lobby-heading h2 { font-size: 18px; margin-bottom: 0; }
  .catalog-label { font-size: 8px; }
  .type-tabs { gap: 8px; min-height: 50px; margin-bottom: 10px; }
  .type-tabs button { min-height: 50px; gap: 5px; padding: 6px; border-radius: 12px; font-size: 12px; }
  .category-picture { width: 31px; height: 31px; }
  .provider-tabs { gap: 6px; padding-top: 1px; padding-bottom: 5px; }
  .provider-tabs button.provider-icon { min-width: 72px; flex-basis: 72px; width: 72px; min-height: 42px; height: 42px; padding: 5px; }
  .provider-label { font-size: 9px; }
  .provider-icon img { width: 29px; height: 25px; }
  .catalog-toolbar { gap: 8px; margin-bottom: 10px; }
  .game-search { margin-bottom: 12px; }
  .game-search input { min-height: 44px; font-size: 13px; }
  .game-grid { grid-template-columns: repeat(3,minmax(0,1fr)); gap: 16px 10px; }
  .game-art { border-radius: 12px; }
  .game-meta { padding: 8px 1px 0; gap: 4px; }
  .game-meta b { min-height: 2.8em; font-size: 11px; line-height: 1.4; }
  .game-meta small { font-size: 8px; letter-spacing: .05em; }
  .bottom-nav { min-height: calc(67px + env(safe-area-inset-bottom)); padding-bottom: calc(5px + env(safe-area-inset-bottom)); }
  .bottom-nav button { min-height: 51px; font-size: 10px; }
  .bottom-nav svg { width: 21px; height: 21px; }
  .dialog-card { padding-top: 30px; }
  .login-mascot { width: 78px; height: 78px; top: 16px; right: 62px; }
  #loginForm>h2 { padding-right: 90px; }
  .support-shop { padding-right: 100px; }
  .support-shop:after { width: 98px; height: 116px; right: 0; }
  .support-shop h3 { font-size: 21px; }
  .panel-hero img { width: 48px; height: 48px; }
  .profile-wallet strong { font-size: 28px; }
}
@media(max-width:360px) {
  .hero-copy h1 { font-size: 20px; }
  .type-tabs button { gap: 3px; font-size: 11px; }
  .category-picture { width: 27px; height: 27px; }
  .game-grid { gap: 14px 8px; }
  .game-meta b { font-size: 10px; }
  .wallet b { font-size: 17px; }
}
