* { box-sizing: border-box; }
body { margin: 0; font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, "Helvetica Neue", Arial, "Noto Sans", "PingFang SC", "Hiragino Sans", "Microsoft YaHei", sans-serif; background: #0f172a; color: #e2e8f0; }
.container { max-width: 880px; margin: 0 auto; padding: 24px; }
h1 { font-size: 24px; margin: 0 0 16px; }
.search { display: flex; gap: 8px; margin-bottom: 12px; }
.search input { flex: 1; padding: 10px 12px; border-radius: 8px; border: 1px solid #334155; background: #0b1220; color: #e2e8f0; }
.search button { padding: 10px 14px; border-radius: 8px; border: 1px solid #334155; background: #1e293b; color: #e2e8f0; cursor: pointer; }
.search button:hover { background: #334155; }
.status { min-height: 24px; margin: 8px 0 14px; color: #93c5fd; }
.results { display: grid; grid-template-columns: repeat(auto-fill, minmax(220px, 1fr)); gap: 12px; }
.card { border: 1px solid #334155; background: #0b1220; border-radius: 12px; overflow: hidden; }
.card img { width: 100%; height: 220px; object-fit: cover; display: block; }
.meta { padding: 10px 12px; font-size: 13px; color: #cbd5e1; }
.muted { color: #94a3b8; font-size: 13px; }
.error { color: #fca5a5; }