@import"https://fonts.googleapis.com/css2?family=Outfit:wght@300;400;500;600;700;800&display=swap";:root{--sp-1: 4px;--sp-2: 8px;--sp-3: 12px;--sp-4: 16px;--sp-5: 24px;--sp-6: 32px;--sp-7: 48px;--radius-sm: 8px;--radius-md: 12px;--radius-lg: 20px;--radius-xl: 28px;--radius-full: 999px;--fs-xs: 12px;--fs-sm: 14px;--fs-base: 16px;--fs-md: 18px;--fs-lg: 22px;--fs-xl: 26px;--fs-2xl: 34px;--ease: cubic-bezier(.25, 1, .5, 1);--ease-elastic: cubic-bezier(.68, -.6, .32, 1.6);--dur: .25s;--dur-slow: .4s;--topbar-h: 64px}[data-theme=dark]{--bg: #090a0f;--bg-grad: radial-gradient(circle at 50% -20%, rgba(139, 92, 246, .15) 0%, rgba(99, 102, 241, .08) 35%, rgba(9, 10, 15, 0) 70%), #090a0f;--bg-grid: rgba(255, 255, 255, .015);--surface: rgba(17, 19, 30, .75);--surface-2: rgba(26, 29, 46, .8);--surface-3: rgba(37, 41, 64, .85);--surface-solid: #11131e;--border: rgba(255, 255, 255, .08);--border-soft: rgba(255, 255, 255, .04);--border-glow: rgba(139, 92, 246, .3);--text: #f3f4f6;--text-soft: #cbd5e1;--muted: #64748b;--accent: #8b5cf6;--accent-gradient: linear-gradient(135deg, #a78bfa 0%, #7c3aed 100%);--accent-glow: rgba(139, 92, 246, .35);--accent-2: #6366f1;--accent-soft: rgba(139, 92, 246, .12);--success: #10b981;--success-soft: rgba(16, 185, 129, .12);--warning: #f5a623;--warning-soft: rgba(245, 166, 35, .14);--danger: #ef4444;--danger-soft: rgba(239, 68, 68, .12);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .4);--shadow-md: 0 12px 32px rgba(0, 0, 0, .5);--shadow-lg: 0 20px 48px rgba(0, 0, 0, .6), 0 0 40px rgba(139, 92, 246, .05);--glass-blur: blur(20px) saturate(190%)}[data-theme=light]{--bg: #f8fafc;--bg-grad: radial-gradient(circle at 50% -20%, rgba(224, 231, 255, .6) 0%, rgba(243, 232, 255, .4) 35%, rgba(248, 250, 252, 0) 70%), #f8fafc;--bg-grid: rgba(99, 102, 241, .015);--surface: rgba(255, 255, 255, .85);--surface-2: rgba(241, 245, 249, .9);--surface-3: rgba(226, 232, 240, .95);--surface-solid: #ffffff;--border: rgba(99, 102, 241, .08);--border-soft: rgba(99, 102, 241, .04);--border-glow: rgba(99, 102, 241, .2);--text: #0f172a;--text-soft: #475569;--muted: #94a3b8;--accent: #4f46e5;--accent-gradient: linear-gradient(135deg, #6366f1 0%, #4338ca 100%);--accent-glow: rgba(79, 70, 229, .2);--accent-2: #7c3aed;--accent-soft: rgba(79, 70, 229, .07);--success: #10b981;--success-soft: rgba(16, 185, 129, .12);--warning: #d97706;--warning-soft: rgba(217, 119, 6, .12);--danger: #dc2626;--danger-soft: rgba(220, 38, 38, .1);--shadow-sm: 0 2px 8px rgba(99, 102, 241, .03);--shadow-md: 0 12px 32px rgba(99, 102, 241, .06);--shadow-lg: 0 20px 48px rgba(99, 102, 241, .1);--glass-blur: blur(20px) saturate(170%)}*,*:before,*:after{box-sizing:border-box;margin:0;padding:0}html,body{height:100%}body{font-family:Outfit,-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Microsoft YaHei,sans-serif;background:var(--bg);background-image:var(--bg-grad);background-attachment:fixed;color:var(--text);font-size:var(--fs-base);line-height:1.6;-webkit-font-smoothing:antialiased;position:relative;overflow-x:hidden}body:before{content:"";position:fixed;top:0;right:0;bottom:0;left:0;z-index:-1;background-image:linear-gradient(var(--bg-grid) 1px,transparent 1px),linear-gradient(90deg,var(--bg-grid) 1px,transparent 1px);background-size:32px 32px;pointer-events:none;opacity:.8}#app{min-height:100vh;display:flex;flex-direction:column}button{font-family:inherit;cursor:pointer;border:none;background:none;color:inherit;outline:none}input,select,textarea{font-family:inherit;font-size:inherit;color:inherit;background:none;border:none;outline:none}a{color:var(--accent);text-decoration:none;transition:color var(--dur) var(--ease)}a:hover{color:var(--accent-2)}::-webkit-scrollbar{width:8px;height:8px}::-webkit-scrollbar-track{background:transparent}::-webkit-scrollbar-thumb{background:var(--border);border-radius:var(--radius-full)}::-webkit-scrollbar-thumb:hover{background:var(--border-glow)}.text-gradient{background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent;background-clip:text;font-weight:800}.topbar{position:sticky;top:0;z-index:40;height:var(--topbar-h);display:flex;align-items:center;justify-content:space-between;padding:0 var(--sp-5);background:var(--surface);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-bottom:1px solid var(--border);box-shadow:0 4px 20px #00000008}.brand{display:flex;align-items:center;gap:var(--sp-3);cursor:pointer;-webkit-user-select:none;user-select:none}.brand .logo-dot{width:12px;height:12px;border-radius:50%;background:var(--accent-gradient);box-shadow:0 0 12px var(--accent);position:relative}.brand .logo-dot:after{content:"";position:absolute;top:-3px;right:-3px;bottom:-3px;left:-3px;border-radius:50%;border:1px solid var(--accent);opacity:.4;animation:logo-pulse 2s infinite ease-out}@keyframes logo-pulse{0%{transform:scale(1);opacity:.5}to{transform:scale(2.2);opacity:0}}.brand h1{font-size:var(--fs-md);font-weight:800;letter-spacing:-.01em;background:var(--accent-gradient);-webkit-background-clip:text;-webkit-text-fill-color:transparent}.topbar-actions{display:flex;align-items:center;gap:var(--sp-2)}.icon-btn{display:inline-flex;align-items:center;justify-content:center;width:40px;height:40px;border-radius:var(--radius-md);color:var(--text-soft);background:transparent;border:1px solid transparent;transition:all var(--dur) var(--ease)}.icon-btn:hover{background:var(--surface-2);color:var(--text);border-color:var(--border);transform:translateY(-1px)}.icon-btn:active{transform:translateY(0)}.api-warn{display:flex;align-items:center;gap:var(--sp-2);padding:var(--sp-2) var(--sp-5);background:var(--warning-soft);color:var(--warning);font-size:var(--fs-sm);font-weight:500;border-bottom:1px solid var(--border-soft);animation:slide-down .4s var(--ease)}@keyframes slide-down{0%{transform:translateY(-100%)}to{transform:translateY(0)}}.player-bar{position:fixed;bottom:var(--sp-5);left:50%;transform:translate(-50%);width:calc(100% - 2 * var(--sp-5));max-width:960px;z-index:35;display:flex;align-items:center;gap:var(--sp-4);padding:var(--sp-3) var(--sp-5);background:var(--surface);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-lg);transition:all var(--dur-slow) var(--ease);animation:player-in .5s var(--ease)}@keyframes player-in{0%{transform:translate(-50%,40px);opacity:0}to{transform:translate(-50%);opacity:1}}.player-bar .player-info{min-width:0;flex-shrink:0;width:220px}.player-bar .player-now{font-size:var(--fs-xs);color:var(--muted);font-weight:600;text-transform:uppercase;letter-spacing:.08em}.player-bar .player-title{font-size:var(--fs-sm);font-weight:700;margin-top:2px;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.player-bar .player-controls{display:flex;align-items:center;gap:var(--sp-2);flex-shrink:0}.player-bar .play-trigger{width:44px;height:44px;border-radius:50%;display:flex;align-items:center;justify-content:center;background:var(--accent-gradient);color:#fff;box-shadow:0 4px 12px var(--accent-glow);transition:transform var(--dur) var(--ease-elastic),box-shadow var(--dur) var(--ease)}.player-bar .play-trigger:hover{transform:scale(1.1);box-shadow:0 6px 16px var(--accent-glow)}.player-bar .play-trigger:active{transform:scale(.93)}.player-bar .player-slider-container{display:flex;align-items:center;flex:1;min-width:100px}.player-bar .player-slider{width:100%;height:6px;border-radius:var(--radius-full);background:var(--surface-3);cursor:pointer;accent-color:var(--accent);transition:all var(--dur) var(--ease);outline:none;-webkit-appearance:none}.player-bar .player-slider::-webkit-slider-runnable-track{height:6px;border-radius:var(--radius-full)}.player-bar .player-slider::-webkit-slider-thumb{-webkit-appearance:none;width:14px;height:14px;border-radius:50%;background:#fff;border:3px solid var(--accent);margin-top:-4px;box-shadow:0 2px 6px #0003;transition:transform var(--dur) var(--ease)}.player-bar .player-slider:hover::-webkit-slider-thumb{transform:scale(1.2)}.player-bar .player-time-display{font-size:var(--fs-xs);color:var(--text-soft);font-variant-numeric:tabular-nums;font-weight:500;min-width:90px;text-align:right;flex-shrink:0}.player-bar .player-speed-control{display:flex;align-items:center;flex-shrink:0}.player-bar .player-speed-control select{background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-sm);color:var(--text-soft);padding:4px 10px 4px 8px;font-size:var(--fs-xs);font-weight:600;cursor:pointer;outline:none;transition:all var(--dur) var(--ease)}.player-bar .player-speed-control select:hover,.player-bar .player-speed-control select:focus{border-color:var(--accent);color:var(--text);background:var(--surface-3)}.app-main{max-width:960px;width:100%;margin:0 auto;padding:var(--sp-5) var(--sp-5) 130px;flex:1}.btn{display:inline-flex;align-items:center;justify-content:center;gap:var(--sp-2);padding:10px 20px;border-radius:var(--radius-md);font-size:var(--fs-sm);font-weight:700;background:var(--accent-gradient);background-size:200% auto;color:#fff;box-shadow:0 4px 14px var(--accent-glow);transition:background-position var(--dur) var(--ease),transform var(--dur) var(--ease-elastic),box-shadow var(--dur) var(--ease),opacity var(--dur) var(--ease)}.btn:hover{background-position:right center;transform:translateY(-2px);box-shadow:0 6px 20px var(--accent-glow)}.btn:active{transform:translateY(0) scale(.97)}.btn:disabled{opacity:.4;cursor:not-allowed;transform:none!important;box-shadow:none!important}.btn.ghost{background:var(--surface-2);color:var(--text-soft);border:1px solid var(--border);box-shadow:var(--shadow-sm)}.btn.ghost:hover{color:var(--text);background:var(--surface-3);border-color:var(--border-glow)}.btn.danger{background:linear-gradient(135deg,var(--danger) 0%,#b91c1c 100%);box-shadow:0 4px 12px #ef444433}.btn.danger:hover{box-shadow:0 6px 18px #ef444459}.btn.sm{padding:6px 12px;font-size:var(--fs-xs);border-radius:var(--radius-sm)}.card{background:var(--surface);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border);border-radius:var(--radius-lg);box-shadow:var(--shadow-sm)}.muted{color:var(--muted);font-size:var(--fs-sm)}.section-title{font-size:var(--fs-lg);font-weight:800;margin:var(--sp-6) 0 var(--sp-3);letter-spacing:-.02em}.upload-zone{border:2px dashed var(--border);border-radius:var(--radius-lg);background:#ffffff03;padding:var(--sp-6) var(--sp-5);text-align:center;transition:all var(--dur-slow) var(--ease);cursor:pointer;position:relative;overflow:hidden}.upload-zone:hover,.upload-zone.dragover{border-color:var(--accent);background:var(--accent-soft);box-shadow:0 0 24px #8b5cf60a}.upload-zone input[type=file]{display:none}.upload-zone svg{color:var(--text-soft);transition:transform var(--dur) var(--ease-elastic),color var(--dur) var(--ease)}.upload-zone:hover svg{color:var(--accent);transform:translateY(-4px) scale(1.1)}.book-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:var(--sp-5)}.book-card{background:var(--surface);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border);border-radius:var(--radius-lg);overflow:hidden;cursor:pointer;transition:transform var(--dur-slow) var(--ease),border-color var(--dur) var(--ease),box-shadow var(--dur-slow) var(--ease);display:flex;flex-direction:column}.book-card:hover{transform:translateY(-6px);border-color:var(--accent);box-shadow:var(--shadow-lg),0 0 24px var(--accent-glow)}.book-card .cover{position:relative;height:200px;padding:var(--sp-5) var(--sp-4) var(--sp-4) var(--sp-6);display:flex;flex-direction:column;justify-content:space-between;color:#fff;overflow:hidden;box-shadow:inset 0 -40px 60px #0006}.book-card .cover:after{content:"";position:absolute;right:0;top:0;bottom:0;width:4px;background:#ffffff26;box-shadow:-1px 0 3px #0000001a}.book-card .cover-title{font-size:var(--fs-md);font-weight:800;line-height:1.35;display:-webkit-box;-webkit-line-clamp:3;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 2px 6px rgba(0,0,0,.5)}.book-card .cover-author{font-size:var(--fs-xs);opacity:.9;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 3px rgba(0,0,0,.5)}.book-card .cover-spine{position:absolute;top:0;left:0;bottom:0;width:14px;background:linear-gradient(90deg,#ffffff40,#0000004d 45%,#0000001a 60%,#ffffff26);box-shadow:2px 0 5px #0006}.book-card .body{padding:var(--sp-4);display:flex;flex-direction:column;gap:var(--sp-2)}.book-card .meta-row{display:flex;align-items:center;justify-content:space-between;font-size:var(--fs-xs);color:var(--text-soft);gap:var(--sp-2)}.book-card .meta-row span{font-weight:600;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.book-card .meta-date{font-size:var(--fs-xs);color:var(--muted);font-weight:500}.progress-ring{--pct: 0;width:38px;height:38px;border-radius:50%;background:conic-gradient(var(--accent) calc(var(--pct) * 1%),var(--surface-3) 0);display:flex;align-items:center;justify-content:center;flex-shrink:0;position:relative;box-shadow:var(--shadow-sm)}.progress-ring:before{content:"";width:30px;height:30px;border-radius:50%;background:var(--surface-solid)}.progress-ring .pct-txt{position:absolute;font-size:10px;font-weight:800;color:var(--text)}.chapter-list{display:flex;flex-direction:column;gap:var(--sp-2)}.chapter-row{display:grid;grid-template-columns:28px 30px 1fr auto;gap:var(--sp-4);align-items:center;padding:var(--sp-3) var(--sp-4);background:var(--surface);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border);border-radius:var(--radius-md);transition:all var(--dur) var(--ease)}.chapter-row:hover{border-color:var(--accent);transform:translate(4px);background:var(--surface-2);box-shadow:0 4px 12px #00000005}.chapter-row .checkbox{display:flex;justify-content:center}.chapter-row .checkbox input{width:18px;height:18px;accent-color:var(--accent);cursor:pointer;border:2px solid var(--border);border-radius:4px;transition:all var(--dur) var(--ease)}.chapter-row .idx{color:var(--muted);font-variant-numeric:tabular-nums;font-weight:700;text-align:right;font-size:var(--fs-sm)}.chapter-row .ch-main{min-width:0}.chapter-row .ch-title{font-weight:700;font-size:var(--fs-sm);color:var(--text);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.chapter-row .ch-stage{font-size:var(--fs-xs);color:var(--muted);display:flex;align-items:center;gap:var(--sp-3);margin-top:4px}.chapter-row .stage-bar{flex:1;max-width:180px;height:5px;background:var(--surface-3);border-radius:var(--radius-full);overflow:hidden}.chapter-row .stage-fill{height:100%;background:var(--accent-gradient);border-radius:var(--radius-full);transition:width var(--dur) var(--ease)}.chapter-row .ch-actions{display:flex;align-items:center;gap:var(--sp-3);flex-shrink:0}.status-badge{display:inline-flex;align-items:center;gap:6px;font-size:var(--fs-xs);font-weight:700;padding:4px 10px;border-radius:var(--radius-full);white-space:nowrap;box-shadow:0 1px 3px #00000005}.status-badge .dot{width:6px;height:6px;border-radius:50%;background:currentColor}.status-pending{background:var(--surface-3);color:var(--muted)}.status-interpreting,.status-synthesizing,.status-retrying{background:var(--accent-soft);color:var(--accent);border:1px solid rgba(139,92,246,.15)}.status-interpreting .dot,.status-synthesizing .dot,.status-retrying .dot{animation:pulse-badge 1.5s infinite ease-in-out}.status-done{background:var(--success-soft);color:var(--success)}.status-error{background:var(--danger-soft);color:var(--danger)}@keyframes pulse-badge{0%,to{transform:scale(1);opacity:1}50%{transform:scale(1.3);opacity:.4}}.play-btn{width:38px;height:38px;border-radius:var(--radius-md);display:inline-flex;align-items:center;justify-content:center;background:var(--surface-2);color:var(--text-soft);border:1px solid var(--border);transition:all var(--dur) var(--ease)}.play-btn:hover{background:var(--accent);color:#fff;border-color:var(--accent);transform:scale(1.05)}.play-btn:active{transform:scale(.95)}.play-btn.playing{background:var(--accent);color:#fff;border-color:var(--accent)}.chapter-toolbar{display:flex;align-items:center;gap:var(--sp-4);margin:var(--sp-4) 0 var(--sp-3);font-size:var(--fs-sm);font-weight:600;flex-wrap:wrap}.chapter-toolbar label{display:flex;align-items:center;gap:var(--sp-2);cursor:pointer;-webkit-user-select:none;user-select:none}.chapter-toolbar input[type=checkbox]{width:18px;height:18px;accent-color:var(--accent);cursor:pointer}.book-detail-container{display:flex;flex-direction:column;gap:var(--sp-5)}.book-detail-hero{display:flex;gap:var(--sp-6);align-items:flex-start;flex-wrap:wrap;background:var(--surface);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border);border-radius:var(--radius-lg);padding:var(--sp-5);box-shadow:var(--shadow-md);position:relative}.book-hero-cover{position:relative;width:150px;height:210px;border-radius:var(--radius-md);padding:var(--sp-5) var(--sp-4) var(--sp-4) var(--sp-5);display:flex;flex-direction:column;justify-content:space-between;color:#fff;overflow:hidden;box-shadow:inset 0 -40px 60px #0006,var(--shadow-lg);flex-shrink:0}.book-hero-cover:after{content:"";position:absolute;right:0;top:0;bottom:0;width:4px;background:#ffffff26;box-shadow:-1px 0 3px #0000001a}.book-hero-cover .cover-title{font-size:var(--fs-sm);font-weight:800;line-height:1.35;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical;overflow:hidden;text-shadow:0 2px 6px rgba(0,0,0,.5)}.book-hero-cover .cover-author{font-size:11px;opacity:.9;font-weight:500;white-space:nowrap;overflow:hidden;text-overflow:ellipsis;text-shadow:0 1px 3px rgba(0,0,0,.5)}.book-hero-cover .cover-spine{position:absolute;top:0;left:0;bottom:0;width:12px;background:linear-gradient(90deg,#ffffff40,#0000004d 45%,#0000001a 60%,#ffffff26);box-shadow:1px 0 3px #0000004d}.book-hero-info{flex:1;min-width:280px;display:flex;flex-direction:column;gap:var(--sp-3)}.book-title-meta-row{display:flex;align-items:center;justify-content:flex-start;flex-wrap:wrap;gap:var(--sp-2);font-size:var(--fs-base);font-weight:700;color:var(--text);margin-bottom:var(--sp-2)}.book-title-meta-row .title-clickable{cursor:pointer;display:inline-flex;align-items:center;gap:6px;border-bottom:1px dashed transparent;transition:border-color var(--dur) var(--ease),color var(--dur) var(--ease)}.book-title-meta-row .title-clickable:hover{border-color:var(--border-glow);color:var(--accent)}.book-title-meta-row .inline-edit-icon{color:var(--muted);opacity:.6;transition:opacity var(--dur) var(--ease),color var(--dur) var(--ease)}.book-title-meta-row .title-clickable:hover .inline-edit-icon{opacity:1;color:var(--accent)}.book-title-meta-row .divider{color:var(--border)}.book-title-meta-row .author{color:var(--text-soft);font-weight:600}.title-edit-form{display:flex;flex-direction:column;gap:var(--sp-2);width:100%}.title-edit-input{width:100%;font-size:var(--fs-md);font-weight:700;padding:8px 12px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);transition:all var(--dur) var(--ease)}.title-edit-buttons{display:flex;justify-content:flex-end;gap:var(--sp-2)}.title-edit-input:focus{border-color:var(--accent);background:var(--surface-3);box-shadow:0 0 0 3px var(--accent-soft)}.book-hero-info .badge-row{display:flex;gap:var(--sp-2);flex-wrap:wrap}.book-hero-info .badge{font-size:var(--fs-xs);padding:4px 12px;border-radius:var(--radius-sm);background:var(--surface-3);color:var(--text-soft);font-weight:700;border:1px solid var(--border)}.book-hero-info .badge.success{background:var(--success-soft);color:var(--success);border-color:transparent}.book-hero-info .badge.danger{background:var(--danger-soft);color:var(--danger);border-color:transparent}.book-hero-info .progress-section{display:flex;flex-direction:column;gap:var(--sp-2);margin:var(--sp-2) 0;padding:var(--sp-4);background:var(--surface-2);border-radius:var(--radius-md);border:1px solid var(--border-soft)}.book-hero-info .progress-label{display:flex;justify-content:space-between;font-size:var(--fs-xs);font-weight:800;color:var(--text-soft)}.book-hero-info .progress-bar{height:8px;background:var(--surface-3);border-radius:var(--radius-full);overflow:hidden}.book-hero-info .progress-bar .fill{height:100%;background:linear-gradient(90deg,var(--accent),var(--success));border-radius:var(--radius-full);transition:width .5s var(--ease)}.book-hero-info .muted-status{font-size:var(--fs-xs);color:var(--muted);font-weight:500}.book-actions{display:flex;gap:var(--sp-2);flex-wrap:wrap;margin-top:var(--sp-1)}.drawer-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#0006;backdrop-filter:blur(4px);-webkit-backdrop-filter:blur(4px);z-index:50;opacity:0;transition:opacity .3s var(--ease);pointer-events:none}.drawer-backdrop.open{opacity:1;pointer-events:auto}.drawer{position:fixed;top:0;right:0;bottom:0;width:440px;max-width:90vw;background:var(--surface);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border-left:1px solid var(--border);box-shadow:var(--shadow-lg);z-index:51;display:flex;flex-direction:column;transform:translate(100%);transition:transform .35s cubic-bezier(.16,1,.3,1)}.drawer.open{transform:translate(0)}.drawer-head{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--border)}.drawer-head h3{font-size:var(--fs-md);font-weight:800;letter-spacing:-.01em}.drawer-body{flex:1;overflow-y:auto;padding:var(--sp-5)}.drawer-section{margin-bottom:var(--sp-6)}.drawer-section h4{font-size:var(--fs-xs);font-weight:800;color:var(--accent);margin-bottom:var(--sp-4);text-transform:uppercase;letter-spacing:.1em}.field{margin-bottom:var(--sp-4)}.field label{display:block;font-size:var(--fs-sm);font-weight:600;margin-bottom:var(--sp-2);color:var(--text-soft)}.field input[type=range]{width:100%;accent-color:var(--accent)}.field select,.field input[type=number]{width:100%;padding:10px 14px;background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);color:var(--text);font-weight:500;transition:all var(--dur) var(--ease)}.field select:focus,.field input[type=number]:focus{border-color:var(--accent);background:var(--surface-3);box-shadow:0 0 0 3px var(--accent-soft)}.voice-grid{display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2)}.voice-card{display:flex;align-items:center;justify-content:space-between;padding:var(--sp-2) var(--sp-3);background:var(--surface-2);border:1px solid var(--border);border-radius:var(--radius-md);cursor:pointer;transition:all var(--dur) var(--ease)}.voice-card:hover{border-color:var(--accent-glow);transform:translateY(-1px)}.voice-card.selected{border-color:var(--accent);background:var(--accent-soft)}.voice-card .name{font-size:var(--fs-xs);font-weight:700}.voice-card .preview-btn{width:28px;height:28px;border-radius:50%;background:var(--surface-3);display:flex;align-items:center;justify-content:center;color:var(--text-soft);transition:all var(--dur) var(--ease)}.voice-card .preview-btn:hover{background:var(--accent);color:#fff;transform:scale(1.08)}.modal-backdrop{position:fixed;top:0;right:0;bottom:0;left:0;background:#00000080;backdrop-filter:blur(5px);-webkit-backdrop-filter:blur(5px);z-index:60;display:flex;align-items:center;justify-content:center;padding:var(--sp-4);opacity:0;transition:opacity .3s var(--ease);pointer-events:none}.modal-backdrop.open{opacity:1;pointer-events:auto}.modal{background:var(--surface);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border);border-radius:var(--radius-lg);width:100%;max-width:680px;max-height:85vh;display:flex;flex-direction:column;box-shadow:var(--shadow-lg);transform:scale(.93);transition:transform .35s cubic-bezier(.34,1.56,.64,1)}.modal.open{transform:scale(1)}.modal-head{display:flex;justify-content:space-between;align-items:center;padding:var(--sp-4) var(--sp-5);border-bottom:1px solid var(--border)}.modal-head h3{font-size:var(--fs-md);font-weight:800;letter-spacing:-.01em}.modal-body{padding:var(--sp-5);overflow-y:auto}.script-summary{color:var(--text-soft);font-size:var(--fs-sm);font-weight:500;padding:var(--sp-3) var(--sp-4);background:var(--surface-2);border-radius:var(--radius-md);margin-bottom:var(--sp-5);border-left:3px solid var(--accent)}.turn{margin-bottom:var(--sp-5);position:relative;display:flex;flex-direction:column;gap:var(--sp-1);width:100%}.turn .speaker{font-size:var(--fs-xs);font-weight:800;text-transform:uppercase;letter-spacing:.08em;margin-bottom:2px}.turn.speaker-a .speaker{color:var(--accent)}.turn.speaker-b .speaker{color:var(--success);text-align:right;width:100%}.turn .speech-bubble{padding:12px 16px;border-radius:4px var(--radius-md) var(--radius-md) var(--radius-md);line-height:1.6;font-size:var(--fs-base);background:var(--surface-2);border:1px solid var(--border);max-width:85%;align-self:flex-start}.turn.speaker-b{align-items:flex-end}.turn.speaker-b .speech-bubble{border-radius:var(--radius-md) 4px var(--radius-md) var(--radius-md);background:#10b98108;border-color:#10b9811a;align-self:flex-end}.toast{position:fixed;top:calc(var(--topbar-h) + var(--sp-4));left:50%;transform:translate(-50%);z-index:80;padding:12px 24px;border-radius:var(--radius-md);font-size:var(--fs-sm);font-weight:700;box-shadow:var(--shadow-lg);backdrop-filter:var(--glass-blur);-webkit-backdrop-filter:var(--glass-blur);border:1px solid var(--border);animation:toast-top-in var(--dur) cubic-bezier(.175,.885,.32,1.275)}.toast.info{background:var(--surface-3);color:var(--text)}.toast.success{background:linear-gradient(135deg,var(--success) 0%,#047857 100%);color:#fff;border-color:#10b98133}.toast.error{background:linear-gradient(135deg,var(--danger) 0%,#b91c1c 100%);color:#fff;border-color:#ef444433}@keyframes toast-top-in{0%{opacity:0;transform:translate(-50%,-20px) scale(.95)}to{opacity:1;transform:translate(-50%) scale(1)}}.empty-state{text-align:center;padding:var(--sp-7) var(--sp-4);color:var(--muted)}.empty-state .icon{margin-bottom:var(--sp-4);color:var(--muted);opacity:.6}.empty-state p{font-size:var(--fs-base);font-weight:600}.skeleton{background:linear-gradient(90deg,var(--surface-2) 25%,var(--surface-3) 50%,var(--surface-2) 75%);background-size:200% 100%;animation:shimmer 1.5s infinite linear;border-radius:var(--radius-md)}@keyframes shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}@media (min-width: 900px){body:has(.book-detail-container){overflow:visible}body:has(.book-detail-container) .app-main{height:auto;padding:var(--sp-5) var(--sp-5) 100px;overflow:visible}.book-detail-container{display:grid;grid-template-columns:320px 1fr;gap:var(--sp-6);align-items:start;height:auto;overflow:visible}.book-detail-hero{position:sticky;top:calc(var(--topbar-h) + var(--sp-5));flex-direction:column;flex-wrap:nowrap;align-items:center;text-align:center;width:100%;gap:var(--sp-4);background:transparent;backdrop-filter:none;-webkit-backdrop-filter:none;border:none;box-shadow:none;padding:0;max-height:none;overflow:visible}.book-hero-cover{width:160px;height:224px}.book-hero-info{align-items:center;width:100%;text-align:center}.book-title-meta-row,.book-hero-info .badge-row{justify-content:center}.book-hero-info .progress-section{width:100%}.book-actions{width:100%;display:flex;flex-direction:row;flex-wrap:nowrap;align-items:center;gap:var(--sp-1);margin-top:var(--sp-2)}.book-actions .btn{flex:1;padding:8px 4px;font-size:var(--fs-xs);gap:4px;white-space:nowrap;justify-content:center}.book-detail-main{min-width:0;display:flex;flex-direction:column;gap:var(--sp-4);height:auto;overflow:visible}.chapter-list{flex:none;overflow:visible;padding-right:0;padding-bottom:0}}@media (max-width: 720px){.app-main{padding:var(--sp-4) var(--sp-3) 95px}.topbar{padding:0 var(--sp-4)}.brand h1{font-size:var(--fs-base)}.player-bar{width:calc(100% - 2 * var(--sp-3));bottom:var(--sp-3);left:50%;transform:translate(-50%);flex-wrap:nowrap;height:64px;padding:0 var(--sp-4);gap:var(--sp-3);box-shadow:var(--shadow-lg);overflow:visible}.player-bar .player-info{width:auto;flex:1;min-width:0}.player-bar .player-now{display:none}.player-bar .player-title{font-size:var(--fs-xs);margin-top:0}.player-bar .player-controls{gap:0;flex-shrink:0}.player-bar .player-controls .icon-btn{display:none}.player-bar .play-trigger{width:38px;height:38px}.player-bar .player-time-display{display:none}.player-bar .player-slider-container{position:absolute;top:-6px;left:0;right:0;width:100%;height:12px;padding:0;margin:0;flex:none;overflow:visible}.player-bar .player-slider{position:absolute;top:0;left:0;width:100%;height:100%;border-radius:0;background:transparent;background-image:linear-gradient(to bottom,transparent 4px,var(--surface-3) 4px,var(--surface-3) 7px,transparent 7px);outline:none;-webkit-appearance:none;margin:0;padding:0}.player-bar .player-slider::-webkit-slider-thumb{width:10px;height:10px;border-radius:50%;border:2px solid var(--accent);background:#fff;box-shadow:0 1px 3px #0000004d;margin-top:1px;-webkit-appearance:none}.player-bar .player-speed-control{margin-left:0}.player-bar .player-speed-control select{padding:2px 6px;font-size:11px}.book-detail-hero{flex-direction:column;align-items:center;text-align:center;gap:var(--sp-4)}.book-hero-info{align-items:center;width:100%}.book-hero-info .badge-row{justify-content:center}.book-hero-info .progress-section{width:100%}.book-actions{width:100%;display:grid;grid-template-columns:1fr 1fr;gap:var(--sp-2);margin-top:var(--sp-2)}.book-actions .btn{width:100%;padding:10px 8px;font-size:var(--fs-xs);gap:6px;white-space:nowrap;justify-content:center}}@media (max-width: 560px){.chapter-row{grid-template-columns:28px 24px 1fr;grid-template-areas:"cb idx main" "actions actions actions";row-gap:var(--sp-3)}.chapter-row .checkbox{grid-area:cb}.chapter-row .idx{grid-area:idx}.chapter-row .ch-main{grid-area:main}.chapter-row .ch-actions{grid-area:actions;justify-content:flex-start;padding-left:calc(28px + 24px + 2 * var(--sp-4))}.chapter-row .ch-title{white-space:normal}.player-bar .icon-btn{display:none}.book-grid{grid-template-columns:1fr 1fr;gap:var(--sp-3)}.book-card .cover{height:170px}}@media (prefers-reduced-motion: reduce){*,*:before,*:after{animation-duration:.01ms!important;transition-duration:.01ms!important}}button:focus-visible,input:focus-visible,select:focus-visible,textarea:focus-visible,[role=button]:focus-visible{outline:2px solid var(--accent);outline-offset:2px}
