:root{--background: 0 0% 98%;--foreground: 220 15% 13%;--card: 0 0% 100% / .75;--muted: 220 10% 94%;--muted-foreground: 220 8% 50%;--border: 220 10% 90%;--sage: 152 44% 42%;--sage-dim: 152 44% 42% / .08;--sage-glow: 152 44% 42% / .15;--terra: 220 12% 55%;--terra-dim: 220 12% 55% / .08;--glass-border: 0 0% 100% / .6;--glass-bg: 0 0% 100% / .65;--glass-bg-hover: 0 0% 100% / .9;--shadow-card: 0 1px 3px 0 hsl(220 15% 13% / .03), 0 4px 16px -2px hsl(220 15% 13% / .05);--shadow-card-hover: 0 4px 24px -4px hsl(220 15% 13% / .08), 0 1px 4px 0 hsl(220 15% 13% / .03);--shadow-sage: 0 4px 24px -4px hsl(152 44% 42% / .25);--shadow-book: 4px 4px 16px -2px hsl(220 15% 13% / .1), 0 1px 3px 0 hsl(220 15% 13% / .04);--radius: .875rem;--r-sm: 8px;--r-md: 14px;--r-lg: 20px;--r-xl: 28px;--r-full: 9999px}.dark{--background: 228 12% 8%;--foreground: 220 10% 92%;--card: 228 12% 11% / .75;--muted: 228 10% 16%;--muted-foreground: 220 8% 55%;--border: 228 10% 16%;--glass-bg: 228 12% 12% / .65;--glass-bg-hover: 228 12% 14% / .9;--glass-border: 0 0% 100% / .08;--shadow-card: 0 1px 3px 0 hsl(0 0% 0% / .2), 0 4px 16px -2px hsl(0 0% 0% / .25)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}body{font-family:Inter,system-ui,-apple-system,sans-serif;background:hsl(var(--background));color:hsl(var(--foreground));min-height:100dvh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}.pwa-header{position:sticky;top:0;z-index:100;padding:12px 16px;background:hsl(var(--background) / .85);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px);border-bottom:1px solid hsl(var(--border))}.glass-card{background:hsl(var(--glass-bg));border:1px solid hsl(var(--glass-border));box-shadow:var(--shadow-card),inset 0 1px hsl(var(--glass-border));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);border-radius:var(--r-md);transition:all .25s cubic-bezier(.4,0,.2,1)}.glass-card:hover{background:hsl(var(--glass-bg-hover));box-shadow:var(--shadow-card-hover),inset 0 1px hsl(var(--glass-border))}.btn-primary{border-radius:var(--r-full);font-weight:600;font-size:13px;background:linear-gradient(180deg,#3fab79,#368c64);color:#fff;box-shadow:var(--shadow-sage),inset 0 1px #54c08d66;transition:all .2s cubic-bezier(.34,1.56,.64,1);border:none;cursor:pointer;display:inline-flex;align-items:center;justify-content:center;padding:10px 20px}.btn-primary:hover{transform:translateY(-1px)}.btn-primary:active{transform:scale(.97)}.btn-ghost{border-radius:var(--r-full);font-size:13px;font-weight:500;background:hsl(var(--glass-bg));border:1px solid hsl(var(--glass-border));box-shadow:0 1px 2px #1c1f2605,inset 0 1px #ffffff80;cursor:pointer;transition:all .2s ease;display:inline-flex;align-items:center;justify-content:center;padding:8px 16px}.btn-ghost:hover{background:hsl(var(--glass-bg-hover))}.input-modern{width:100%;font-size:14px;padding:14px 16px;border-radius:12px;background:#fff9;border:1px solid hsl(0 0% 0% / .06);box-shadow:inset 0 1px 3px #00000008;transition:all .2s ease;outline:none;color:hsl(var(--foreground));font-family:inherit}.input-modern:focus{background:#ffffffd9;border-color:hsl(var(--sage-glow));box-shadow:0 0 0 3px hsl(var(--sage-dim)),inset 0 1px 3px #00000005}.icon-box{display:flex;align-items:center;justify-content:center;border-radius:12px;background:linear-gradient(135deg,hsl(var(--sage-dim)),#3c9a6e0a);border:1px solid hsl(152 44% 42% / .08)}.badge{padding:3px 10px;border-radius:var(--r-full);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em;display:inline-block}.badge-wishlist{background:hsl(var(--terra-dim));color:hsl(var(--terra));border:1px solid hsl(220 12% 55% / .1);padding:3px 10px;border-radius:var(--r-full);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.badge-reading{background:hsl(var(--sage-dim));color:hsl(var(--sage));border:1px solid hsl(152 44% 42% / .1);padding:3px 10px;border-radius:var(--r-full);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.badge-read{background:hsl(var(--muted));color:hsl(var(--muted-foreground));border:1px solid transparent;padding:3px 10px;border-radius:var(--r-full);font-size:10px;font-weight:600;text-transform:uppercase;letter-spacing:.04em}.chip{padding:6px 14px;border-radius:var(--r-full);font-size:12px;font-weight:500;cursor:pointer;transition:all .2s ease;background:hsl(var(--glass-bg));border:1px solid hsl(var(--glass-border));color:hsl(var(--foreground));display:inline-flex;align-items:center;gap:6px}.chip-active{background:linear-gradient(180deg,#3fab79,#368c64);color:#fff;border-color:transparent;box-shadow:var(--shadow-sage);transform:scale(1.02)}.book-card{display:flex;gap:16px;padding:16px;border-radius:var(--r-md);background:hsl(var(--glass-bg));border:1px solid hsl(var(--glass-border));box-shadow:var(--shadow-card),inset 0 1px hsl(var(--glass-border));backdrop-filter:blur(16px);-webkit-backdrop-filter:blur(16px);transition:all .25s cubic-bezier(.4,0,.2,1)}.book-card:hover{background:hsl(var(--glass-bg-hover));box-shadow:var(--shadow-card-hover),inset 0 1px hsl(var(--glass-border))}.book-cover{width:60px;height:88px;border-radius:6px;object-fit:cover;flex-shrink:0;box-shadow:var(--shadow-book);background:hsl(var(--muted))}.grain:before{content:"";position:fixed;inset:0;pointer-events:none;z-index:9999;opacity:.015;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 256 256' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='0.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)'/%3E%3C/svg%3E");background-repeat:repeat;background-size:200px}@keyframes slide-up{0%{opacity:0;transform:translateY(12px)}to{opacity:1;transform:translateY(0)}}@keyframes scale-in{0%{opacity:0;transform:scale(.94)}to{opacity:1;transform:scale(1)}}@keyframes fade-in{0%{opacity:0}to{opacity:1}}.animate-slide-up{animation:slide-up .3s cubic-bezier(.4,0,.2,1) both}.animate-scale-in{animation:scale-in .25s cubic-bezier(.34,1.56,.64,1) both}.animate-fade-in{animation:fade-in .25s ease both}.safe-bottom{padding-bottom:env(safe-area-inset-bottom,0px)}.safe-top{padding-top:env(safe-area-inset-top,0px)}.scrollbar-hide{-ms-overflow-style:none;scrollbar-width:none}.scrollbar-hide::-webkit-scrollbar{display:none}.flex-col-center{display:flex;flex-direction:column;align-items:center}.spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.font-display{font-family:Newsreader,Georgia,serif}.hidden{display:none!important}.user-menu-dropdown{position:absolute;top:calc(100% + 8px);right:0;min-width:220px;background:hsl(var(--background));border:1px solid hsl(var(--border));border-radius:var(--r-md);box-shadow:0 8px 32px -4px #1c1f261f,0 2px 8px -2px #1c1f260f;z-index:200;overflow:hidden}.user-menu-header{padding:12px 16px;border-bottom:1px solid hsl(var(--border));display:flex;flex-direction:column;gap:2px}.user-menu-name{font-size:13px;font-weight:600;color:hsl(var(--foreground));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-menu-email{font-size:11px;color:hsl(var(--muted-foreground));white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.user-menu-section{padding:4px 0;border-bottom:1px solid hsl(var(--border))}.user-menu-section:last-child{border-bottom:none}.user-menu-item{display:flex;align-items:center;gap:10px;width:100%;padding:10px 16px;font-size:13px;font-weight:500;color:hsl(var(--foreground));background:none;border:none;cursor:pointer;text-align:left;text-decoration:none;transition:background .15s ease}.user-menu-item:hover{background:hsl(var(--muted))}.user-menu-item--logout{color:hsl(var(--muted-foreground))}.user-menu-item--logout:hover{color:hsl(var(--foreground))}.sidebar-overlay{position:fixed;inset:0;background:#1c1f2666;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:300}.book-sidebar{position:fixed;bottom:0;left:0;right:0;max-height:92dvh;background:hsl(var(--background));border-radius:var(--r-xl) var(--r-xl) 0 0;border-top:1px solid hsl(var(--border));z-index:400;flex-direction:column;overflow-y:auto;overscroll-behavior:contain;padding:24px 20px env(safe-area-inset-bottom,16px);animation:slide-up .3s cubic-bezier(.4,0,.2,1) both}@media(min-width:640px){.book-sidebar{inset:0 0 0 auto;width:360px;max-height:100dvh;border-radius:0;border-top:none;border-left:1px solid hsl(var(--border));animation:slide-in-right .3s cubic-bezier(.4,0,.2,1) both}}@keyframes slide-in-right{0%{transform:translate(100%);opacity:0}to{transform:translate(0);opacity:1}}.sidebar-close{position:absolute;top:16px;right:16px;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:hsl(var(--muted));border:none;border-radius:var(--r-full);cursor:pointer;color:hsl(var(--muted-foreground));transition:background .2s ease;flex-shrink:0}.sidebar-close:hover{background:hsl(var(--border))}.sidebar-cover-wrap{display:flex;justify-content:center;margin-bottom:20px;margin-top:8px}.sidebar-cover-img{width:100px;height:148px;object-fit:cover;border-radius:8px;box-shadow:var(--shadow-book)}.sidebar-meta{margin-bottom:20px}.sidebar-meta h2{font-size:18px;font-weight:600;line-height:1.3;letter-spacing:-.02em;margin-bottom:4px}.sidebar-meta p{font-size:13px;color:hsl(var(--muted-foreground))}.sidebar-fields{display:flex;flex-direction:column;gap:0;margin-bottom:16px}.sidebar-field{padding:14px 0;border-bottom:1px solid hsl(var(--border));display:flex;flex-direction:column;gap:10px}.sidebar-field:last-child{border-bottom:none}.sidebar-label{font-size:11px;font-weight:600;text-transform:uppercase;letter-spacing:.06em;color:hsl(var(--muted-foreground))}.sidebar-note{width:100%;font-size:13px;padding:12px;border-radius:var(--r-sm);background:hsl(var(--muted));border:1px solid hsl(var(--border));color:hsl(var(--foreground));font-family:inherit;resize:vertical;outline:none;transition:border-color .2s ease}.sidebar-note:focus{border-color:hsl(var(--sage));box-shadow:0 0 0 3px hsl(var(--sage-dim))}.sidebar-delete{width:100%;padding:12px;margin-top:8px;border-radius:var(--r-sm);background:none;border:1px solid hsl(0 70% 60% / .3);color:#d74242;font-size:13px;font-weight:500;cursor:pointer;transition:all .2s ease}.sidebar-delete:hover{background:#e0525214;border-color:#e0525280}.sidebar-genres{display:flex;flex-wrap:wrap;gap:6px}.format-toggle{display:flex;gap:6px;flex-wrap:wrap}.format-btn{display:inline-flex;align-items:center;gap:5px;padding:6px 12px;font-size:12px;font-weight:500;border-radius:var(--r-full);border:1px solid hsl(var(--border));background:hsl(var(--muted));color:hsl(var(--muted-foreground));cursor:pointer;transition:all .2s ease}.format-btn.active{background:hsl(var(--sage-dim));border-color:hsl(var(--sage) / .3);color:hsl(var(--sage))}.status-toggle{display:flex;gap:6px;flex-wrap:wrap}.status-btn{padding:6px 12px;font-size:12px;font-weight:500;border-radius:var(--r-full);border:1px solid hsl(var(--border));background:hsl(var(--muted));color:hsl(var(--muted-foreground));cursor:pointer;transition:all .2s ease}.status-btn.active{background:hsl(var(--sage-dim));border-color:hsl(var(--sage) / .3);color:hsl(var(--sage))}.star-rating{display:flex;gap:4px}.star{font-size:22px;cursor:pointer;color:hsl(var(--border));transition:color .15s ease;-webkit-user-select:none;user-select:none;line-height:1}.star.active{color:hsl(var(--terra))}.tag-editor{display:flex;flex-wrap:wrap;gap:6px;align-items:center}.book-tag{display:inline-flex;align-items:center;gap:4px;padding:3px 8px 3px 10px;border-radius:var(--r-full);background:hsl(var(--sage-dim));border:1px solid hsl(var(--sage) / .15);color:hsl(var(--sage));font-size:11px;font-weight:500}.book-category-tag{display:inline-flex;align-items:center;padding:3px 10px;border-radius:var(--r-full);background:hsl(var(--terra-dim));border:1px solid hsl(220 12% 55% / .1);color:hsl(var(--terra));font-size:11px;font-weight:500}.tag-remove-btn{background:none;border:none;cursor:pointer;padding:0;font-size:13px;line-height:1;color:hsl(var(--sage) / .6);display:flex;align-items:center}.tag-remove-btn:hover{color:hsl(var(--sage))}.tag-input-wrap{display:flex}.tag-input{font-size:12px;padding:3px 8px;border-radius:var(--r-full);border:1px dashed hsl(var(--border));background:transparent;color:hsl(var(--foreground));outline:none;width:120px;font-family:inherit}.tag-input:focus{border-color:hsl(var(--sage))}.modal-overlay{position:fixed;inset:0;background:#1c1f2680;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:500;align-items:center;justify-content:center;padding:24px}.modal{background:hsl(var(--background));border:1px solid hsl(var(--border));border-radius:var(--r-lg);padding:24px;max-width:360px;width:100%;box-shadow:0 8px 32px -4px #1c1f2629;animation:scale-in .2s cubic-bezier(.34,1.56,.64,1) both}.modal h3{font-size:16px;font-weight:600;margin-bottom:8px;letter-spacing:-.01em}.modal p{font-size:13px;color:hsl(var(--muted-foreground));line-height:1.6;margin-bottom:20px}.modal-actions{display:flex;gap:8px;justify-content:flex-end}.dark .input-modern{background:#1f212899;border-color:#2e3038;color:hsl(var(--foreground))}.dark .input-modern:focus{background:#24262ed9}.dark .sidebar-note{background:#1b1c22;border-color:hsl(var(--border))}.dark .tag-input{border-color:hsl(var(--border))}.dark .user-menu-dropdown{box-shadow:0 8px 32px -4px #0006,0 2px 8px -2px #0003}#header-actions{position:relative;display:flex;align-items:center}.import-upload-zone{border:2px dashed hsl(var(--border));border-radius:var(--r-md);padding:40px 20px;text-align:center;margin:20px 0;transition:all .2s ease;cursor:pointer}.import-upload-zone:hover{border-color:hsl(var(--sage));background:hsl(var(--sage-dim))}.import-upload-zone label{display:flex;flex-direction:column;align-items:center;gap:12px;cursor:pointer;width:100%}.import-upload-zone svg{color:hsl(var(--sage))}.import-progress{margin:20px 0}.progress-bar-wrap{height:8px;background:hsl(var(--muted));border-radius:4px;overflow:hidden;margin-bottom:12px}.progress-bar{height:100%;background:hsl(var(--sage));width:0%;transition:width .3s ease}#import-status-text{font-size:13px;color:hsl(var(--muted-foreground));text-align:center}.buy-btn:hover{background:hsl(var(--muted))!important;border-color:hsl(var(--sage))!important;color:hsl(var(--sage))!important;transform:translateY(-1px);box-shadow:0 2px 8px #0000000d}.buy-btn:active{transform:translateY(0)}.fab-add{position:fixed;bottom:calc(24px + env(safe-area-inset-bottom,0px));right:24px;width:56px;height:56px;border-radius:28px;background:linear-gradient(180deg,#3fab79,#3c9a6e);color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:0 4px 20px #3c9a6e59,inset 0 1px #fff3;border:none;cursor:pointer;z-index:100;transition:all .3s cubic-bezier(.34,1.56,.64,1);text-decoration:none}.fab-add:hover{transform:translateY(-2px) scale(1.05);box-shadow:0 6px 24px #3c9a6e73}.fab-add:active{transform:scale(.95)}.header-add-btn{width:32px;height:32px;border-radius:8px;display:flex;align-items:center;justify-content:center;color:hsl(var(--sage));background:hsl(var(--sage-dim));border:1px solid hsl(var(--sage) / .1);cursor:pointer;transition:all .2s ease;margin-right:8px;text-decoration:none}.header-add-btn:hover{background:hsl(var(--sage-glow));border-color:hsl(var(--sage) / .2)}@media(min-width:640px){.fab-add{display:none}}.install-guide{margin-top:16px;margin-bottom:24px;padding:24px;background:hsl(var(--sage-dim));border:1px solid hsl(var(--sage) / .1);border-radius:var(--r-lg);text-align:left;animation:slide-up .5s cubic-bezier(.4,0,.2,1) both}.install-guide h3{font-size:15px;font-weight:600;color:hsl(var(--sage));margin-bottom:12px;display:flex;align-items:center;gap:8px}.install-guide p{font-size:13px;color:hsl(var(--foreground));margin-bottom:16px;line-height:1.5}.install-guide ol{margin:0;padding-left:18px;display:flex;flex-direction:column;gap:8px}.install-guide li{font-size:13px;color:hsl(var(--foreground) / .8);line-height:1.4}.install-guide li b{color:hsl(var(--foreground));font-weight:600}
