* { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, BlinkMacSystemFont, "Hiragino Sans", sans-serif; background: #f5f5f7; color: #111; min-height: 100dvh; display: flex; flex-direction: column; }
main { flex: 1; }
a { text-decoration: none; color: inherit; }

header { position: sticky; top: 0; z-index: 50; background: #fff; border-bottom: 1px solid #eee; height: 48px; display: flex; align-items: center; gap: 8px; padding: 0 16px; }
.logo { font-size: 17px; font-weight: 700; letter-spacing: -0.5px; }
.logo span { color: #4f46e5; }
.back-btn { width: 34px; height: 34px; display: flex; align-items: center; justify-content: center; color: #555; font-size: 18px; flex-shrink: 0; }
.header-title { flex: 1; font-size: 15px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }

footer { background: #fff; border-top: 1px solid #eee; padding: 20px 16px 32px; margin-top: 8px; }
.footer-logo { font-size: 13px; font-weight: 700; color: #111; margin-bottom: 12px; }
.footer-logo span { color: #4f46e5; }
.footer-links { display: flex; gap: 16px; margin-bottom: 14px; flex-wrap: wrap; }
.footer-links a { font-size: 12px; color: #555; }
.footer-copy { font-size: 11px; color: #aaa; }

.game-grid { display: grid; grid-template-columns: repeat(auto-fill, minmax(min(25vw, 130px), 1fr)); gap: 10px; }
.game-card { background: #fff; border-radius: 14px; overflow: hidden; border: 1px solid #f0f0f0; display: block; }
.game-card:active { opacity: .85; }
.game-card img.icon { width: 100%; aspect-ratio: 1; object-fit: cover; display: block; }
.game-card-info { padding: 6px 8px 9px; }
.game-card-name { font-size: 11px; font-weight: 600; white-space: nowrap; overflow: hidden; text-overflow: ellipsis; }
.game-card-genre { font-size: 10px; color: #9ca3af; margin-top: 1px; }

.new-badge { font-size: 9px; font-weight: 700; background: #d1fae5; color: #065f46; padding: 2px 6px; border-radius: 5px; letter-spacing: .04em; }
.genre { font-size: 10px; font-weight: 600; background: #ede9fe; color: #4338ca; padding: 3px 9px; border-radius: 99px; }
