body { background: #f8fafc; color: #0f172a; }
.page-header { text-align: center; padding: 60px 8% 40px; max-width: 1400px; margin: 0 auto; }
.page-header h1 { font-size: 48px; font-weight: 800; margin-bottom: 16px; letter-spacing: -1px; }
.page-header p { font-size: 18px; color: var(--text-gray); max-width: 560px; margin: 0 auto; }
.category { max-width: 1400px; margin: 0 auto; padding: 0 8% 60px; }
.category h2 { font-size: 22px; font-weight: 700; margin-bottom: 24px; padding-bottom: 10px; border-bottom: 2px solid #e2e8f0; display: flex; align-items: center; gap: 10px; }
.category h2 .badge { font-size: 11px; font-weight: 700; background: #e2e8f0; color: #64748b; padding: 3px 8px; border-radius: 20px; text-transform: uppercase; }
.category h2 .badge-premium { background: #fef3c7; color: #92400e; }
.themes-grid { display: flex; flex-wrap: wrap; gap: 32px; padding-bottom: 8px; }
.theme-card { text-decoration: none; display: flex; flex-direction: column; align-items: center; gap: 12px; }
.theme-card:hover .phone-shell { box-shadow: 0 28px 70px rgba(0,0,0,.55), inset 0 0 0 1px rgba(255,255,255,.08); transform: translateY(-4px); }
.phone-shell { width: 198px; height: 406px; border: 8px solid #1a2035; border-radius: 34px; overflow: hidden; box-shadow: 0 20px 60px rgba(0,0,0,.35), inset 0 0 0 1px rgba(255,255,255,.05); position: relative; background: #0a0e1a; transition: box-shadow 0.2s, transform 0.2s; }
.phone-notch { position: absolute; top: 0; left: 50%; transform: translateX(-50%); width: 70px; height: 20px; background: #1a2035; border-radius: 0 0 12px 12px; z-index: 10; }
.phone-screen { width: 182px; height: 390px; overflow: hidden; }
.phone-inner { width: 390px; height: 812px; transform: scale(0.4667); transform-origin: 0 0; }
.phone-inner iframe { width: 390px; height: 812px; border: none; display: block; pointer-events: none; }
.theme-label { display: flex; align-items: center; gap: 8px; }
.theme-label span { font-weight: 700; font-size: 14px; color: #0f172a; }
.theme-label .lock { font-size: 11px; background: #fef3c7; color: #92400e; padding: 2px 8px; border-radius: 20px; font-weight: 700; }
@media (max-width: 600px) {
    .page-header h1 { font-size: 32px; }
    .themes-grid { gap: 20px; }
}