*{margin:0;padding:0;box-sizing:border-box}body{font-family:system-ui,-apple-system,sans-serif;background:#1a1a2e;color:#eee;min-height:100vh}.page{max-width:900px;margin:0 auto;padding:24px 16px;display:flex;flex-direction:column;gap:24px}header{text-align:center}header h1{font-size:2rem}.tagline{margin-top:8px;color:#8b90a8}.grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:16px}.card{display:flex;align-items:center;gap:16px;padding:20px;background:#16213e;border-radius:12px;text-decoration:none;color:inherit;transition:transform .2s cubic-bezier(.22,1,.36,1),box-shadow .2s ease-out}.card:hover{transform:translateY(-4px);box-shadow:0 12px 24px #00000059}.card:active{transform:translateY(-1px) scale(.98)}.card .icon{font-size:2.4rem;line-height:1}.card .meta{flex:1;display:flex;flex-direction:column;gap:6px;min-width:0}.card .meta strong{font-size:1.1rem}.card .meta small{color:#8b90a8;line-height:1.4}.card .play{font-size:.75rem;font-weight:700;letter-spacing:1px;color:#4ecdc4;white-space:nowrap}.empty{grid-column:1 / -1;text-align:center;color:#8b90a8;padding:40px 0}.ad-slot{width:100%}footer{text-align:center;color:#777}footer a{color:#999}
