*,:before,:after{box-sizing:border-box;margin:0;padding:0}:root{--bg:#0f1117;--bg-card:#1a1d27;--bg-card-hover:#22263a;--bg-input:#1a1d27;--border:#2a2d3a;--text:#e2e4e9;--text-muted:#8b8fa3;--accent:#6c8cff;--accent-hover:#8aa4ff;--success:#22c55e;--warning:#f59e0b;--danger:#ef4444;--radius:10px;--radius-sm:6px;--shadow:0 2px 12px #0000004d}html{font-size:16px}body{background:var(--bg);color:var(--text);-webkit-font-smoothing:antialiased;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,sans-serif;line-height:1.6}.app{max-width:1200px;min-height:100vh;margin:0 auto;padding:1rem 1.5rem 3rem}.app-header{margin-bottom:1.5rem}.header-top{flex-wrap:wrap;align-items:baseline;gap:.75rem;margin-bottom:1rem;display:flex}.app-title{letter-spacing:-.02em;color:var(--text);font-size:1.75rem;font-weight:700}.prompt-count{color:var(--text-muted);font-size:.875rem;font-weight:500}.nav-tabs{background:var(--bg-card);border-radius:var(--radius);border:1px solid var(--border);gap:.25rem;width:fit-content;padding:4px;display:flex}.nav-tab{color:var(--text-muted);border-radius:var(--radius-sm);cursor:pointer;background:0 0;border:none;align-items:center;gap:.4rem;padding:.5rem 1.25rem;font-size:.875rem;font-weight:500;transition:all .15s;display:flex}.nav-tab:hover{color:var(--text)}.nav-tab.active{background:var(--accent);color:#fff}.fav-count-badge{color:#fff;text-align:center;background:#ffffff40;border-radius:100px;min-width:1.25rem;padding:.15rem .4rem;font-size:.7rem;font-weight:600}.toolbar{flex-direction:column;gap:1rem;margin-bottom:1.5rem;display:flex}.search-bar{align-items:center;display:flex;position:relative}.search-icon{color:var(--text-muted);pointer-events:none;position:absolute;left:1rem}.search-bar input{background:var(--bg-input);border:1px solid var(--border);border-radius:var(--radius);width:100%;color:var(--text);outline:none;padding:.75rem 1rem .75rem 2.75rem;font-size:.95rem;transition:border-color .2s}.search-bar input:focus{border-color:var(--accent)}.search-bar input::placeholder{color:var(--text-muted)}.search-clear{color:var(--text-muted);cursor:pointer;background:0 0;border:none;padding:.25rem;font-size:1.25rem;line-height:1;position:absolute;right:.75rem}.search-clear:hover{color:var(--text)}.category-filter{flex-wrap:wrap;gap:.5rem;display:flex}.filter-chip{background:var(--bg-card);border:1px solid var(--border);color:var(--text-muted);cursor:pointer;border-radius:100px;align-items:center;gap:.35rem;padding:.4rem .9rem;font-size:.8rem;font-weight:500;transition:all .15s;display:flex}.filter-chip:hover{border-color:var(--accent);color:var(--text)}.filter-chip.active{background:var(--accent);border-color:var(--accent);color:#fff}.chip-count{background:#ffffff26;border-radius:100px;padding:.1rem .4rem;font-size:.7rem}.filter-chip.active .chip-count{background:#ffffff4d}.prompt-grid{grid-template-columns:repeat(auto-fill,minmax(340px,1fr));gap:1rem;margin-bottom:1.5rem;display:grid}.prompt-card{background:var(--bg-card);border:1px solid var(--border);border-radius:var(--radius);cursor:pointer;flex-direction:column;gap:.75rem;padding:1.25rem;transition:all .15s;display:flex}.prompt-card:hover{background:var(--bg-card-hover);border-color:var(--accent);box-shadow:var(--shadow);transform:translateY(-2px)}.card-header{justify-content:space-between;align-items:flex-start;gap:.5rem;display:flex}.card-source{text-transform:uppercase;letter-spacing:.04em;color:var(--accent);background:#6c8cff1a;border-radius:4px;padding:.2rem .55rem;font-size:.75rem;font-weight:600}.card-meta{flex-shrink:0;align-items:center;gap:.5rem;display:flex}.card-score{border:1px solid;border-radius:4px;padding:.15rem .45rem;font-size:.75rem;font-weight:600}.card-translated-badge{color:var(--success);background:#22c55e1a;border-radius:4px;padding:.15rem .45rem;font-size:.7rem;font-weight:500}.card-text{color:var(--text);-webkit-line-clamp:4;-webkit-box-orient:vertical;flex:1;font-size:.875rem;line-height:1.55;display:-webkit-box;overflow:hidden}.card-footer{justify-content:space-between;align-items:center;margin-top:auto;display:flex}.fav-btn{color:var(--text-muted);cursor:pointer;border-radius:var(--radius-sm);background:0 0;border:none;padding:.25rem .4rem;font-size:1.25rem;line-height:1;transition:all .15s}.fav-btn:hover{color:var(--warning);background:#f59e0b1a}.fav-btn.active{color:var(--warning)}.card-link{color:var(--text-muted);border-radius:var(--radius-sm);padding:.25rem .5rem;font-size:.8rem;text-decoration:none;transition:all .15s}.card-link:hover{color:var(--accent);background:#6c8cff1a}.skeleton{cursor:default;pointer-events:none}.skeleton:hover{border-color:var(--border);box-shadow:none;transform:none}.skeleton-line{background:linear-gradient(90deg, var(--bg-card) 25%, #252a3a 50%, var(--bg-card) 75%);background-size:200% 100%;border-radius:4px;height:.85rem;animation:1.5s infinite shimmer}.skeleton-title{width:50%;height:1.1rem}.skeleton-short{width:65%}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.empty-state{text-align:center;color:var(--text-muted);padding:4rem 2rem}.error-state{color:var(--danger)}.empty-icon{margin-bottom:1rem;font-size:3rem}.empty-state h2{color:var(--text);margin-bottom:.5rem;font-size:1.25rem;font-weight:600}.empty-state p{max-width:400px;margin:0 auto 1.5rem;font-size:.9rem}.btn-primary{background:var(--accent);color:#fff;border-radius:var(--radius-sm);cursor:pointer;border:none;padding:.6rem 1.5rem;font-size:.9rem;font-weight:500;transition:background .15s}.btn-primary:hover{background:var(--accent-hover)}.pagination{flex-wrap:wrap;justify-content:center;align-items:center;gap:.35rem;padding-top:.5rem;display:flex}.page-btn{background:var(--bg-card);border:1px solid var(--border);color:var(--text);border-radius:var(--radius-sm);cursor:pointer;padding:.45rem .85rem;font-size:.85rem;transition:all .15s}.page-btn:hover:not(:disabled):not(.active){border-color:var(--accent);color:var(--accent)}.page-btn.active{background:var(--accent);border-color:var(--accent);color:#fff;font-weight:600}.page-btn:disabled{opacity:.3;cursor:default}.page-dots{color:var(--text-muted);padding:.45rem .25rem;font-size:.85rem}@media (width<=768px){.app{padding:.75rem 1rem 2rem}.app-title{font-size:1.35rem}.prompt-grid{grid-template-columns:1fr}.nav-tabs{width:100%}.nav-tab{flex:1;justify-content:center}.page-btn{padding:.4rem .65rem;font-size:.8rem}}@media (width<=480px){.app-title{font-size:1.2rem}.card-header{flex-direction:column}.card-meta{align-self:flex-start}}
