/* Provider list followed by the search field at every viewport size. */
.lobby .game-search { position:static; inset:auto; width:100%; margin:0 0 16px; }
.lobby .catalog-toolbar { margin-bottom:10px; }
/* Customer support panel, inspired by the supplied artwork. */
#serviceDialog { width:min(calc(100% - 24px),730px); max-height:calc(100dvh - 28px); }
#serviceDialog .support-card { position:relative; overflow:hidden auto; display:grid; gap:12px; padding:20px; border:1px solid #8b663e; border-radius:19px; background:linear-gradient(90deg,#160f12ee 0%,#160e13eb 52%,#100b0c46 100%),url('/player/assets/support/support-ambience-v11.webp') center / cover no-repeat; color:#f9e9d0; box-shadow:0 20px 70px #000b; }
#serviceDialog .close { z-index:2; top:12px; right:12px; width:39px; height:39px; border:1px solid #d2ae75; background:#1a1015dc; color:#fff2d8; }
#serviceDialog .support-heading { display:flex; align-items:center; gap:12px; padding:2px 45px 13px 4px; border-bottom:1px solid #a66a533d; }
#serviceDialog .support-heading img { width:60px; height:60px; object-fit:contain; filter:drop-shadow(0 3px 6px #000); }
#serviceDialog .support-headset svg { width:34px; height:34px; fill:none; stroke:#f5d39f; stroke-width:2; stroke-linecap:round; stroke-linejoin:round; }
#serviceDialog .support-heading p { display:block; margin:0 0 5px; color:#d9ab70; letter-spacing:.19em; font-size:9px; font-weight:700; }
#serviceDialog .support-heading h2 { margin:0; color:#ffe4b8; font-size:27px; line-height:1.15; }
#serviceDialog .support-shop { position:relative; display:flex; align-items:center; gap:14px; width:67%; min-height:105px; padding:14px; border:1px solid #d6ad69; border-radius:13px; background:linear-gradient(115deg,#6b472dd9,#221719e8); box-shadow:inset 0 0 12px #eab96b30,0 0 14px #c8924855; }
#serviceDialog .support-shop:after { display:none; }
#serviceDialog .support-shop-icon { display:grid; flex:none; place-items:center; width:62px; height:62px; border:1px solid #a57949; border-radius:12px; background:#5d3f25; }
#serviceDialog .support-shop-icon svg { width:35px; height:35px; fill:none; stroke:#ffd798; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; }
#serviceDialog .support-shop small { color:#e9c68d; font-size:12px; }
#serviceDialog .support-shop h3 { margin:4px 0; color:#ffdda1; font-size:23px; line-height:1.25; }
#serviceDialog .support-shop p { color:#f1e1d3; font-size:11px; line-height:1.45; }
#serviceDialog .support-topics { display:grid; grid-template-columns:1fr 1fr; gap:10px; width:67%; }
#serviceDialog .support-topics article { position:relative; display:flex; flex-direction:column; align-items:center; min-width:0; min-height:190px; padding:13px 12px; text-align:center; border:1px solid #c23f50; border-radius:13px; background:linear-gradient(150deg,#471720e8,#210e14ea); box-shadow:inset 0 0 17px #b7283e40; }
#serviceDialog .support-topics article:nth-child(2) { border-color:#259bd8; background:linear-gradient(150deg,#102a40ec,#101b2aea); box-shadow:inset 0 0 17px #1778c13d; }
#serviceDialog .support-topics article>span { position:absolute; top:9px; left:9px; width:27px; height:27px; border:0; border-radius:50%; background:#742736; color:#ffe0dc; font-size:10px; }
#serviceDialog .support-topics article:nth-child(2)>span { background:#17446b; color:#b9e6ff; }
#serviceDialog .support-topics article>div { display:grid; justify-items:center; align-content:center; gap:8px; flex:1; }
#serviceDialog .support-topic-icon { width:48px; height:48px; fill:none; stroke:#ff7887; stroke-width:1.8; stroke-linecap:round; stroke-linejoin:round; filter:drop-shadow(0 0 7px #f34159); }
#serviceDialog .support-topics article:nth-child(2) .support-topic-icon { stroke:#4ec8ff; filter:drop-shadow(0 0 7px #168cfd); }
#serviceDialog .support-topics h3 { margin:0; color:#ffe4bb; font-size:16px; }
#serviceDialog .support-topics p { margin:0; color:#d2c8cd; font-size:12px; line-height:1.6; }
#serviceDialog .support-note { display:flex; justify-content:center; align-items:center; gap:8px; margin:0; padding:12px; border:1px solid #8b613f; border-radius:10px; background:#1a1114d9; color:#e7ba80; font-size:11px; text-align:center; }
#serviceDialog .support-note svg { width:15px; height:15px; fill:none; stroke:currentColor; stroke-width:2; }
@media(max-width:540px) { .lobby .game-search { margin-bottom:10px; } #serviceDialog { width:calc(100% - 24px); } #serviceDialog .support-card { gap:9px; padding:12px; background-position:60% center; } #serviceDialog .support-heading { gap:8px; padding:0 36px 8px 0; } #serviceDialog .support-heading img { width:40px; height:40px; } #serviceDialog .support-headset svg { width:24px; height:24px; } #serviceDialog .support-heading p { font-size:7px; margin-bottom:3px; } #serviceDialog .support-heading h2 { font-size:19px; } #serviceDialog .close { top:8px; right:8px; width:32px; height:32px; } #serviceDialog .support-shop { width:100%; min-height:72px; gap:10px; padding:9px; background:linear-gradient(100deg,#543622ed,#211419e8); } #serviceDialog .support-shop-icon { width:43px; height:43px; } #serviceDialog .support-shop-icon svg { width:26px; height:26px; } #serviceDialog .support-shop h3 { font-size:18px; margin:2px 0; } #serviceDialog .support-shop small,#serviceDialog .support-shop p { font-size:10px; } #serviceDialog .support-topics { width:100%; gap:8px; } #serviceDialog .support-topics article { min-height:140px; padding:9px; } #serviceDialog .support-topics article>span { width:22px; height:22px; top:6px; left:6px; font-size:9px; } #serviceDialog .support-topics article>div { gap:5px; } #serviceDialog .support-topic-icon { width:36px; height:36px; } #serviceDialog .support-topics h3 { font-size:13px; } #serviceDialog .support-topics p { font-size:10px; line-height:1.45; } #serviceDialog .support-note { padding:9px; font-size:10px; } }
@media(max-width:540px) {
  #serviceDialog .support-card { background:#180f14; }
  #serviceDialog .support-heading { min-height:76px; margin:-12px -12px 0; padding:9px 44px 9px 12px; background:linear-gradient(90deg,#160f12f5 0%,#160f12ea 45%,#160f1220 100%),url('/player/assets/support/support-ambience-v11.webp') 86% 35% / cover no-repeat; }
}