body{margin:0;font-family:Arial,Helvetica,sans-serif}.app{background:#f5f5f5;color:#333;min-height:100vh;transition:.3s}.app.dark{background:#121212;color:#f5f5f5}.hero{background:#fff;text-align:center;padding:60px 20px;margin-bottom:40px;position:relative;transition:.3s}.app.dark .hero{background:#1e1e1e}.hero-title{font-size:36px;margin-bottom:15px}.hero-text{font-size:18px;color:#666;margin-bottom:25px}.app.dark .hero-text{color:#ccc}.hero-buttons{display:flex;justify-content:center;gap:15px}.hero-btn{padding:12px 20px;border:none;border-radius:6px;font-size:14px;cursor:pointer;transition:.2s}.hero-btn.black{background:#000;color:#fff}.hero-btn.black:hover{background:#333}.hero-btn.red{background:#e60000;color:#fff}.hero-btn.red:hover{background:#b30000}.mode-btn{position:absolute;top:20px;right:20px;padding:10px 16px;border:none;border-radius:6px;background:#222;color:#fff;cursor:pointer;transition:.2s}.mode-btn:hover{background:#000}.app.dark .mode-btn{background:#e60000}.app.dark .mode-btn:hover{background:#b30000}.container{max-width:1100px;margin:auto;padding:40px}.title{text-align:center;color:#c40000;font-size:32px;margin-bottom:20px}.app.dark .title{color:#ff4d4d}.count{text-align:center;margin-bottom:25px}.top-bar{display:flex;justify-content:center;gap:20px;margin-bottom:30px;flex-wrap:wrap}.search{padding:10px 14px;border-radius:6px;border:1px solid #ccc}.dropdown{padding:10px;border-radius:6px;border:1px solid #ccc}.sort-btn{padding:10px 16px;background:#e60000;color:#fff;border:none;border-radius:6px;cursor:pointer;transition:.2s}.sort-btn:hover{background:#b30000}.donor-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(260px,1fr));gap:25px}.card{background:#fff;padding:20px;border-radius:10px;box-shadow:0 4px 12px #0000001a;transition:.25s;border-top:4px solid #e60000}.card:hover{transform:translateY(-6px);box-shadow:0 10px 20px #00000026}.app.dark .card{background:#1e1e1e;box-shadow:0 4px 12px #ffffff0d}.badge{background:#e60000;color:#fff;padding:5px 10px;border-radius:15px;font-size:12px;margin-left:6px}.available{color:#2e7d32;font-weight:700}.not-available{color:#c40000;font-weight:700}.btn{margin-top:12px;padding:10px 16px;border:none;background:#e60000;color:#fff;border-radius:6px;cursor:pointer;transition:.2s}.btn:hover{background:#b30000}.btn:disabled{background:gray}.loading{text-align:center;margin-top:120px;font-size:22px}