@import url('https://fonts.googleapis.com/css2?family=Baloo+2:wght@500;600;700;800&family=Quicksand:wght@500;600;700&display=swap');
/* ============================================================
   skin6 — "Golden Dragon" : 축제(Tết) 레드오렌지 + 황금, 밝고 둥근 앱 스타일
   중앙 좁은 컨테이너(1120px) + 원형 카테고리 아이콘 + 카드 스택 (skin6.boss88kr.com) 2026-09-12
   ============================================================ */
body.b88-skin6 {
  --b-bg0: #7a0a0a; --b-bg0-rgb: 122, 10, 10;
  --b-bg1: #b3121b; --b-bg1-rgb: 179, 18, 27;
  --b-deep: #8f0d12; --b-deep-rgb: 143, 13, 18;
  --b-sf: #c4141d; --b-sf-rgb: 196, 20, 29;
  --b-sf2: #e0262c; --b-sf2-rgb: 224, 38, 44;
  --b-gold0: #fff8dc; --b-gold1: #ffe27a; --b-gold1-rgb: 255, 226, 122;
  --b-gold2: #ffc400; --b-gold-rgb: 255, 196, 0; --b-gold3: #e08d00;
  --b-ongold: #5a1a00;
  --b-cy: #ffe27a; --b-cy-rgb: 255, 226, 122;
  --b-pk: #1f8a3c; --b-pk-rgb: 31, 138, 60; --b-pk2: #ff7a00;
  --b-tx: #fff8ee; --b-mu: #ffd9c2;
  --b-gold-grad: linear-gradient(180deg, #ffe27a 0%, #ffc400 50%, #f39a00 100%);
  --b-gold-text: linear-gradient(180deg, #fff4b0 0%, #ffc400 60%, #e08d00 100%);
  --b-body-bg:
    radial-gradient(900px 500px at 50% -10%, rgba(255, 196, 0, 0.35), transparent 60%),
    linear-gradient(180deg, #d4161f 0%, #a80f18 40%, #7a0a0a 100%);
  --b-font: "Quicksand", "Be Vietnam Pro", sans-serif;
}
body.b88-skin6 h1, body.b88-skin6 h2, body.b88-skin6 h3, body.b88-skin6 .s6-h { font-family: "Baloo 2", "Quicksand", sans-serif !important; }
body.b88-skin6::before { background: radial-gradient(500px 300px at 20% 30%, rgba(255, 196, 0, 0.12), transparent 60%), radial-gradient(500px 300px at 80% 70%, rgba(255, 122, 0, 0.14), transparent 60%); }
/* 황금 동전 도트 패턴 */
body.b88-skin6::after { content: ""; position: fixed; inset: 0; z-index: -1; pointer-events: none; opacity: 0.25;
  background-image: radial-gradient(circle, rgba(255, 226, 122, 0.55) 0 2px, transparent 3px), radial-gradient(circle, rgba(255, 226, 122, 0.35) 0 1.5px, transparent 2.5px);
  background-size: 64px 64px, 40px 40px; background-position: 0 0, 20px 20px; }

/* ---------- 헤더: 골드 바 + 빨강 ---------- */
body.b88-skin6 section.fixed.top-0 { background: linear-gradient(180deg, #a80f18, #8f0d12) !important; box-shadow: 0 3px 0 var(--b-gold2), 0 8px 24px rgba(0, 0, 0, 0.35); }
body.b88-skin6 section.fixed.top-0 > div:first-child { border-color: rgba(var(--b-gold-rgb), 0.35) !important; }
body.b88-skin6 section.fixed.top-0 > div.hide-scrollbar { justify-content: center; gap: 4px; }
body.b88-skin6 section.fixed.top-0 > div.hide-scrollbar > a { border-radius: 999px; padding: 7px 14px !important; border: 0; }
body.b88-skin6 section.fixed.top-0 > div.hide-scrollbar > a p { font-family: "Baloo 2", sans-serif !important; text-transform: none !important; font-size: 14px !important; font-weight: 700 !important; letter-spacing: 0; }
body.b88-skin6 section.fixed.top-0 > div.hide-scrollbar > a img { filter: drop-shadow(0 0 6px rgba(var(--b-gold-rgb), 0.8)); }
body.b88-skin6 section.fixed.top-0 > div.hide-scrollbar > a:hover, body.b88-skin6 section.fixed.top-0 > div.hide-scrollbar > a.b88-nav-active { background: var(--b-gold-grad); box-shadow: 0 4px 12px rgba(0, 0, 0, 0.25); }
body.b88-skin6 section.fixed.top-0 > div.hide-scrollbar > a:hover p, body.b88-skin6 section.fixed.top-0 > div.hide-scrollbar > a.b88-nav-active p { color: var(--b-ongold) !important; }
body.b88-skin6 section.fixed.top-0 > div.hide-scrollbar > a:hover img, body.b88-skin6 section.fixed.top-0 > div.hide-scrollbar > a.b88-nav-active img { filter: brightness(0) opacity(0.8); }
body.b88-skin6 #open-login-btn { border-color: var(--b-gold1) !important; color: var(--b-gold1) !important; border-radius: 999px !important; }
body.b88-skin6 #open-register-btn { border-radius: 999px !important; animation: none; box-shadow: 0 4px 0 #b86f00, 0 8px 18px rgba(0, 0, 0, 0.3); }
body.b88-skin6 .b88-btn-gold { box-shadow: 0 4px 0 #b86f00, 0 8px 18px rgba(0, 0, 0, 0.25); }
body.b88-skin6 .b88-btn-gold::after { display: none; }
body.b88-skin6 .b88-btn-gold:hover { transform: translateY(-1px); box-shadow: 0 5px 0 #b86f00, 0 12px 22px rgba(0, 0, 0, 0.3); }
body.b88-skin6 .b88-btn-outline { border-color: var(--b-gold1); color: var(--b-gold1); }
body.b88-skin6 .b88-mini-btn { box-shadow: 0 3px 0 #b86f00; }
/* 모바일 하단바: 황금 테두리 라운드 */
body.b88-skin6 div.fixed.bottom-0.grid { left: 0 !important; right: 0 !important; bottom: 0 !important; border-radius: 20px 20px 0 0; background: linear-gradient(180deg, #a80f18, #7a0a0a) !important; box-shadow: 0 -3px 0 var(--b-gold2), 0 -8px 26px rgba(0, 0, 0, 0.4); }
body.b88-skin6 div.fixed.bottom-0.grid .rounded-full { box-shadow: 0 0 0 4px #8f0d12, 0 4px 0 #b86f00, 0 0 20px rgba(var(--b-gold-rgb), 0.7); animation: none; }
/* 공통 컴포넌트 라운드 강화 */
body.b88-skin6 .b88-card { border-radius: 22px; background: rgba(120, 10, 12, 0.6); border-color: rgba(var(--b-gold-rgb), 0.5); }
body.b88-skin6 .b88-tile { border-radius: 18px; background: rgba(120, 10, 12, 0.6); border: 1px solid rgba(var(--b-gold-rgb), 0.35); }
body.b88-skin6 .b88-tile img { filter: drop-shadow(0 0 8px rgba(var(--b-gold-rgb), 0.9)); }
body.b88-skin6 .b88-tile.hot { background: var(--b-gold-grad); color: var(--b-ongold); border-color: transparent; }
body.b88-skin6 .b88-tile.hot img { filter: brightness(0) opacity(0.85); }
body.b88-skin6 .b88-marquee { border-radius: 999px; background: rgba(90, 5, 8, 0.6); border-color: rgba(var(--b-gold-rgb), 0.5); }
body.b88-skin6 .b88-marquee .b88-live { background: var(--b-gold-grad); color: var(--b-ongold); box-shadow: none; }
body.b88-skin6 .marquee p { color: var(--b-gold1) !important; }
body.b88-skin6 img[src="icons/speaker.svg"] { filter: drop-shadow(0 0 6px rgba(var(--b-gold-rgb), 0.9)); }
body.b88-skin6 .b88-frame { background: var(--b-gold-grad); padding: 4px; border-radius: 26px; box-shadow: 0 10px 0 #7a0a0a, 0 20px 40px rgba(0, 0, 0, 0.35); }
body.b88-skin6 .b88-frame > * { border-radius: 22px; }
body.b88-skin6 .w-fit.mx-auto.relative > .absolute { background: var(--b-gold-grad); box-shadow: 0 4px 0 #b86f00; border-radius: 999px; padding: 8px 30px; }
body.b88-skin6 .w-fit.mx-auto.relative > .absolute p, body.b88-skin6 .flex.justify-center.items-center.space-x-1 > p { background: none; color: var(--b-ongold) !important; -webkit-text-fill-color: var(--b-ongold); text-transform: none; font-family: "Baloo 2", sans-serif !important; }
body.b88-skin6 .w-fit.mx-auto.relative > .absolute img { filter: brightness(0) opacity(0.8); }
body.b88-skin6 section .group.cursor-pointer.overflow-hidden { border-radius: 22px !important; box-shadow: 0 0 0 3px rgba(var(--b-gold-rgb), 0.7), 0 10px 24px rgba(0, 0, 0, 0.35); }
body.b88-skin6 .bg-\[\#171717\], body.b88-skin6 .bg-\[\#181818\], body.b88-skin6 .bg-\[\#1A1810\], body.b88-skin6 .bg-\[\#1a1810\], body.b88-skin6 .bg-\[\#131210\] { background: rgba(90, 5, 8, 0.7) !important; }
body.b88-skin6 .relative.flex-1.overflow-hidden > div.absolute { background: linear-gradient(90deg, #8f0d12, transparent) !important; }
body.b88-skin6 .relative.flex-1.overflow-hidden > div.absolute:last-of-type { background: linear-gradient(270deg, #8f0d12, transparent) !important; }
body.b88-skin6 img[src^="images/partner-"] { filter: brightness(0) invert(1); opacity: 0.55; }
body.b88-skin6 #loginModal .bg-white { background: linear-gradient(180deg, #b3121b, #7a0a0a) !important; }
body.b88-skin6 #loginModal > div { border-radius: 26px !important; box-shadow: 0 0 0 4px var(--b-gold2), 0 30px 80px rgba(0, 0, 0, 0.6); }
body.b88-skin6 #loginModal input, body.b88-skin6 #loginModal select { border-radius: 999px !important; background: rgba(0, 0, 0, 0.25) !important; }
body.b88-skin6 #login-btn, body.b88-skin6 #register-btn { color: var(--b-ongold) !important; box-shadow: 0 4px 0 #b86f00; }

/* ---------- skin6 홈 컴포넌트 ---------- */
body.b88-skin6 .s6-wrap { width: 100%; max-width: 1120px; margin: 116px auto 0; padding: 0 12px; }
@media (min-width: 640px) { body.b88-skin6 .s6-wrap { padding: 0 24px; } }
/* 원형 카테고리 */
body.b88-skin6 .s6-cats { display: flex; gap: 6px; overflow-x: auto; padding: 8px 2px 14px; justify-content: flex-start; }
@media (min-width: 768px) { body.b88-skin6 .s6-cats { justify-content: center; gap: 14px; } }
body.b88-skin6 .s6-cat { flex: none; width: 74px; display: flex; flex-direction: column; align-items: center; gap: 6px; text-align: center; transition: 0.25s; }
body.b88-skin6 .s6-cat .ring { width: 58px; height: 58px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: radial-gradient(circle at 30% 25%, #ffe27a, #ffc400 45%, #e08d00 100%); box-shadow: 0 5px 0 #b86f00, 0 10px 20px rgba(0, 0, 0, 0.35), inset 0 -4px 8px rgba(0, 0, 0, 0.15); transition: 0.25s; }
body.b88-skin6 .s6-cat .ring img { width: 28px; height: 28px; filter: brightness(0) opacity(0.85); }
body.b88-skin6 .s6-cat span { font-family: "Baloo 2", sans-serif !important; font-size: 12px; font-weight: 700; color: #fff; line-height: 1.1; }
body.b88-skin6 .s6-cat:hover .ring { transform: translateY(-4px) scale(1.06); box-shadow: 0 8px 0 #b86f00, 0 16px 26px rgba(0, 0, 0, 0.4); }
@media (min-width: 768px) { body.b88-skin6 .s6-cat { width: 96px; } body.b88-skin6 .s6-cat .ring { width: 72px; height: 72px; } body.b88-skin6 .s6-cat .ring img { width: 34px; height: 34px; } body.b88-skin6 .s6-cat span { font-size: 14px; } }
/* 섹션 리본 타이틀 */
body.b88-skin6 .s6-ribbon { display: flex; align-items: center; justify-content: center; margin: 32px 0 16px; position: relative; }
body.b88-skin6 .s6-ribbon::before { content: ""; position: absolute; left: 0; right: 0; top: 50%; height: 2px; background: linear-gradient(90deg, transparent, rgba(var(--b-gold-rgb), 0.7), transparent); }
body.b88-skin6 .s6-ribbon h2 { position: relative; padding: 8px 34px; border-radius: 999px; background: var(--b-gold-grad); color: var(--b-ongold); font-size: 20px; font-weight: 800; box-shadow: 0 5px 0 #b86f00, 0 10px 20px rgba(0, 0, 0, 0.3); display: flex; align-items: center; gap: 8px; }
body.b88-skin6 .s6-ribbon h2 img { width: 24px; height: 24px; filter: brightness(0) opacity(0.8); }
@media (min-width: 640px) { body.b88-skin6 .s6-ribbon h2 { font-size: 26px; padding: 10px 44px; } }
/* 카지노: 큰 둥근 타일 2열 */
body.b88-skin6 .s6-big { position: relative; border-radius: 24px; overflow: hidden; cursor: pointer; display: grid; grid-template-columns: 1fr 46%; align-items: center; min-height: 160px;
  background: linear-gradient(135deg, #e0262c, #8f0d12); border: 3px solid rgba(var(--b-gold-rgb), 0.85); box-shadow: 0 8px 0 #5a0608, 0 16px 30px rgba(0, 0, 0, 0.35); transition: 0.3s; }
body.b88-skin6 .s6-big:hover { transform: translateY(-4px); box-shadow: 0 12px 0 #5a0608, 0 24px 40px rgba(0, 0, 0, 0.4); }
body.b88-skin6 .s6-big .txt { padding: 18px 12px 18px 20px; }
body.b88-skin6 .s6-big .txt small { display: inline-block; font-size: 10px; font-weight: 800; letter-spacing: 0.1em; padding: 3px 9px; border-radius: 999px; background: #1f8a3c; color: #fff; margin-bottom: 8px; }
body.b88-skin6 .s6-big .txt small.vip { background: #6a1b9a; }
body.b88-skin6 .s6-big .txt small.new { background: #1565c0; }
body.b88-skin6 .s6-big .txt h3 { font-size: 20px; font-weight: 800; color: #fff; line-height: 1.1; }
body.b88-skin6 .s6-big .txt p { font-size: 11px; color: var(--b-mu); margin: 6px 0 12px; }
body.b88-skin6 .s6-big .pic { position: relative; height: 100%; min-height: 160px; overflow: hidden; }
body.b88-skin6 .s6-big .pic .bg { position: absolute; inset: 0; width: 100%; height: 100%; object-fit: cover; object-position: left top; opacity: 0.55; transform: scale(1.2); }
body.b88-skin6 .s6-big .pic .girl { position: absolute; bottom: 0; right: 0; height: 100%; width: auto; object-fit: contain; object-position: bottom right; transition: 0.4s; filter: drop-shadow(0 8px 16px rgba(0, 0, 0, 0.5)); }
body.b88-skin6 .s6-big:hover .pic .girl { transform: scale(1.06); }
@media (min-width: 640px) { body.b88-skin6 .s6-big { min-height: 200px; } body.b88-skin6 .s6-big .pic { min-height: 200px; } body.b88-skin6 .s6-big .txt h3 { font-size: 24px; } body.b88-skin6 .s6-big .txt p { font-size: 12px; } }
/* 스포츠: 한 장의 와이드 배너 */
body.b88-skin6 .s6-sportbar { border-radius: 26px; overflow: hidden; border: 3px solid rgba(var(--b-gold-rgb), 0.85); box-shadow: 0 8px 0 #5a0608, 0 16px 30px rgba(0, 0, 0, 0.35); background: linear-gradient(90deg, #1f8a3c 0%, #0f5c27 100%); display: grid; grid-template-columns: 1fr; }
@media (min-width: 768px) { body.b88-skin6 .s6-sportbar { grid-template-columns: 1fr 1fr; } }
body.b88-skin6 .s6-sportbar > div { display: grid; grid-template-columns: 1fr 42%; align-items: center; min-height: 180px; cursor: pointer; transition: 0.3s; }
body.b88-skin6 .s6-sportbar > div:first-child { border-bottom: 2px dashed rgba(255, 255, 255, 0.25); }
@media (min-width: 768px) { body.b88-skin6 .s6-sportbar > div:first-child { border-bottom: 0; border-right: 2px dashed rgba(255, 255, 255, 0.25); } }
body.b88-skin6 .s6-sportbar > div:hover { background: rgba(255, 255, 255, 0.08); }
body.b88-skin6 .s6-sportbar .info { padding: 20px; }
body.b88-skin6 .s6-sportbar .info img { height: 28px; width: auto; margin-bottom: 8px; }
body.b88-skin6 .s6-sportbar .info h3 { font-size: 22px; font-weight: 800; color: #fff; }
body.b88-skin6 .s6-sportbar .info p { font-size: 12px; color: rgba(255, 255, 255, 0.8); margin: 6px 0 12px; }
body.b88-skin6 .s6-sportbar .player { position: relative; height: 100%; min-height: 180px; }
body.b88-skin6 .s6-sportbar .player img { position: absolute; bottom: -2px; right: 4px; height: 104%; width: auto; object-fit: contain; object-position: bottom; }
/* 게임: 둥근 앱 아이콘 스타일 4열 */
body.b88-skin6 .s6-game { cursor: pointer; text-align: center; }
body.b88-skin6 .s6-game .img { position: relative; border-radius: 22px; overflow: hidden; aspect-ratio: 1 / 1; border: 3px solid rgba(var(--b-gold-rgb), 0.8); box-shadow: 0 6px 0 #5a0608, 0 12px 22px rgba(0, 0, 0, 0.35); transition: 0.3s; }
body.b88-skin6 .s6-game .img img { width: 100%; height: 100%; object-fit: cover; }
body.b88-skin6 .s6-game:hover .img { transform: translateY(-4px) scale(1.03); }
body.b88-skin6 .s6-game .img .hot { position: absolute; top: -2px; right: -2px; font-size: 10px; font-weight: 900; padding: 4px 10px; border-radius: 0 14px 0 14px; background: #1f8a3c; color: #fff; }
body.b88-skin6 .s6-game p { margin-top: 8px; font-family: "Baloo 2", sans-serif !important; font-size: 12px; font-weight: 700; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
/* 랭킹 보드 + 프로모 */
body.b88-skin6 .s6-board { border-radius: 24px; background: rgba(90, 5, 8, 0.55); border: 3px solid rgba(var(--b-gold-rgb), 0.6); padding: 16px; box-shadow: 0 8px 0 #5a0608; }
body.b88-skin6 .s6-board h3 { font-size: 18px; font-weight: 800; color: var(--b-gold1); margin-bottom: 10px; display: flex; align-items: center; gap: 8px; }
body.b88-skin6 .s6-board .row { display: flex; align-items: center; gap: 10px; padding: 8px 0; border-bottom: 1px dashed rgba(255, 255, 255, 0.15); cursor: pointer; }
body.b88-skin6 .s6-board .row:last-child { border-bottom: 0; }
body.b88-skin6 .s6-board .row .n { width: 26px; height: 26px; border-radius: 50%; display: flex; align-items: center; justify-content: center; font-family: "Baloo 2", sans-serif !important; font-weight: 800; font-size: 13px; background: var(--b-gold-grad); color: var(--b-ongold); box-shadow: 0 2px 0 #b86f00; }
body.b88-skin6 .s6-board .row img { width: 36px; height: 36px; border-radius: 10px; object-fit: cover; }
body.b88-skin6 .s6-board .row b { display: block; font-size: 13px; color: #fff; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
body.b88-skin6 .s6-board .row small { font-size: 10px; color: var(--b-mu); }
body.b88-skin6 .s6-promo { border-radius: 24px; padding: 18px; background: linear-gradient(135deg, #ffe27a, #ffc400 60%, #f39a00); color: var(--b-ongold); box-shadow: 0 8px 0 #b86f00, 0 16px 30px rgba(0, 0, 0, 0.3); position: relative; overflow: hidden; }
body.b88-skin6 .s6-promo::after { content: ""; position: absolute; right: -40px; bottom: -40px; width: 160px; height: 160px; border-radius: 50%; background: rgba(255, 255, 255, 0.25); }
body.b88-skin6 .s6-promo h4 { font-size: 20px; font-weight: 800; }
body.b88-skin6 .s6-promo p { font-size: 12px; opacity: 0.85; margin: 6px 0 12px; }
body.b88-skin6 .s6-promo .btn { display: inline-block; padding: 9px 18px; border-radius: 999px; background: #8f0d12; color: #ffe27a; font-weight: 800; font-size: 13px; box-shadow: 0 4px 0 #5a0608; }
/* 푸터 */
body.b88-skin6 .b88-footer { background: #5a0608; border-top: 4px solid var(--b-gold2); }
body.b88-skin6 .b88-footer h5 { color: var(--b-gold1); }
body.b88-skin6 .b88-footer p, body.b88-skin6 .b88-footer a { color: var(--b-mu); }
body.b88-skin6 .b88-footer .badges span { border-color: rgba(var(--b-gold-rgb), 0.6); color: var(--b-gold1); }
