@import "https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700&display=swap";:root{--bg-dark:#0f1115;--bg-card:#1e212899;--bg-card-hover:#282d37cc;--primary:#6366f1;--primary-glow:#6366f166;--secondary:#ec4899;--text-main:#f8fafc;--text-muted:#94a3b8;--border-color:#ffffff14;--success:#10b981}*{box-sizing:border-box;margin:0;padding:0}body{background-color:var(--bg-dark);color:var(--text-main);-webkit-font-smoothing:antialiased;background-image:radial-gradient(circle at 15%,#6366f126,#0000 25%),radial-gradient(circle at 85% 30%,#ec489926,#0000 25%);background-attachment:fixed;min-height:100vh;font-family:Outfit,-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica,Arial,sans-serif;overflow-x:hidden}#root{flex-direction:column;max-width:600px;min-height:100vh;margin:0 auto;display:flex}.app-container{flex-direction:column;flex:1;padding:20px;animation:.5s ease-out forwards fadeIn;display:flex}.header{border-bottom:1px solid var(--border-color);justify-content:space-between;align-items:center;margin-bottom:30px;padding-bottom:20px;display:flex}.user-info{align-items:center;gap:12px;display:flex}.avatar{background:linear-gradient(135deg, var(--primary), var(--secondary));width:48px;height:48px;box-shadow:0 4px 12px var(--primary-glow);border-radius:50%;justify-content:center;align-items:center;font-size:1.2rem;font-weight:600;display:flex}.greeting h1{margin-bottom:2px;font-size:1.2rem;font-weight:600}.greeting p{color:var(--text-muted);font-size:.85rem}.nav-tabs{background:#0003;border-radius:16px;margin-bottom:24px;padding:6px;display:flex}.tab-btn{color:var(--text-muted);cursor:pointer;background:0 0;border:none;border-radius:12px;flex:1;padding:12px 0;font-family:inherit;font-size:1rem;font-weight:500;transition:all .3s}.tab-btn.active{background:var(--bg-card);color:var(--text-main);box-shadow:0 4px 12px #0000001a}.collection{opacity:0;margin-bottom:30px;animation:.4s ease-out forwards slideUp}.collection:first-child{animation-delay:.1s}.collection:nth-child(2){animation-delay:.2s}.collection:nth-child(3){animation-delay:.3s}.collection-header{margin-bottom:16px}.collection-header h2{background:linear-gradient(to right, #fff, var(--text-muted));-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:1.4rem;font-weight:600}.collection-header p{color:var(--text-muted);margin-top:4px;font-size:.9rem}.books-grid{grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:16px;display:grid}.book-card{background:var(--bg-card);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);border:1px solid var(--border-color);border-radius:16px;flex-direction:column;padding:12px;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.book-card.owned:before{content:"";pointer-events:none;background:radial-gradient(circle at 100% 0,#10b9811a,#0000 70%);position:absolute;inset:0}.book-card:hover{border-color:#fff3;transform:translateY(-4px);box-shadow:0 8px 24px #0003}.book-cover{color:#fffc;border-radius:10px;justify-content:center;align-items:center;height:140px;margin-bottom:12px;font-size:2rem;display:flex;position:relative;overflow:hidden;box-shadow:inset 0 0 20px #0003}.book-cover-img{object-fit:cover;width:100%;height:100%;display:block}.volume-badge{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);color:#fff;pointer-events:none;background:#0f1115d9;border:1px solid #ffffff26;border-radius:6px;padding:4px 8px;font-size:.75rem;font-weight:700;position:absolute;top:8px;right:8px;box-shadow:0 4px 12px #0000004d}.book-info{flex-direction:column;flex:1;display:flex}.book-title{margin-bottom:4px;font-size:.95rem;font-weight:600;line-height:1.3}.book-author{color:var(--text-muted);flex:1;margin-bottom:12px;font-size:.8rem}.action-btn{cursor:pointer;border:none;border-radius:8px;justify-content:center;align-items:center;gap:6px;width:100%;padding:8px 0;font-family:inherit;font-size:.9rem;font-weight:600;transition:all .2s;display:flex}.btn-buy{background:var(--primary);color:#fff}.btn-buy:hover{box-shadow:0 4px 12px var(--primary-glow);background:#4f46e5}.btn-buy:active{transform:scale(.96)}.btn-owned{color:var(--success);cursor:default;background:#10b98126;border:1px solid #10b9814d}.btn-remove{color:var(--secondary);background:#ec489926;border:1px solid #ec48994d}.btn-remove:hover{background:#ec48994d;box-shadow:0 4px 12px #ec489933}.btn-remove:active{transform:scale(.96)}.search-container{margin-bottom:24px;position:relative}.search-input{border:1px solid var(--border-color);width:100%;color:var(--text-main);background:#0003;border-radius:14px;padding:14px 16px 14px 44px;font-family:inherit;font-size:1rem;transition:all .3s}.search-input:focus{border-color:var(--primary);background:#0000004d;outline:none;box-shadow:0 0 0 3px #6366f133}.search-input::placeholder{color:var(--text-muted)}.search-icon{color:var(--text-muted);pointer-events:none;font-size:1.2rem;position:absolute;top:50%;left:16px;transform:translateY(-50%)}.empty-state{text-align:center;color:var(--text-muted);padding:60px 20px;animation:.5s ease-out fadeIn}.empty-icon{opacity:.5;margin-bottom:16px;font-size:3rem}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}::-webkit-scrollbar{width:6px}::-webkit-scrollbar-track{background:0 0}::-webkit-scrollbar-thumb{background:#ffffff1a;border-radius:10px}::-webkit-scrollbar-thumb:hover{background:#fff3}