.novel-card{border-radius:var(--radius-xl);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#1a1a2ecc 0%,#0a0a0af2 100%);border:1px solid #667eea1a;min-height:320px;transition:transform .35s cubic-bezier(.22,.61,.36,1),box-shadow .35s,border-color .35s;display:flex;position:relative;overflow:hidden;box-shadow:0 4px 6px #0000004d,0 1px 3px #0003}.novel-card:before{content:"";border-radius:inherit;-webkit-mask-composite:xor;opacity:0;pointer-events:none;background:linear-gradient(135deg,#3b82f699,#cc662280);padding:1px;transition:opacity .35s;position:absolute;inset:0;-webkit-mask-image:linear-gradient(#fff 0 0),linear-gradient(#fff 0 0);-webkit-mask-position:0 0,0 0;-webkit-mask-size:auto,auto;-webkit-mask-repeat:repeat,repeat;-webkit-mask-clip:content-box,border-box;-webkit-mask-origin:content-box,border-box;-webkit-mask-composite:xor;mask-composite:exclude;-webkit-mask-source-type:auto,auto;mask-mode:match-source,match-source}.novel-card:hover{border-color:#3b82f659;transform:translateY(-4px);box-shadow:0 22px 34px #080c1873,0 0 30px #3b82f640}.novel-card:hover:before{opacity:1}.novel-card:focus-within{border-color:#3b82f680;box-shadow:0 0 0 2px #3b82f659}.favorite-btn{z-index:10;cursor:pointer;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0a0a0ae6;border:2px solid #9ca3af4d;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;transition:all .3s;display:flex;position:absolute;top:.5rem;left:.5rem}.favorite-btn svg{color:#9ca3af;transition:all .3s}.favorite-btn:hover{border-color:var(--accent-orange);background:#f9731633;transform:scale(1.1)}.favorite-btn:hover svg{color:var(--accent-orange)}.favorite-btn.active{background:var(--accent-orange);border-color:var(--accent-orange)}.favorite-btn.active svg{color:#fff;animation:.3s heartBeat}.favorite-btn:disabled{opacity:.5;cursor:not-allowed}.favorite-btn .spinner{border:2px solid #ffffff4d;border-top-color:currentColor;border-radius:50%;width:16px;height:16px;animation:.8s linear infinite spin}@keyframes spin{to{transform:rotate(360deg)}}@keyframes heartBeat{0%,to{transform:scale(1)}50%{transform:scale(1.2)}}.novel-cover{border-right:1px solid #ffffff0f;flex-shrink:0;width:180px;height:100%;position:relative;overflow:hidden}.novel-cover:after{content:"";pointer-events:none;background:linear-gradient(90deg,#0000 0%,#0a0a0a4d 100%);position:absolute;inset:0}.cover-image{object-fit:cover;filter:saturate(1.05);width:100%;height:100%;transition:transform .4s cubic-bezier(.22,.61,.36,1),filter .4s}.novel-card:hover .cover-image{filter:saturate(1.1);transform:scale(1.06)}.novel-content{background:linear-gradient(135deg,var(--dark-card-light)0%,var(--pure-black)100%);flex-direction:column;flex:1;padding:1rem;display:flex}.novel-meta{justify-content:flex-end;align-items:center;margin-bottom:.5rem;display:flex}.status-badge{border-radius:var(--radius-lg);text-transform:uppercase;letter-spacing:.05em;padding:.25rem .75rem;font-size:.625rem;font-weight:700;transition:transform .2s;box-shadow:0 2px 4px #0003}.status-badge:hover{transform:scale(1.05)}.status-badge.ongoing{color:#fff;background:linear-gradient(135deg,#10b981 0%,#059669 100%)}.status-badge.completed{color:#fff;background:linear-gradient(135deg,#3b82f6 0%,#2563eb 100%)}.status-badge.hiatus{color:#fff;background:linear-gradient(135deg,#f59e0b 0%,#d97706 100%)}.chapters-count{color:var(--text-tertiary);font-size:.65rem;font-weight:500}.novel-info{flex-direction:column;flex:1;gap:.5rem;display:flex}.novel-title{color:var(--text-primary);letter-spacing:-.02em;-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:1.125rem;font-weight:700;line-height:1.3;transition:color .2s;display:-webkit-box;overflow:hidden}.novel-card:hover .novel-title{color:var(--primary-blue-light)}.novel-description{color:var(--text-tertiary);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:.8rem;line-height:1.5;display:-webkit-box;overflow:hidden}.novel-genres{gap:.5rem;display:flex}.genre-badge{color:var(--primary-blue-light);border-radius:var(--radius-pill);-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);background:#3b82f61f;border:1px solid #3b82f64d;padding:.25rem .65rem;font-size:.75rem;font-weight:600;transition:all .2s}.genre-badge.genre-tone-0{color:#93c5fd;background:#3b82f626;border-color:#3b82f659}.genre-badge.genre-tone-1{color:#6ee7b7;background:#10b98129;border-color:#10b98166}.genre-badge.genre-tone-2{color:#fdba74;background:#f9731629;border-color:#f9731666}.genre-badge:hover{background:#3b82f640;border-color:#3b82f680;transform:translateY(-1px)}.genre-badge.genre-tone-0:hover{background:#3b82f647;border-color:#3b82f68c}.genre-badge.genre-tone-1:hover{background:#10b9814d;border-color:#10b9818c}.genre-badge.genre-tone-2:hover{background:#f973164d;border-color:#f973168c}.genre-badge.genre-more{color:var(--text-tertiary);background:#64646433;border-color:#9696964d}.novel-footer{background:linear-gradient(#0000 0%,#0a0a0a66 100%);border-top:1px solid #667eea1a;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:.5rem;margin-top:auto;padding:.75rem 0 .25rem;display:flex}.novel-cta-btn{color:var(--text-primary);white-space:nowrap;background:#3b82f62e;border:1px solid #3b82f659;border-radius:999px;flex-shrink:0;margin-left:auto;padding:.35rem .75rem;font-size:.7rem;font-weight:600;text-decoration:none;transition:all .2s}.novel-cta-btn:hover{background:#3b82f64d;border-color:#3b82f699;transform:translateY(-1px)}.novel-stats{flex-shrink:0;align-items:center;gap:.5rem;display:flex}.stat-item{color:var(--text-gray);white-space:nowrap;font-size:.75rem}.rating-display{align-items:center;gap:.4rem;display:flex}.stars{gap:1px;display:flex}.star{font-size:.8rem;line-height:1}.star-full{color:var(--gold)}.star-half{color:var(--gold);opacity:.5}.star-empty{color:var(--border-gray-light)}.rating-text{color:var(--text-primary);font-size:.65rem;font-weight:600}.novel-stats{flex-wrap:wrap;flex:auto;align-items:center;gap:.45rem .6rem;min-width:0;display:flex}.stat-item{color:var(--text-secondary);align-items:center;gap:.3rem;font-size:.75rem;font-weight:500;display:flex}.stat-icon{font-size:1rem;line-height:1}.stat-value{color:var(--text-primary);font-size:.8rem;font-weight:600}.rating-stat{color:var(--text-secondary);font-weight:500}.no-rating{color:var(--text-tertiary);font-size:.75rem;font-style:italic}@media (max-width:768px){.novel-card{flex-direction:row;min-height:160px}.novel-cover{flex-shrink:0;width:110px;height:100%}.cover-image{object-fit:cover;object-position:center}.novel-content{padding:.75rem;overflow:hidden}.novel-title{-webkit-line-clamp:2;font-size:.95rem}.novel-description{-webkit-line-clamp:2;font-size:.7rem}.novel-footer{flex-direction:row;align-items:center;margin-top:.5rem;padding-top:.5rem}.novel-cta-btn{padding:.25rem .6rem;font-size:.65rem}.genre-badge{padding:.15rem .4rem;font-size:.65rem}.novel-genres{gap:.35rem}.favorite-btn{width:32px;height:32px}.favorite-btn svg{width:16px;height:16px}}@media (hover:none){.novel-card:hover{border-color:#667eea1a;transform:none;box-shadow:0 4px 6px #0000004d,0 1px 3px #0003}.novel-card:hover:before{opacity:0}.novel-card:hover .cover-image{filter:saturate(1.05);transform:none}.favorite-btn:hover{transform:none}}.novel-progress{border-top:1px solid #ffffff1a;margin-top:.75rem;padding-top:.75rem}.progress-info{justify-content:space-between;align-items:center;margin-bottom:.35rem;font-size:.75rem;display:flex}.progress-label{color:var(--primary-blue);font-weight:600}.progress-chapter{color:var(--text-tertiary)}.progress-bar-mini{background:#ffffff1a;border-radius:2px;height:4px;overflow:hidden}.progress-fill-mini{background:linear-gradient(90deg,var(--primary-blue),var(--primary-blue-light));border-radius:2px;height:100%;transition:width .3s}
.skeleton-card{-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);background:linear-gradient(135deg,#1a1a2ecc 0%,#0a0a0af2 100%);border:1px solid #667eea1a;border-radius:16px;height:280px;display:flex;position:relative;overflow:hidden}.skeleton-cover{background:linear-gradient(90deg,#3741514d 0%,#4b55634d 50%,#3741514d 100%) 0 0/200% 100%;flex-shrink:0;width:180px;animation:1.5s infinite shimmer}.skeleton-content{flex-direction:column;flex:1;gap:.75rem;padding:1rem;display:flex}.skeleton-badge{background:linear-gradient(90deg,#3741514d 0%,#4b55634d 50%,#3741514d 100%) 0 0/200% 100%;border-radius:10px;width:80px;height:20px;margin-left:auto;animation:1.5s infinite shimmer}.skeleton-title{background:linear-gradient(90deg,#3741514d 0%,#4b55634d 50%,#3741514d 100%) 0 0/200% 100%;border-radius:6px;width:85%;height:24px;animation:1.5s infinite shimmer}.skeleton-text{background:linear-gradient(90deg,#3741514d 0%,#4b55634d 50%,#3741514d 100%) 0 0/200% 100%;border-radius:4px;width:100%;height:14px;animation:1.5s infinite shimmer}.skeleton-text.short{width:60%}.skeleton-genres{gap:.5rem;margin-top:.5rem;display:flex}.skeleton-genre{background:linear-gradient(90deg,#3741514d 0%,#4b55634d 50%,#3741514d 100%) 0 0/200% 100%;border-radius:8px;width:70px;height:26px;animation:1.5s infinite shimmer}.skeleton-footer{border-top:1px solid #667eea1a;justify-content:space-between;align-items:center;margin-top:auto;padding-top:.75rem;display:flex}.skeleton-stars{background:linear-gradient(90deg,#3741514d 0%,#4b55634d 50%,#3741514d 100%) 0 0/200% 100%;border-radius:4px;width:120px;height:20px;animation:1.5s infinite shimmer}.skeleton-stats{background:linear-gradient(90deg,#3741514d 0%,#4b55634d 50%,#3741514d 100%) 0 0/200% 100%;border-radius:4px;width:100px;height:20px;animation:1.5s infinite shimmer}@keyframes shimmer{0%{background-position:-200% 0}to{background-position:200% 0}}