/* ===== Base / Reset ===== */
* { box-sizing: border-box; margin: 0; padding: 0; }
html { -webkit-text-size-adjust: 100%; }
body {
  font-family: "Arial Black", Impact, sans-serif;
  background-color: #001718;
  background-image:
    radial-gradient(circle at 20% 0%, rgba(255,43,187,.12), transparent 45%),
    radial-gradient(circle at 85% 15%, rgba(0,128,255,.10), transparent 45%),
    repeating-linear-gradient(0deg, rgba(0,128,255,.05) 0px, rgba(0,128,255,.05) 1px, transparent 1px, transparent 24px),
    repeating-linear-gradient(90deg, rgba(255,43,187,.04) 0px, rgba(255,43,187,.04) 1px, transparent 1px, transparent 24px);
  background-attachment: fixed;
  color: #e6fffc;
  line-height: 1.4;
  padding-bottom: 24px;
  overflow-x: hidden;
}
[v-cloak] { display: none; }
a { color: inherit; text-decoration: none; display: block; }
button { font: inherit; color: inherit; background: none; border: none; cursor: pointer; }
img { display: block; width: 100%; height: 100%; object-fit: cover; }
::-webkit-scrollbar { display: none; }
/* ===== Top Bar ===== */
.topbar {
  position: static; top: 0; z-index: 40;
  display: flex; align-items: center; justify-content: space-between;
  padding: 12px 16px;
  background: #002022; border-bottom: 1px solid #0a484a;
  box-shadow: 0 1px 12px rgba(255,43,187,.15);
}
.topbar-logo { font-size: 18px; font-weight: 700; letter-spacing: .03em; text-shadow: 0 0 10px rgba(0,128,255,.6); }
.topbar-search-btn {
  width: 36px; height: 36px; border-radius: 50%;
  display: flex; align-items: center; justify-content: center;
  background: #083838; color: #0080ff;
  border: 1px solid rgba(0,128,255,.4);
  box-shadow: 0 0 10px rgba(0,128,255,.3);
}
/* ===== Category Tabs ===== */
.cat-tabs {
  position: static; top: 60px; z-index: 30;
  background: #001718; border-bottom: 1px solid #0a484a;
  overflow-x: auto; white-space: nowrap;
}
.cat-tabs-inner { display: inline-flex; gap: 8px; padding: 10px 16px; }
.cat-tab {
  flex-shrink: 0; padding: 7px 14px; border-radius: 20px;
  background: #073030; color: #90d8d4; font-size: 13px; font-weight: 600;
  border: 1px solid rgba(255,43,187,.25);
}
.cat-tab.active {
  background: linear-gradient(135deg, #ff2bbb, #2be2be);
  color: #fff;
  box-shadow: 0 0 14px rgba(255,43,187,.6);
  border-color: transparent;
}
/* ===== Search ===== */
.search-bar-wrap {
  position: static; top: 60px; z-index: 30;
  display: flex; gap: 8px; padding: 10px 16px;
  background: #001718; border-bottom: 1px solid #0a484a;
}
.search-input {
  flex: 1; padding: 9px 14px; border-radius: 10px; border: 1px solid rgba(0,128,255,.3);
  background: #001f20; color: #e6fffc; font-size: 14px;
}
.search-cancel { font-size: 14px; color: #0080ff; font-weight: 600; padding: 0 4px; text-shadow: 0 0 8px rgba(0,128,255,.6); }
/* ===== Loading ===== */
.loading-full { display: flex; align-items: center; justify-content: center; padding: 80px 0; }
.loading-ring {
  width: 36px; height: 36px; border-radius: 50%;
  border: 3px solid #0a484a; border-top-color: #ff2bbb;
  box-shadow: 0 0 12px rgba(255,43,187,.5);
  animation: spin 0.8s linear infinite;
}
@keyframes spin { to { transform: rotate(360deg); } }
/* ===== Section spacing ===== */
section[class$="-sec"] { margin-bottom: 32px; }
/* ===== Section Header ===== */
.sec-hd { display: flex; align-items: center; justify-content: space-between; padding: 18px 16px 10px; }
.sec-label { font-size: 16px; font-weight: 700; letter-spacing: .04em; }
.sec-more { font-size: 12px; color: #0080ff; font-weight: 600; }
.sec-cnt { font-size: 13px; color: #78b6b8; }
/* ===== Featured ===== */

/* ===== Hot Games ===== */

/* ===== Rank list (Action) ===== */

/* ===== Puzzle horizontal scroll ===== */

/* ===== Generic responsive icon grid (8 columns on desktop) ===== */
 .all-grid, .games-grid {
  display: grid;
  grid-template-columns: repeat(4, 1fr);
  gap: 10px;
  padding: 0 16px 8px;
}
@media (min-width: 480px) {
 .all-grid, .games-grid { grid-template-columns: repeat(6, 1fr); }
}
@media (min-width: 860px) {
 .all-grid, .games-grid { grid-template-columns: repeat(8, 1fr); }
}
 .agcard, .gcard { cursor: pointer; min-width: 0; }
 .agcard-img, .gcard-img { border-radius: 12px; overflow: hidden; border: 1px solid rgba(0,128,255,.2); }
 .agcard-img img, .gcard-img img { aspect-ratio: 1/1; }
 .agcard-nm, .gcard-nm {
  font-size: 11px; margin-top: 5px; text-align: center; color: #b8eae8;
  white-space: nowrap; overflow: hidden; text-overflow: ellipsis;
}
/* ===== Two / Tri column grids (Sports, Racing, Adventure, Girl) ===== */

/* ===== Spotlight / Hero cards (Sports, Adventure) ===== */

/* ===== Load more ===== */
.more-wrap, .loadmore-wrap { display: flex; justify-content: center; padding: 16px; }
.more-btn, .loadmore-btn {
  padding: 10px 22px; border-radius: 20px; background: #073030; color: #0080ff;
  font-size: 13px; font-weight: 600; border: 1px solid rgba(0,128,255,.4);
  box-shadow: 0 0 10px rgba(0,128,255,.25);
}
/* ===== Filter header ===== */
.filter-hdr { display: flex; align-items: center; gap: 10px; padding: 14px 16px; }
.filter-back { font-size: 13px; color: #0080ff; font-weight: 600; }
.filter-title { flex: 1; font-size: 16px; font-weight: 700; letter-spacing: .03em; }
.filter-cnt { font-size: 12px; color: #78b6b8; }
.empty-msg { text-align: center; padding: 60px 0; color: #78b6b8; font-size: 13px; }
/* ===== Footer ===== */
.site-footer { display: flex; justify-content: center; gap: 10px; padding: 24px 16px; font-size: 12px; color: #78b6b8; }
/* ===== Back to top ===== */
.totop-btn {
  position: fixed; right: 16px; bottom: 20px; z-index: 50;
  width: 40px; height: 40px; border-radius: 50%;
  background: linear-gradient(135deg, #ff2bbb, #0080ff); color: #001718; font-size: 16px;
  box-shadow: 0 4px 18px rgba(255,43,187,.5);
}
/* ===== Desktop content width cap ===== */
@media (min-width: 860px) {
  body { max-width: 1080px; margin: 0 auto; }
}
/* ===== Avatar row (overlapping circular cards) ===== */

/* ===== Spotlight Picks (terminal log) ===== */

/* ===== Fix: All Games / filtered / kids grid icons — lock container aspect ratio so size never depends on the source image's native dimensions ===== */
 .agcard-img, .gcard-img { aspect-ratio: 1/1 !important; width: 100%; height: auto; }
 .agcard-img img, .gcard-img img { width: 100%; height: 100%; object-fit: cover; }

/* ===== 顶部单独大图.html — retthemed hero component ===== */
/* ============================================================
   顶部单独大图 · 板块样式库
   所有可换色的地方都走 CSS 变量，批量换肤时只需改 :root
   ============================================================ */

:root {
  --th-bg: #001718;
  --th-fg: #e6fffc;
  --th-muted: #78b6b8;
  --th-border: #0a484a;
  --th-placeholder-bg: #013838;
  --th-card-bg: #013838;
  --th-accent: #ff2bbb;
  --th-accent-fg: #001718;
  --th-accent2: #0080ff;
  --th-accent2-dark: #0080ff;
  --th-pink: #ff2bbb;
  --th-red: #ff2bbb;
  --th-gold: #0080ff;
  --th-gold-dark: #0080ff;
  --th-cyan: #0080ff;
  --th-blue: #0080ff;
  --th-orange: #0080ff;
  --th-lightred: #ff2bbb;
  --th-green: #0080ff;
  --th-paper: #013838;
  --th-ink: #e6fffc;
}

/* ---- top bar / jump nav / loading ---- */
/* ---- shared block header ---- */
.th-imgwrap { position: relative; overflow: hidden; background: var(--th-placeholder-bg); }
.th-imgwrap img { width: 100%; height: 100%; object-fit: cover; }

/* ---- 1. gradient overlay + bottom title ---- */

/* ---- 2. centered copy + CTA button ---- */

/* ---- 3. rounded card + bottom-left tag ---- */
.th-3-card { border-radius: 20px; overflow: hidden; box-shadow: 0 10px 24px rgba(0,0,0,.16); margin: 0 6px; }
.th-3-hero { position: relative; aspect-ratio: 4/3; }
.th-3-badge { position: absolute; left: 12px; bottom: 12px; background: rgba(255,255,255,.92); color: var(--th-fg); font-size: 11px; font-weight: 800; padding: 5px 12px; border-radius: 999px; }

/* ---- 4. split image-text layout ---- */

/* ---- 5. ultra-wide banner + top icon badge ---- */

/* ---- 6. play button overlay (video poster style) ---- */

/* ---- 7. magazine cover style ---- */

/* ---- 8. glassmorphism info bar ---- */

/* ---- 9. NEW ribbon + bottom CTA ---- */

/* ---- 10. framed whitespace + bottom dots ---- */

/* ---- 11. featured pick (rating + online count) ---- */

/* ---- 12. recently played (quick launch) ---- */

/* ---- 13. trending leaderboard (top 3) ---- */

/* ---- 14. new release (launch teaser) ---- */

/* ---- 15. trending now (friend avatars + heat index) ---- */

/* ---- 16. live countdown (event timer) ---- */

/* ---- 17. editor's choice (curated picks) ---- */

/* ---- 18. head-to-head poll ---- */

/* ---- 19. game collection (themed picks) ---- */

/* ---- 20. achievement showcase ---- */

/* ---- 21. comic book panel (speech bubble) ---- */

/* ---- 22. boarding pass ticket ---- */

/* ---- 23. neon cyberpunk glitch ---- */

/* ---- 24. tilted polaroid + tape ---- */

/* ---- 25. newspaper headline ---- */

/* ---- 26. vinyl record spin ---- */

@keyframes th-spin { to { transform: translateY(-50%) rotate(360deg); } }

/* ---- 27. postcard stamp ---- */

/* ---- 28. duotone split panel ---- */

/* ---- 29. radar sci-fi HUD ---- */

/* ---- 30. sticky note caption ---- */

/* ---- 31. vertical side tab ---- */

/* ---- 32. diagonal corner ribbon ---- */

/* ---- 33. floating card below image ---- */

/* ---- 34. minimal outline frame ---- */

/* ---- 35. multi-stat row ---- */

/* ---- 36. arcade marquee lights ---- */

     
     
   
@keyframes th-blink { 50% { opacity: .2; } }

/* ---- 37. origami fold reveal ---- */

/* ---- 38. spotlight vignette ---- */

/* ---- 39. certificate award frame ---- */

   

/* ---- 40. retro TV bezel ---- */

@media (min-width: 860px) { body { max-width: 1080px; margin: 0 auto; } }

/* ===== 纯文本不带图.html — retthemed text component ===== */
/* ============================================================
   纯文本不带图 · 板块样式库
   所有可换色的地方都走 CSS 变量，批量换肤时只需改 :root
   ============================================================ */

:root {
  --gy-bg: #001718;
  --gy-fg: #e6fffc;
  --gy-muted: #78b6b8;
  --gy-border: #0a484a;
  --gy-card-bg: #013838;
  --gy-accent: #ff2bbb;
  --gy-accent-fg: #001718;
  --gy-tag-bg: #013838;
}

/* ---- top bar / loading ---- */
/* ---- shared block header ---- */
/* ---- 1. sticky notes ---- */

/* ---- 2. ranked list ---- */

/* ---- 3. tag cloud ---- */

/* ---- 4. horizontal scroll cards ---- */

/* ---- 5. minimalist dashboard ---- */

/* ---- 6. timeline ---- */

/* ---- 7. accordion ---- */

/* ---- 8. icon grid ---- */

/* ---- 9. quote cards ---- */

/* ---- 10. glassmorphism cards ---- */
.gy-glasslist { display: flex; flex-direction: column; gap: 14px; padding: 0 16px; }
.gy-glasscard { padding: 18px; background: rgba(255,255,255,.65); backdrop-filter: blur(12px); -webkit-backdrop-filter: blur(12px); border: 1px solid rgba(255,255,255,.8); border-radius: 14px; box-shadow: 0 4px 16px rgba(0,0,0,.05); }
.gy-glass-nm { font-size: 15px; font-weight: 800; color: var(--gy-fg); margin-bottom: 6px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gy-glass-txt { font-size: 11px; color: #555; line-height: 1.5; display: -webkit-box; -webkit-line-clamp: 2; -webkit-box-orient: vertical; overflow: hidden; }

/* ---- 11. neon glow buttons ---- */
.gy-neongrid { display: flex; justify-content: center; gap: 12px; padding: 10px 16px; flex-wrap: wrap; }
.gy-neonbtn { display: flex; align-items: center; gap: 6px; padding: 8px 18px; font-size: 12px; font-weight: 700; color: var(--gy-fg); background: var(--gy-card-bg); border: 1px solid var(--gy-border); border-radius: 999px; transition: all .2s ease; }

.gy-neonbtn:active { transform: translateY(1px); background: var(--gy-accent); color: var(--gy-accent-fg); border-color: var(--gy-accent); }

/* ---- 12. stepped progress ---- */

/* ---- 13. circular rating badges ---- */

/* ---- 14. compact avatar list ---- */

/* ---- 15. minimalist table list ---- */

/* ---- 16. terminal / CLI style ---- */

@keyframes gy-blink { 50% { opacity: 0; } }

/* ---- 17. dog-ear folded cards ---- */

/* ---- 18. heartbeat / EKG wave ---- */

/* ---- 19. scrabble letter tiles ---- */

/* ---- 20. subway sign list ---- */

/* ---- 21. liquid fill cards ---- */

/* ---- 22. stamp / perforated grid ---- */

/* ---- 23. cassette tape list ---- */

/* ---- 24. business card list ---- */

/* ---- 25. tic-tac-toe grid ---- */

/* ---- 26. two-column compare list ---- */

/* ---- 27. newspaper columns ---- */

/* ---- 28. chat bubble list ---- */

/* ---- 29. typewriter line-number list ---- */

/* ---- 30. medal ribbon list ---- */

/* ---- 31. diagonal split cards ---- */

/* ---- 32. drop-cap paragraph list ---- */

/* ---- 33. horizontal scale timeline ---- */

/* ---- 34. ticket stub list ---- */

/* ---- 35. subtitle two-line cards ---- */

/* ---- 36. kanban columns ---- */

/* ---- 37. star rating list ---- */

/* ---- 38. equalizer bars list ---- */

/* ---- 39. framed text cards ---- */

/* ---- 40. bookmark fold list ---- */

@media (min-width: 860px) { body { max-width: 1080px; margin: 0 auto; } }

/* ===== 网格布局.html — retthemed grid components ===== */
/* ============================================================
   网格布局 · 板块样式库
   所有可换色的地方都走 CSS 变量，批量换肤时只需改 :root
   ============================================================ */

:root {
  --gr-bg: #001718;
  --gr-fg: #e6fffc;
  --gr-muted: #78b6b8;
  --gr-border: #0a484a;
  --gr-placeholder-bg: #013838;
  --gr-card-bg: #013838;
  --gr-accent: #ff2bbb;
  --gr-accent-fg: #001718;
  --gr-tag-bg: #013838;
  --gr-accent2: #0080ff;
  --gr-gold: #0080ff;
  --gr-red: #ff2bbb;
  --gr-green: #0080ff;
  --gr-blue: #0080ff;
  --gr-pink: #ff2bbb;
  --gr-cyan: #0080ff;
  --gr-silver: #78b6b8;
  --gr-wood: #0080ff;
  --gr-chalk: #e6fffc;
  --gr-slate: #78b6b8;
}

/* ---- top bar / jump nav / loading ---- */
/* ---- shared block header ---- */
.gr-imgwrap { position: relative; overflow: hidden; background: var(--gr-placeholder-bg); }
.gr-imgwrap img { width: 100%; height: 100%; object-fit: cover; }

/* ---- 1. classic rounded card grid (3-col) ---- */

/* ---- 2. compact square icon grid (4-col) ---- */

/* ---- 3. wide card grid + description (2-col) ---- */

/* ---- 4. numbered channel grid (4-col) ---- */

/* ---- 5. rated card grid (3-col) ---- */

/* ---- 6. category chip grid (3-col) ---- */

/* ---- 7. color bar accent grid (4-col) ---- */

/* ---- 8. ribbon badge grid (3-col) ---- */

/* ---- 9. rounded avatar grid (4-col) ---- */

/* ---- 10. dense mini icon grid (5-col) ---- */

/* ---- 11. portrait poster grid (2-col) ---- */

/* ---- 12. ultra dense micro grid (6-col) ---- */

/* ---- 13. chromeless overlay title grid (3-col) ---- */

/* ---- 14. neumorphism soft grid (3-col) ---- */

/* ---- 15. rank badge grid (4-col) ---- */

/* ---- 16. price tag fold grid (3-col) ---- */

/* ---- 17. online status dot grid (4-col) ---- */

/* ---- 18. blueprint dashed outline grid (3-col) ---- */

/* ---- 19. progress bar grid (3-col) ---- */

/* ---- 20. hexagon icon grid (4-col) ---- */

/* ---- 21. gradient ring avatar grid (3-col) ---- */

/* ---- 22. verified badge grid (4-col) ---- */

/* ---- 23. film strip sprocket grid (3-col) ---- */

/* ---- 24. corner color wash grid (3-col) ---- */

/* ---- 25. diagonal split card grid (3-col) ---- */

/* ---- 26. corner peel grid (3-col) ---- */

/* ---- 27. subway tile grid (2-col) ---- */

/* ---- 28. view count overlay grid (4-col) ---- */

/* ---- 29. checkerboard grid (4-col) ---- */

/* ---- 30. category top border grid (3-col) ---- */

/* ---- 31. retro pixel border grid (3-col) ---- */

/* ---- 32. stamp perforated grid (3-col) ---- */

/* ---- 33. glass caption grid (3-col) ---- */

/* ---- 34. nameplate tab grid (4-col) ---- */

/* ---- 35. landscape play card grid (2-col) ---- */

/* ---- 36. lifted shadow frame grid (3-col) ---- */

/* ---- 37. minimal divider line grid (4-col) ---- */
.gr-37-grid { display: grid; grid-template-columns: repeat(4, 1fr); }
.gr-37-card { display: flex; flex-direction: column; min-width: 0; align-items: center; gap: 6px; padding: 10px 6px; border-right: 1px solid var(--gr-border); border-bottom: 1px solid var(--gr-border); }
.gr-37-card:nth-child(4n) { border-right: none; }
.gr-37-img { width: 60%; aspect-ratio: 1/1; border-radius: 8px; }
.gr-37-nm { font-size: 10px; font-weight: 600; color: #444; text-align: center; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- 38. neon gradient border grid (3-col) ---- */
.gr-38-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 10px; }
.gr-38-card { display: flex; flex-direction: column; min-width: 0; gap: 6px; }
.gr-38-inner { padding: 3px; border-radius: 12px; background: linear-gradient(135deg, var(--gr-accent2), var(--gr-pink), var(--gr-cyan)); }
.gr-38-img { aspect-ratio: 1/1; border-radius: 9px; border: 2px solid var(--gr-bg); }
.gr-38-nm { font-size: 11px; font-weight: 700; color: var(--gr-fg); text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- 39. multicolor flag corner grid (4-col) ---- */
.gr-39-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px 8px; }
.gr-39-card { display: flex; flex-direction: column; min-width: 0; gap: 6px; }
.gr-39-img { position: relative; aspect-ratio: 1/1; border-radius: 10px; }
.gr-39-flag { position: absolute; top: 6px; right: 6px; width: 0; height: 0; border-style: solid; border-width: 12px 12px 0 0; }
.gr-39-c0 { border-color: var(--gr-accent2) transparent transparent transparent; }
.gr-39-c1 { border-color: var(--gr-gold) transparent transparent transparent; }
.gr-39-c2 { border-color: var(--gr-red) transparent transparent transparent; }
.gr-39-c3 { border-color: var(--gr-blue) transparent transparent transparent; }
.gr-39-nm { font-size: 11px; font-weight: 700; color: var(--gr-fg); text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- 40. two-line subtitle card grid (3-col) ---- */
.gr-40-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 16px 10px; }
.gr-40-card { display: flex; flex-direction: column; gap: 3px; min-width: 0; }
.gr-40-img { aspect-ratio: 1/1; border-radius: 10px; }
.gr-40-nm { font-size: 12px; font-weight: 800; color: var(--gr-fg); margin-top: 4px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.gr-40-cat { font-size: 10px; font-weight: 600; color: var(--gr-muted); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- 41. frosted glass panel grid (3-col) ---- */
.gr-41-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 10px; }
.gr-41-card { display: flex; flex-direction: column; min-width: 0; gap: 6px; background: rgba(255,255,255,.5); backdrop-filter: blur(10px); -webkit-backdrop-filter: blur(10px); border: 1px solid rgba(255,255,255,.7); border-radius: 14px; padding: 8px; }
.gr-41-img { aspect-ratio: 1/1; border-radius: 10px; }
.gr-41-nm { font-size: 11px; font-weight: 700; color: var(--gr-fg); text-align: center; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- 42. color strip side border grid (4-col) ---- */
.gr-42-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 12px 8px; }
.gr-42-card { display: flex; align-items: center; gap: 6px; min-width: 0; border-left: 4px solid var(--gr-accent2); padding-left: 6px; }
.gr-42-c0 { border-left-color: var(--gr-accent2); }
.gr-42-c1 { border-left-color: var(--gr-gold); }
.gr-42-c2 { border-left-color: var(--gr-pink); }
.gr-42-c3 { border-left-color: var(--gr-cyan); }
.gr-42-img { width: 40px; height: 40px; flex-shrink: 0; border-radius: 8px; }
.gr-42-nm { font-size: 10px; font-weight: 700; color: var(--gr-fg); overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- 43. jersey number chip grid (4-col) ---- */
.gr-43-grid { display: grid; grid-template-columns: repeat(4, 1fr); gap: 14px 8px; }
.gr-43-card { display: flex; flex-direction: column; align-items: center; min-width: 0; gap: 4px; }
.gr-43-img { width: 100%; aspect-ratio: 1/1; border-radius: 10px; }
.gr-43-chip { font-size: 13px; font-weight: 900; color: var(--gr-fg); font-family: Georgia, serif; }
.gr-43-nm { font-size: 10px; font-weight: 600; color: #444; text-align: center; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- 44. diagonal stripe backdrop grid (3-col) ---- */
.gr-44-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 14px 10px; }
.gr-44-card { display: flex; flex-direction: column; min-width: 0; align-items: center; gap: 6px; padding: 10px; border-radius: 10px; background: repeating-linear-gradient(45deg, var(--gr-tag-bg) 0 8px, var(--gr-card-bg) 8px 16px); }
.gr-44-img { width: 80%; aspect-ratio: 1/1; border-radius: 8px; border: 2px solid #fff; box-shadow: 0 3px 8px rgba(0,0,0,.15); }
.gr-44-nm { font-size: 11px; font-weight: 700; color: var(--gr-fg); text-align: center; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- 45. vertical stripe column grid (3-col) ---- */
.gr-45-grid { display: grid; grid-template-columns: repeat(3, 1fr); gap: 0; }
.gr-45-card { display: flex; flex-direction: column; min-width: 0; align-items: center; gap: 6px; padding: 10px 6px; background: var(--gr-card-bg); }
.gr-45-card.alt { background: var(--gr-tag-bg); }
.gr-45-img { width: 75%; aspect-ratio: 1/1; border-radius: 8px; }
.gr-45-nm { font-size: 11px; font-weight: 700; color: var(--gr-fg); text-align: center; max-width: 100%; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }

/* ---- 46. orbit dot ring grid (4-col) ---- */

     

/* ---- 47. retro CRT scanline grid (3-col) ---- */

/* ---- 48. wooden plank card grid (3-col) ---- */

/* ---- 49. sticker peel corner grid (4-col) ---- */

/* ---- 50. neon outline glow grid (3-col) ---- */

/* ---- 51. passport stamp grid (3-col) ---- */

/* ---- 52. emoji reaction bar grid (3-col) ---- */

/* ---- 53. comic halftone panel grid (3-col) ---- */

/* ---- 54. confetti celebration grid (3-col) ---- */

/* ---- 55. chalkboard card grid (3-col) ---- */

/* ---- 56. holographic foil card grid (3-col) ---- */

/* ---- 57. wax seal badge grid (3-col) ---- */

/* ---- 58. origami fold grid (4-col) ---- */

/* ---- 59. marble texture card grid (3-col) ---- */

/* ---- 60. neon sign card grid (3-col) ---- */

/* ---- 61. ticket roll grid (2-col) ---- */

/* ---- 62. sports scoreboard grid (4-col) ---- */

/* ---- 63. weather stat card grid (3-col) ---- */

/* ---- 64. trading card holo grid (3-col) ---- */

/* ---- 65. puzzle piece shape grid (4-col) ---- */

/* ---- 66. rotated diamond grid (4-col) ---- */

/* ---- 67. vinyl sleeve grid (3-col) ---- */

/* ---- 68. passport photo ID grid (4-col) ---- */

/* ---- 69. concert ticket stub grid (2-col) ---- */

/* ---- 70. bookshelf spine grid (5-col) ---- */

/* ---- 71. sticky tab index grid (4-col) ---- */

/* ---- 72. barcode label grid (3-col) ---- */

/* ---- 73. sticker pack grid (4-col) ---- */

/* ---- 74. level-up badge grid (3-col) ---- */

/* ---- 75. treasure loot grid (4-col) ---- */

/* ---- 76. constellation dotted grid (3-col) ---- */

/* ---- 77. sports jersey card grid (3-col) ---- */

/* ---- 78. missing poster grid (3-col) ---- */

/* ---- 79. emoji mood grid (5-col) ---- */

/* ---- 80. premium combo card grid (3-col) ---- */

@media (min-width: 860px) { body { max-width: 1080px; margin: 0 auto; } }