.sidebar{width:240px;background:linear-gradient(180deg,#fff,#f8fafc);border-right:1px solid #e5e7eb;display:flex;flex-direction:column;height:100vh;overflow-y:auto;overflow-x:hidden;box-shadow:2px 0 8px #0000000a;position:relative;transition:transform .3s ease;z-index:1000}.sidebar-header{padding:20px 16px;border-bottom:1px solid #e5e7eb;background:#fff;position:sticky;top:0;z-index:10;box-shadow:0 2px 4px #00000005;display:flex;align-items:center;justify-content:space-between}.sidebar-close-btn{display:none;width:32px;height:32px;background:#f3f4f6;border:1px solid #e5e7eb;border-radius:6px;cursor:pointer;font-size:20px;color:#374151;align-items:center;justify-content:center;transition:all .2s;flex-shrink:0}.sidebar-close-btn:hover{background:#e5e7eb;color:#111827}.logo{display:flex;align-items:center;gap:10px;cursor:pointer;padding:8px 12px;border-radius:8px;transition:all .3s ease;-webkit-user-select:none;user-select:none}.logo:hover{background:linear-gradient(135deg,#667eea,#764ba2);transform:translate(2px)}.logo:hover .logo-icon{transform:scale(1.1) rotate(5deg)}.logo:hover .logo-text{color:#fff;font-weight:600}.logo-icon{font-size:24px;transition:all .3s ease;filter:drop-shadow(0 2px 4px rgba(0,0,0,.1))}.logo-text{font-size:18px;font-weight:600;color:#1f2937;transition:all .3s ease;letter-spacing:.5px}.sidebar-nav{flex:1;padding:16px 8px;display:flex;flex-direction:column;gap:4px}.nav-item{display:flex;align-items:center;gap:12px;padding:12px 16px;margin:0 8px;border-radius:10px;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);color:#4b5563;font-size:15px;font-weight:500;position:relative;overflow:hidden;-webkit-user-select:none;user-select:none}.nav-item:before{content:"";position:absolute;left:0;top:0;width:3px;height:100%;background:linear-gradient(180deg,#667eea,#764ba2);transform:scaleY(0);transition:transform .3s ease;border-radius:0 3px 3px 0}.nav-item:hover{background:linear-gradient(135deg,#f3f4f6,#e5e7eb);color:#1f2937;transform:translate(4px);box-shadow:0 2px 8px #667eea26}.nav-item:hover:before{transform:scaleY(1)}.nav-item:hover .nav-icon{transform:scale(1.15);filter:drop-shadow(0 2px 4px rgba(102,126,234,.3))}.nav-item.active{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;font-weight:600;box-shadow:0 4px 12px #667eea4d;transform:translate(4px)}.nav-item.active:before{transform:scaleY(1);background:#fff;width:4px;box-shadow:0 0 8px #ffffff80}.nav-item.active .nav-icon{transform:scale(1.2);filter:drop-shadow(0 2px 6px rgba(255,255,255,.5))}.nav-item.active .nav-label{color:#fff;text-shadow:0 1px 2px rgba(0,0,0,.1)}.nav-icon{font-size:20px;line-height:1;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;align-items:center;justify-content:center;width:28px;height:28px;flex-shrink:0}.nav-label{flex:1;transition:all .3s ease;letter-spacing:.3px}.sidebar::-webkit-scrollbar{width:6px}.sidebar::-webkit-scrollbar-track{background:#f1f5f9;border-radius:3px}.sidebar::-webkit-scrollbar-thumb{background:linear-gradient(180deg,#cbd5e1,#94a3b8);border-radius:3px;transition:background .3s ease}.sidebar::-webkit-scrollbar-thumb:hover{background:linear-gradient(180deg,#94a3b8,#64748b)}@media (max-width: 768px){.sidebar{position:fixed;top:0;left:0;width:280px;max-width:85vw;height:100vh;transform:translate(-100%);box-shadow:4px 0 16px #0003;z-index:1000}.sidebar.mobile-open{transform:translate(0)}.sidebar-header{padding:16px 12px}.sidebar-close-btn{display:flex}.logo{flex:1}.logo-text{font-size:16px}.nav-item{padding:14px 16px;font-size:15px;margin:0 8px;min-height:48px}.nav-icon{font-size:20px;width:28px;height:28px}}@media (max-width: 480px){.sidebar{width:260px;max-width:90vw}.nav-item{padding:12px 14px;font-size:14px}.nav-icon{font-size:18px;width:24px;height:24px}.logo-text{font-size:15px}}@keyframes slideIn{0%{opacity:0;transform:translate(-10px)}to{opacity:1;transform:translate(0)}}.nav-item{animation:slideIn .3s ease backwards}.nav-item:nth-child(1){animation-delay:.05s}.nav-item:nth-child(2){animation-delay:.1s}.nav-item:nth-child(3){animation-delay:.15s}.nav-item:nth-child(4){animation-delay:.2s}.nav-item:nth-child(5){animation-delay:.25s}.nav-item:nth-child(6){animation-delay:.3s}.sidebar-item{padding:12px 20px;cursor:pointer;display:flex;justify-content:space-between;align-items:center;transition:background-color .2s;color:#333;font-size:14px}.sidebar-item:hover{background-color:#f5f5f5}.sidebar-item.active{background-color:#f0fdf4;color:#22c55e;font-weight:500}.sidebar-arrow{font-size:12px;color:#999}.sidebar-footer{padding:15px 20px;border-top:1px solid #e0e0e0;display:flex;align-items:center;gap:8px;font-size:13px;color:#666}.sidebar-icon{font-size:16px}.payment-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000}.payment-dialog{background:#fff;border-radius:8px;padding:24px;max-width:500px;width:90%;max-height:90vh;overflow-y:auto;box-shadow:0 4px 20px #00000026}.dialog-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid #eee}.dialog-close{background:none;border:none;font-size:24px;cursor:pointer;color:#999;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.dialog-content{display:flex;flex-direction:column;gap:20px}.payment-info{text-align:center;padding:16px;background:#f9f9f9;border-radius:8px}.payment-amount{margin-bottom:8px}.amount-label{font-size:14px;color:#666}.amount-value{font-size:28px;font-weight:600;color:#ff6b35;margin-left:8px}.payment-description{font-size:14px;color:#666;margin-bottom:8px}.payment-order-no{font-size:12px;color:#999}.qrcode-container{display:flex;flex-direction:column;align-items:center;padding:20px}.qrcode-wrapper{padding:20px;background:#fff;border:2px solid #eee;border-radius:8px;display:flex;align-items:center;justify-content:center;min-height:300px;min-width:300px}.qrcode-loading{color:#999;font-size:14px}.qrcode-tip{margin-top:16px;font-size:14px;color:#666;text-align:center}.payment-status{text-align:center;padding:16px}.status-indicator{display:flex;align-items:center;justify-content:center;gap:8px;color:#666;font-size:14px}.status-dot{width:8px;height:8px;border-radius:50%;background:#ff6b35;animation:pulse 1.5s ease-in-out infinite}.payment-success{text-align:center;padding:40px 20px}.success-icon{width:64px;height:64px;border-radius:50%;background:#52c41a;color:#fff;font-size:36px;display:flex;align-items:center;justify-content:center;margin:0 auto 20px}.payment-success h3{margin:0 0 12px;color:#333;font-size:20px}.payment-success p{margin:0;color:#666;font-size:14px}.payment-failed{text-align:center;padding:40px 20px}.failed-icon{width:64px;height:64px;border-radius:50%;background:#ff4d4f;color:#fff;font-size:36px;display:flex;align-items:center;justify-content:center;margin:0 auto 20px}.payment-failed h3{margin:0 0 12px;color:#333;font-size:20px}.error-message{margin:0;color:#ff4d4f;font-size:14px}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:20px;padding-top:20px;border-top:1px solid #eee}.btn-cancel{padding:10px 24px;border:1px solid #ddd;background:#fff;color:#333;border-radius:4px;cursor:pointer;font-size:14px;transition:all .2s}.btn-cancel:hover{background:#f5f5f5;border-color:#ccc}.message.error{padding:12px;background:#fff2f0;border:1px solid #ffccc7;border-radius:4px;color:#ff4d4f;font-size:14px}.recharge-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.recharge-dialog{background:#fff;border-radius:12px;width:90%;max-width:700px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0003}.current-balance{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:16px 20px;border-radius:8px;margin-bottom:24px;display:flex;justify-content:space-between;align-items:center}.balance-label{font-size:14px;opacity:.9}.balance-value{font-size:24px;font-weight:600}.message.info{background:#e3f2fd;color:#1976d2;border:1px solid #90caf9}.recharge-plans h4{margin:0 0 16px;font-size:16px;color:#333}.plans-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(140px,1fr));gap:12px;margin-bottom:24px}.plan-card{border:2px solid #e0e0e0;border-radius:8px;padding:16px;text-align:center;cursor:pointer;transition:all .2s;background:#fff}.plan-card:hover{border-color:#667eea;transform:translateY(-2px);box-shadow:0 4px 12px #667eea33}.plan-card.selected{border-color:#667eea;background:#f0f4ff}.plan-custom{display:flex;flex-direction:column;gap:8px}.custom-amount-input{width:100%;padding:8px;border:1px solid #ddd;border-radius:4px;font-size:16px;text-align:center}.plan-name{font-size:14px;font-weight:600;color:#333;margin-bottom:8px}.plan-amount{font-size:24px;font-weight:700;color:#667eea;margin-bottom:8px}.plan-tokens{font-size:13px;color:#666;margin-bottom:4px}.plan-bonus{color:#4caf50;font-weight:600;display:block;margin-top:4px}.plan-description{font-size:12px;color:#999;margin-top:4px}.btn-cancel,.btn-recharge{padding:10px 24px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.btn-recharge{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-recharge:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.btn-recharge:disabled{opacity:.5;cursor:not-allowed}.recharge-tips{margin-top:24px;padding:16px;background:#f9f9f9;border-radius:6px;font-size:13px;color:#666}.recharge-tips p{margin:0 0 8px;font-weight:600;color:#333}.recharge-tips ul{margin:0;padding-left:20px}.recharge-tips li{margin-bottom:4px}.premium-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:10000;animation:fadeIn .2s ease-in-out}.premium-dialog{background:#fff;border-radius:16px;padding:0;max-width:480px;width:90%;box-shadow:0 20px 60px #0000004d;animation:slideUp .3s ease-out;overflow:hidden;display:flex;flex-direction:column}@keyframes slideUp{0%{transform:translateY(30px);opacity:0}to{transform:translateY(0);opacity:1}}.premium-dialog-header{position:relative;padding:16px 24px;text-align:right}.btn-close{background:none;border:none;font-size:28px;color:#666;cursor:pointer;padding:0;width:32px;height:32px;display:inline-flex;align-items:center;justify-content:center;border-radius:6px;transition:all .2s;line-height:1}.premium-icon{display:flex;align-items:center;justify-content:center;margin-bottom:12px;animation:pulse 2s ease-in-out infinite}.premium-leopard-icon{width:60px;height:45px;background-image:url(/images/leopard-pattern.png);background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:6px;position:relative;overflow:hidden;box-shadow:0 2px 8px #0000004d}.premium-leopard-icon:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#d2691e,peru,#d2691e,peru,#d2691e);background-size:15px 15px;border-radius:6px;z-index:-1}@keyframes pulse{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.premium-dialog-title{color:#fff;font-size:24px;font-weight:600;margin:0;text-shadow:0 2px 4px rgba(0,0,0,.2)}.premium-dialog-content{padding:0 32px 32px;background:#fff}.premium-intro{display:flex;flex-direction:column;align-items:center}.premium-message{font-size:18px;font-weight:600;color:#333;text-align:center;margin:0 0 8px}.premium-subtitle{font-size:14px;color:#666;text-align:center;margin:0 0 24px}.premium-features{list-style:none;margin:0 0 24px;width:100%;background:#f8f9fa;border-radius:12px;padding:20px}.premium-feature-item{display:flex;align-items:center;padding:12px 0;font-size:15px;color:#333;border-bottom:1px solid #e9ecef}.premium-feature-item:last-child{border-bottom:none}.premium-feature-item.highlight-feature{background:linear-gradient(135deg,#fef3c7,#fde68a);margin:8px -20px;padding:14px 20px;border-radius:8px;border:2px solid #f59e0b;border-bottom:none;position:relative}.premium-feature-item.highlight-feature:before{content:"⭐";position:absolute;top:-8px;right:12px;font-size:20px;background:#fff;padding:2px 6px;border-radius:50%;box-shadow:0 2px 4px #0000001a}.premium-feature-item.highlight-feature .feature-icon{font-size:24px;margin-right:12px}.premium-feature-item.highlight-feature strong{color:#d97706;font-size:16px}.feature-note{display:block;font-size:12px;color:#92400e;margin-top:4px;font-weight:400;font-style:italic}.feature-icon{font-size:20px;margin-right:12px;width:28px;text-align:center}.premium-price{text-align:center;padding:16px;background:linear-gradient(135deg,gold,#ffed4e);border-radius:12px;margin-bottom:8px}.price-label{font-size:14px;color:#666;margin-right:8px}.price-value{font-size:24px;font-weight:700;color:#333}.price-unit{font-size:18px;font-weight:600;color:#666;margin-left:4px}.premium-dialog-body{padding:0}.error-message{color:#dc2626;text-align:center;margin-top:12px;font-size:14px;padding:8px 12px;background:#fef2f2;border-radius:6px;border:1px solid #fecaca}.payment-section{padding:24px;text-align:center}.qr-code-wrapper{display:flex;justify-content:center;align-items:center;margin:20px 0}.qr-code-wrapper img{border:1px solid #e5e7eb;border-radius:8px;padding:12px;background:#fff;box-shadow:0 2px 8px #0000001a}.payment-hint{text-align:center;color:#666;margin-bottom:8px;font-size:14px}.order-no{text-align:center;color:#999;font-size:12px;margin-bottom:16px}.payment-status{text-align:center;margin-top:16px}.loading-dots{color:#3b82f6;font-size:14px}.loading-dots span{animation:blink 1.4s infinite;animation-delay:calc(var(--i) * .2s)}.loading-dots span:nth-child(1){--i: 0}.loading-dots span:nth-child(2){--i: 1}.loading-dots span:nth-child(3){--i: 2}@keyframes blink{0%,to{opacity:0}50%{opacity:1}}.btn-upgrade{padding:12px 32px;border:none;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:0 4px 12px #667eea66;width:100%;margin-top:8px}.btn-upgrade:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #667eea80}.btn-upgrade:active:not(:disabled){transform:translateY(0)}.btn-upgrade:disabled{opacity:.6;cursor:not-allowed;transform:none}.premium-dialog-actions{padding:20px 32px 32px;background:#fff;display:flex;gap:12px;justify-content:flex-end}.btn-premium-cancel{padding:12px 24px;border:2px solid #e9ecef;background:#fff;color:#666;border-radius:8px;font-size:15px;font-weight:500;cursor:pointer;transition:all .2s}.btn-premium-cancel:hover:not(:disabled){background:#f8f9fa;border-color:#dee2e6}.btn-premium-cancel:disabled{opacity:.6;cursor:not-allowed}.btn-premium-upgrade{padding:12px 32px;border:none;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:all .2s;box-shadow:0 4px 12px #667eea66}.btn-premium-upgrade:hover:not(:disabled){transform:translateY(-2px);box-shadow:0 6px 16px #667eea80}.btn-premium-upgrade:active:not(:disabled){transform:translateY(0)}.btn-premium-upgrade:disabled{opacity:.6;cursor:not-allowed;transform:none}@media (max-width: 480px){.premium-dialog{width:95%;margin:20px}.premium-dialog-content{padding:24px}.premium-dialog-actions{flex-direction:column;padding:20px 24px 24px}.btn-premium-cancel,.btn-premium-upgrade{width:100%}}.user-center{position:relative}.user-center-button{display:flex;align-items:center;gap:8px;padding:8px 16px;background-color:#fff;border:1px solid #e0e0e0;border-radius:20px;cursor:pointer;transition:all .2s;font-size:14px;color:#333}.user-center-button:hover{background-color:#f5f5f5;border-color:#22c55e}.user-avatar{width:32px;height:32px;border-radius:50%;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:14px;flex-shrink:0}.user-name{font-weight:500;max-width:120px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-arrow{font-size:10px;color:#666;transition:transform .2s;flex-shrink:0}.dropdown-arrow.open{transform:rotate(180deg)}.user-dropdown{position:absolute;top:calc(100% + 8px);right:0;width:280px;background-color:#fff;border:1px solid #e0e0e0;border-radius:8px;box-shadow:0 4px 12px #0000001a;z-index:1000;overflow:hidden}.dropdown-header{padding:16px;display:flex;align-items:center;gap:12px;background-color:#f9fafb;border-bottom:1px solid #e0e0e0}.dropdown-avatar{width:48px;height:48px;border-radius:50%;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;display:flex;align-items:center;justify-content:center;font-weight:600;font-size:18px;flex-shrink:0}.dropdown-user-info{flex:1;min-width:0}.dropdown-username{font-size:15px;font-weight:600;color:#333;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-email{font-size:13px;color:#666;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dropdown-divider{height:1px;background-color:#e0e0e0}.dropdown-token-balance{padding:14px 16px;display:flex;justify-content:space-between;align-items:center;background:linear-gradient(135deg,#f0f4ff,#e8f0fe);gap:12px;min-height:60px}.token-info{display:flex;flex-direction:column;gap:4px;flex:1;min-width:0}.token-label{font-size:12px;color:#666}.token-value{font-size:18px;font-weight:700;color:#667eea}.btn-recharge-small{padding:8px 18px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:6px;font-size:13px;font-weight:600;cursor:pointer;transition:all .2s;flex-shrink:0;display:inline-block!important;visibility:visible!important;opacity:1!important;white-space:nowrap;box-shadow:0 2px 4px #667eea33}.btn-recharge-small:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea66;background:linear-gradient(135deg,#764ba2,#667eea)}.btn-recharge-small:active{transform:translateY(0)}.dropdown-menu{padding:8px 0}.dropdown-item{width:100%;padding:12px 16px;display:flex;align-items:center;gap:12px;background:none;border:none;text-align:left;font-size:14px;color:#333;cursor:pointer;transition:background-color .2s}.dropdown-item:hover{background-color:#f5f5f5}.dropdown-icon{font-size:16px;width:20px;text-align:center}.account-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;padding:20px}.account-dialog{background-color:#fff;border-radius:12px;width:100%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0003}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #e0e0e0}.dialog-header h3{font-size:20px;font-weight:600;color:#333;margin:0}.dialog-close{background:none;border:none;font-size:28px;color:#999;cursor:pointer;line-height:1;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.dialog-tabs{display:flex;border-bottom:1px solid #e0e0e0;padding:0 24px}.tab-button{padding:12px 24px;background:none;border:none;font-size:14px;color:#666;cursor:pointer;border-bottom:2px solid transparent;transition:all .2s;margin-bottom:-1px}.tab-button:hover{color:#22c55e}.tab-button.active{color:#22c55e;border-bottom-color:#22c55e;font-weight:500}.message{padding:12px;border-radius:6px;margin-bottom:20px;font-size:14px}.message.error{background-color:#fee2e2;color:#991b1b}.message.success{background-color:#d1fae5;color:#065f46}.form-content{display:flex;flex-direction:column;gap:20px}.form-group{display:flex;flex-direction:column;gap:8px}.form-label{font-size:14px;font-weight:500;color:#333}.form-input{padding:10px 12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;transition:all .2s}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;margin-top:8px}.btn-cancel,.btn-save{padding:10px 20px;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;border:none}.btn-cancel{background-color:#f5f5f5;color:#333}.btn-cancel:hover{background-color:#e5e5e5}.btn-save{background-color:#22c55e;color:#fff}.btn-save:hover:not(:disabled){background-color:#16a34a}.btn-save:disabled{background-color:#9ca3af;cursor:not-allowed}.daily-claim-section{padding:14px 16px;display:flex;flex-direction:column;gap:10px;background:linear-gradient(135deg,#fef3c7,#fde68a);border-left:3px solid #f59e0b}.daily-claim-info{display:flex;justify-content:space-between;align-items:center}.daily-claim-label{font-size:13px;font-weight:600;color:#92400e}.daily-claim-reward{font-size:14px;font-weight:700;color:#d97706}.btn-daily-claim{width:100%;padding:10px 16px;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;box-shadow:0 2px 4px #f59e0b4d}.btn-daily-claim:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 8px #f59e0b66;background:linear-gradient(135deg,#d97706,#b45309)}.btn-daily-claim:active:not(:disabled){transform:translateY(0)}.btn-daily-claim:disabled{background:#d1d5db;color:#6b7280;cursor:not-allowed;box-shadow:none;transform:none}.btn-daily-claim.claimed{background:#10b981;color:#fff}.btn-daily-claim.claimed:hover{background:#059669}.premium-status{padding:12px 16px;display:flex;justify-content:center;align-items:center}.premium-badge{display:inline-block;padding:6px 12px;background:linear-gradient(135deg,#10b981,#059669);color:#fff;border-radius:20px;font-size:12px;font-weight:600;box-shadow:0 2px 4px #10b98133}.upgrade-item{position:relative}.upgrade-badge{margin-left:auto;padding:4px 8px;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;border-radius:12px;font-size:11px;font-weight:600}.global-search-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#0009;display:flex;align-items:flex-start;justify-content:center;z-index:2000;padding-top:10vh;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.global-search-dialog{background:#fff;border-radius:12px;width:90%;max-width:700px;max-height:80vh;display:flex;flex-direction:column;box-shadow:0 10px 40px #0000004d;animation:slideDown .2s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-20px)}to{opacity:1;transform:translateY(0)}}.search-header{padding:20px;border-bottom:1px solid #e0e0e0}.search-input-wrapper{display:flex;align-items:center;gap:12px;background:#f5f5f5;border-radius:8px;padding:12px 16px;border:2px solid transparent;transition:all .2s}.search-input-wrapper:focus-within{background:#fff;border-color:#667eea}.search-icon{font-size:20px;flex-shrink:0}.search-input{flex:1;border:none;background:none;font-size:16px;outline:none;color:#333}.search-input::placeholder{color:#999}.clear-btn{background:none;border:none;font-size:24px;color:#999;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s;flex-shrink:0}.clear-btn:hover{background:#e0e0e0;color:#333}.search-results{flex:1;overflow-y:auto;padding:8px}.search-loading,.search-hint,.search-empty{padding:40px 20px;text-align:center;color:#999}.search-hint p{margin-bottom:20px;font-size:14px}.search-tips{text-align:left;background:#f9f9f9;padding:16px;border-radius:8px;font-size:13px;color:#666;max-width:500px;margin:0 auto}.search-tips p{font-weight:600;margin-bottom:8px;color:#333}.search-tips ul{margin:0;padding-left:20px}.search-tips li{margin-bottom:4px}.search-empty .empty-tip{font-size:13px;margin-top:8px;color:#ccc}.results-header{padding:12px 16px;font-size:13px;color:#666;font-weight:600;border-bottom:1px solid #f0f0f0;margin-bottom:8px}.result-item{display:flex;gap:12px;padding:12px 16px;border-radius:8px;cursor:pointer;transition:all .2s;margin-bottom:4px}.result-item:hover,.result-item.selected{background:#f0f4ff}.result-icon{font-size:24px;flex-shrink:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;background:#f5f5f5;border-radius:6px}.result-item.selected .result-icon{background:#667eea}.result-content{flex:1;min-width:0}.result-title{font-size:16px;font-weight:600;color:#333;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.result-work{font-size:12px;color:#667eea;margin-bottom:6px}.result-snippet{font-size:14px;color:#666;line-height:1.5;margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.result-type{font-size:12px;color:#999}.highlight{background:#fff3cd;color:#856404;padding:0 2px;border-radius:2px;font-weight:600}.result-item.selected .highlight{background:gold}.search-footer{padding:12px 20px;border-top:1px solid #e0e0e0;display:flex;justify-content:center;gap:16px;font-size:12px;color:#999}.footer-hint{padding:4px 8px;background:#f5f5f5;border-radius:4px}.daily-claim-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:10000;animation:fadeIn .2s ease-in}.daily-claim-dialog{background:#fff;border-radius:12px;box-shadow:0 4px 20px #00000026;width:90%;max-width:400px;animation:slideUp .3s ease-out}@keyframes slideUp{0%{transform:translateY(20px);opacity:0}to{transform:translateY(0);opacity:1}}.daily-claim-dialog-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #e5e5e5}.daily-claim-dialog-header h2{margin:0;font-size:20px;font-weight:600;color:#333}.daily-claim-dialog-close{background:none;border:none;font-size:28px;color:#999;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.daily-claim-dialog-close:hover{background-color:#f5f5f5;color:#333}.daily-claim-dialog-content{padding:24px}.daily-claim-reward-info{display:flex;align-items:center;gap:20px;padding:24px;background:linear-gradient(135deg,#667eea,#764ba2);border-radius:12px;color:#fff}.daily-claim-reward-icon{font-size:48px;line-height:1}.daily-claim-reward-text{flex:1}.daily-claim-reward-title{font-size:14px;opacity:.9;margin-bottom:8px}.daily-claim-reward-amount{font-size:32px;font-weight:700;line-height:1.2}.daily-claim-error{margin-top:16px;padding:12px;background-color:#fee;color:#c33;border-radius:6px;font-size:14px;text-align:center}.daily-claim-dialog-footer{padding:20px 24px;border-top:1px solid #e5e5e5;display:flex;gap:12px}.btn-daily-claim-primary{flex:1;padding:12px 24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:6px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s}.btn-daily-claim-primary:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #667eea66}.btn-daily-claim-primary:active:not(:disabled){transform:translateY(0)}.btn-daily-claim-primary:disabled{opacity:.6;cursor:not-allowed}.btn-daily-claim-secondary{flex:1;padding:12px 24px;background:#f5f5f5;color:#666;border:none;border-radius:6px;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s}.btn-daily-claim-secondary:hover:not(:disabled){background:#e8e8e8;color:#333}.btn-daily-claim-secondary:disabled{opacity:.6;cursor:not-allowed}.layout{display:flex;flex-direction:column;min-height:100vh;background-color:#fff}.info-banner{background-color:#3b82f6;color:#fff;padding:12px 20px;display:flex;align-items:center;justify-content:space-between;gap:8px;font-size:14px;cursor:pointer}.banner-right{margin-left:auto;display:flex;align-items:center;gap:12px}.global-search-trigger{padding:6px 12px;background:#fff3;border:1px solid rgba(255,255,255,.3);border-radius:6px;color:#fff;font-size:13px;cursor:pointer;transition:all .2s;display:flex;align-items:center;gap:6px}.global-search-trigger:hover{background:#ffffff4d;border-color:#ffffff80}.info-icon{font-size:18px}.layout-body{display:flex;flex:1;overflow:hidden;height:calc(100vh - 70px);position:relative}.main-content{flex:1;overflow-y:auto;padding:20px;background-color:#f5f5f5;min-height:calc(100vh - 120px)}.mobile-menu-toggle{display:none;position:fixed;top:10px;left:10px;z-index:1001;width:44px;height:44px;background:#fff;border:1px solid #e5e7eb;border-radius:8px;cursor:pointer;align-items:center;justify-content:center;box-shadow:0 2px 8px #0000001a;transition:all .3s ease}.mobile-menu-toggle:hover{background:#f9fafb;box-shadow:0 4px 12px #00000026}.hamburger{display:flex;flex-direction:column;gap:4px;width:20px;height:16px}.hamburger span{display:block;width:100%;height:2px;background:#374151;border-radius:2px;transition:all .3s ease}.hamburger.active span:nth-child(1){transform:rotate(45deg) translate(5px,5px)}.hamburger.active span:nth-child(2){opacity:0}.hamburger.active span:nth-child(3){transform:rotate(-45deg) translate(5px,-5px)}.sidebar-overlay{display:none;position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;z-index:999;animation:fadeIn .3s ease}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.footer{background-color:#f0f0f0;padding:10px 20px;text-align:center;font-size:12px;color:#666;border-top:1px solid #e0e0e0}@media (max-width: 768px){.info-banner{padding:10px 15px;font-size:12px;flex-wrap:wrap}.banner-right{width:100%;margin-top:8px;margin-left:0;justify-content:flex-end}.global-search-trigger{padding:6px 10px;font-size:12px}.layout-body{height:calc(100vh - 90px)}.main-content{padding:12px;width:100%}.mobile-menu-toggle{display:flex}.sidebar-overlay{display:block}}@media (max-width: 480px){.info-banner{padding:8px 12px;font-size:11px}.main-content{padding:10px}}.work-card{background-color:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:16px;display:flex;flex-direction:column;transition:all .2s;cursor:pointer;aspect-ratio:.85}.work-card:hover{box-shadow:0 4px 12px #0000001a;border-color:#22c55e;transform:translateY(-2px)}.work-logo{position:relative;text-align:center;margin-bottom:12px;width:100%;height:120px;border-radius:6px;overflow:hidden;background-color:#f5f5f5;cursor:pointer;transition:all .2s}.work-logo:hover{background-color:#e8e8e8}.work-logo:hover .cover-upload-overlay{opacity:1}.work-cover{width:100%;height:100%;object-fit:cover;display:block}.logo-content{display:flex;align-items:center;justify-content:center;gap:4px;margin-bottom:6px;height:100%;width:100%}.logo-content.hidden{display:none}.cover-upload-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:4px;opacity:0;transition:opacity .2s;color:#fff;font-size:12px}.cover-upload-icon{font-size:20px}.cover-upload-text{font-size:11px;font-weight:500}.logo-leopard{width:60px;height:45px;background-image:url(/images/leopard-pattern.png);background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:6px;position:relative;overflow:hidden;box-shadow:0 2px 6px #00000026}.logo-leopard:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#d2691e,peru,#d2691e,peru,#d2691e);background-size:15px 15px;border-radius:6px;z-index:-1}.logo-text{font-size:12px;color:#666;font-weight:500}.work-info{flex:1;margin-bottom:12px}.work-title{font-size:16px;font-weight:600;color:#333;margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.work-description{font-size:12px;color:#999;margin-bottom:8px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.work-meta{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#666}.work-word-count{font-weight:500}.work-date{color:#999}.work-actions{display:flex;flex-direction:column;gap:6px;padding-top:12px;border-top:1px solid #f0f0f0}.work-action-btn{padding:6px 12px;background-color:#f5f5f5;color:#333;border:none;border-radius:4px;cursor:pointer;font-size:12px;transition:all .2s;text-align:center}.work-action-btn:hover{background-color:#22c55e;color:#fff}.work-card.batch-mode{cursor:pointer;position:relative}.work-card.selected{border-color:#22c55e;background-color:#f0fdf4;box-shadow:0 0 0 2px #22c55e33}.batch-checkbox{position:absolute;top:8px;left:8px;z-index:10}.batch-checkbox input[type=checkbox]{width:18px;height:18px;cursor:pointer}.work-card.archived{opacity:.7}.work-card.deleted{opacity:.5;filter:grayscale(.3)}.work-status-badge{display:inline-block;padding:2px 8px;border-radius:4px;font-size:11px;font-weight:500;margin-top:6px}.work-status-badge.archived{background-color:#fef3c7;color:#92400e}.work-status-badge.deleted{background-color:#fee2e2;color:#991b1b}.work-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.work-tag{display:inline-block;padding:4px 8px;background:#e0f2fe;color:#0369a1;border-radius:12px;font-size:11px;font-weight:500}.work-tag-more{display:inline-block;padding:4px 8px;background:#f3f4f6;color:#6b7280;border-radius:12px;font-size:11px;font-weight:500}.restore-btn{background-color:#22c55e!important;color:#fff!important}.restore-btn:hover{background-color:#16a34a!important}.new-work-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.new-work-dialog{background-color:#fff;border-radius:8px;width:500px;max-width:90vw;box-shadow:0 4px 20px #00000026;display:flex;flex-direction:column}.work-manage-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.work-manage-dialog{background-color:#fff;border-radius:8px;width:500px;max-width:90vw;box-shadow:0 4px 20px #00000026;display:flex;flex-direction:column}.dialog-content{padding:20px;max-height:400px;overflow-y:auto}.info-section{margin-bottom:16px}.info-label{display:block;margin-bottom:6px;font-size:13px;color:#999}.info-value{font-size:14px;color:#333;word-break:break-word}.btn-cancel,.btn-edit,.btn-archive,.btn-restore,.btn-delete{padding:8px 20px;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.btn-cancel{background-color:#f5f5f5;color:#333;border:1px solid #e0e0e0}.btn-edit{background-color:#3b82f6;color:#fff}.btn-edit:hover{background-color:#2563eb}.btn-archive{background-color:#f59e0b;color:#fff}.btn-archive:hover{background-color:#d97706}.btn-restore{background-color:#22c55e;color:#fff}.btn-restore:hover{background-color:#16a34a}.btn-delete{background-color:#ef4444;color:#fff}.btn-delete:hover{background-color:#dc2626}.export-buttons{display:flex;gap:8px}.btn-export{padding:8px 16px;border:1px solid #667eea;border-radius:6px;background-color:#fff;color:#667eea;cursor:pointer;font-size:14px;transition:all .2s}.btn-export:hover{background-color:#667eea;color:#fff}.tags-display{margin-top:4px}.tag-item{display:inline-block;padding:4px 10px;background:#e0f2fe;color:#0369a1;border-radius:12px;font-size:12px;font-weight:500}.tags-empty{color:#999;font-size:13px}.tags-editor{display:flex;flex-direction:column;gap:12px}.tags-input-wrapper{display:flex;gap:8px}.tags-input{flex:1;padding:8px 12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px}.tags-input:focus{outline:none;border-color:#667eea}.tag-add-btn{padding:8px 16px;background:#667eea;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.tag-add-btn:hover{background:#5568d3}.available-tags{padding:12px;background:#f9fafb;border-radius:6px}.available-tags-label{font-size:12px;color:#666;margin-bottom:8px}.available-tags-list{display:flex;flex-wrap:wrap;gap:6px}.available-tag-btn{padding:4px 10px;background:#fff;border:1px solid #e0e0e0;border-radius:12px;font-size:12px;color:#666;cursor:pointer;transition:all .2s}.available-tag-btn:hover{background:#667eea;color:#fff;border-color:#667eea}.selected-tags{display:flex;flex-wrap:wrap;gap:6px}.selected-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background:#667eea;color:#fff;border-radius:12px;font-size:12px;font-weight:500}.tag-remove-btn{background:none;border:none;color:#fff;cursor:pointer;font-size:16px;line-height:1;padding:0;width:16px;height:16px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s}.tag-remove-btn:hover{background:#fff3}.import-chapter-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.import-chapter-dialog{background:#fff;border-radius:12px;width:90%;max-width:600px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0003}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #eee}.dialog-header h3{margin:0;font-size:20px;font-weight:600;color:#333}.dialog-close{background:none;border:none;font-size:28px;color:#999;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.dialog-close:hover{background:#f5f5f5;color:#333}.dialog-content{padding:24px}.import-tips{background:#f9f9f9;padding:16px;border-radius:8px;margin-bottom:20px;font-size:13px;color:#666}.import-tips p{margin:0 0 8px;font-weight:600;color:#333}.import-tips ul{margin:0;padding-left:20px}.import-tips li{margin-bottom:4px}.file-select-area{margin-bottom:20px}.file-input{display:none}.file-select-label{display:block;cursor:pointer}.file-select-button{display:flex;align-items:center;justify-content:center;gap:8px;padding:16px;border:2px dashed #ddd;border-radius:8px;background:#fafafa;transition:all .2s;font-size:14px;color:#666}.file-select-button:hover{border-color:#667eea;background:#f0f4ff;color:#667eea}.file-icon{font-size:20px}.message{padding:12px 16px;border-radius:6px;margin-bottom:16px;font-size:14px}.message.error{background:#fee;color:#c33;border:1px solid #fcc}.selected-files{margin-bottom:20px}.selected-files h4{margin:0 0 12px;font-size:14px;font-weight:600;color:#333}.files-list{display:flex;flex-direction:column;gap:8px;max-height:300px;overflow-y:auto}.file-item{display:flex;align-items:center;justify-content:space-between;padding:12px;background:#f9f9f9;border-radius:6px;gap:12px}.file-name{flex:1;font-size:14px;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.file-size{font-size:12px;color:#999;flex-shrink:0}.remove-file-btn{background:none;border:none;font-size:20px;color:#999;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s;flex-shrink:0}.remove-file-btn:hover{background:#fee;color:#c33}.dialog-actions{display:flex;justify-content:flex-end;gap:12px;padding-top:20px;border-top:1px solid #eee}.btn-cancel,.btn-import{padding:10px 24px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.btn-cancel{background:#f5f5f5;color:#666}.btn-cancel:hover{background:#e0e0e0}.btn-import{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-import:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.btn-import:disabled{opacity:.5;cursor:not-allowed}.work-statistics{background:#fff;border-radius:12px;padding:24px;margin-bottom:24px;box-shadow:0 2px 8px #0000000d}.statistics-title{margin:0 0 20px;font-size:18px;font-weight:600;color:#333}.statistics-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(150px,1fr));gap:16px;margin-bottom:16px}@media (max-width: 768px){.statistics-grid{grid-template-columns:repeat(auto-fit,minmax(130px,1fr));gap:10px}.stat-card{padding:10px 12px;gap:8px}.stat-icon{font-size:26px}.stat-value{font-size:18px;margin-bottom:2px;line-height:1.1}.stat-label{font-size:11px;line-height:1.2}.work-statistics{padding:16px}.statistics-title{font-size:16px;margin-bottom:12px}}@media (max-width: 480px){.statistics-grid{grid-template-columns:repeat(2,1fr);gap:8px}.stat-card{flex-direction:column;align-items:center;text-align:center;padding:12px 8px;gap:6px}.stat-icon{font-size:28px;margin-bottom:4px}.stat-value{font-size:16px;margin-bottom:2px;line-height:1}.stat-label{font-size:10px;line-height:1.2}.work-statistics{padding:12px}.statistics-title{font-size:15px;margin-bottom:12px;text-align:center}}.stat-card{display:flex;align-items:center;gap:10px;padding:12px 14px;background:linear-gradient(135deg,#f5f7fa,#e8ecef);border-radius:8px;transition:all .2s;min-height:auto}.stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #0000001a}.stat-card.highlight{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.stat-card.highlight .stat-icon{filter:none}.stat-icon{font-size:clamp(24px,3vw,32px);flex-shrink:0;filter:grayscale(.2);line-height:1}.stat-content{flex:1;min-width:0;display:flex;flex-direction:column;justify-content:center}.stat-value{font-size:clamp(18px,2.5vw,24px);font-weight:700;margin-bottom:4px;color:#333;white-space:nowrap;line-height:1.2}.stat-card.highlight .stat-value{color:#fff}.stat-label{font-size:clamp(11px,1.3vw,13px);color:#666;line-height:1.3;white-space:nowrap}.stat-card.highlight .stat-label{color:#ffffffe6}.statistics-footer{padding-top:16px;border-top:1px solid #e0e0e0;text-align:center}.footer-text{font-size:13px;color:#999}.works-page{background-color:#fff;padding:20px;border-radius:8px;min-height:calc(100vh - 200px)}.works-tabs{display:flex;gap:0;border-bottom:2px solid #e0e0e0;margin-bottom:20px}.tab{padding:12px 24px;background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;font-size:14px;color:#666;margin-bottom:-2px;transition:color .2s}.tab:hover{color:#22c55e}.tab.active{color:#22c55e;border-bottom-color:#22c55e;font-weight:500}.works-toolbar{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;gap:16px}.btn-primary{display:flex;align-items:center;gap:6px;padding:10px 16px;background-color:#22c55e;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:background-color .2s}.btn-primary:hover{background-color:#16a34a}.toolbar-right{display:flex;align-items:center;gap:12px}.view-toggle{display:flex;gap:4px;border:1px solid #e0e0e0;border-radius:4px;padding:2px}.view-btn{padding:6px 10px;background:none;border:none;cursor:pointer;font-size:16px;color:#666;border-radius:3px;transition:all .2s}.view-btn:hover{background-color:#f5f5f5}.view-btn.active{background-color:#22c55e;color:#fff}.search-input{padding:8px 12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;width:200px}.search-input:focus{outline:none;border-color:#22c55e}.tag-filter{display:flex;align-items:center;gap:8px}.tag-select{padding:8px 12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;background:#fff;cursor:pointer;min-width:120px}.tag-select:focus{outline:none;border-color:#667eea}.tag-filter-clear{background:none;border:none;font-size:20px;color:#999;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:50%;transition:all .2s}.tag-filter-clear:hover{background:#f5f5f5;color:#333}.btn-secondary{padding:8px 16px;background-color:#fff;color:#333;border:1px solid #e0e0e0;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.btn-secondary:hover{border-color:#22c55e;color:#22c55e}.works-container{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px}.works-container.list{grid-template-columns:1fr}.new-work-wrapper{display:flex;flex-direction:column;gap:12px}.new-work-card{aspect-ratio:1;border:2px dashed #d0d0d0;border-radius:8px;display:flex;flex-direction:column;align-items:center;justify-content:center;cursor:pointer;transition:all .2s;background-color:#fafafa}.new-work-card:hover{border-color:#22c55e;background-color:#f0fdf4}.new-work-icon{font-size:48px;color:#999;margin-bottom:8px;font-weight:300}.new-work-text{font-size:14px;color:#666}.new-work-actions{display:flex;flex-direction:column;gap:8px}.action-btn{padding:8px 16px;background-color:#fff;color:#333;border:1px solid #e0e0e0;border-radius:6px;cursor:pointer;font-size:13px;transition:all .2s;width:100%;text-align:center}.action-btn:hover{border-color:#22c55e;color:#22c55e}.batch-actions{display:flex;align-items:center;gap:12px}.batch-count{font-size:14px;color:#666;font-weight:500}.btn-batch-archive,.btn-batch-delete,.btn-batch-restore,.btn-cancel-batch{padding:8px 16px;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.btn-batch-archive{background-color:#f59e0b;color:#fff}.btn-batch-archive:hover{background-color:#d97706}.btn-batch-delete{background-color:#ef4444;color:#fff}.btn-batch-delete:hover{background-color:#dc2626}.btn-batch-restore{background-color:#22c55e;color:#fff}.btn-batch-restore:hover{background-color:#16a34a}.btn-cancel-batch{background-color:#f5f5f5;color:#333;border:1px solid #e0e0e0}.btn-cancel-batch:hover{background-color:#e8e8e8}.btn-secondary.active{background-color:#22c55e;color:#fff;border-color:#22c55e}.empty-state{grid-column:1 / -1;text-align:center;padding:60px 20px;color:#999;font-size:14px}.works-container.list .work-card{flex-direction:row;aspect-ratio:auto;padding:16px;align-items:center}.works-container.list .work-logo{width:80px;min-width:80px;margin-bottom:0;margin-right:16px}.works-container.list .work-info{flex:1;margin-bottom:0}.works-container.list .work-title{white-space:normal;overflow:visible;text-overflow:unset}.works-container.list .work-actions{flex-direction:row;padding-top:0;border-top:none;margin-left:16px}@media (max-width: 768px){.works-page{padding:12px}.works-toolbar{flex-direction:column;align-items:stretch;gap:12px}.toolbar-right{flex-wrap:wrap;gap:10px;width:100%}.search-input{width:100%;min-height:44px;font-size:16px}.tag-select{min-width:100px;min-height:44px;font-size:14px}.btn-primary{width:100%;min-height:44px;justify-content:center;padding:12px 16px}.works-tabs{overflow-x:auto;-webkit-overflow-scrolling:touch}.tab{padding:12px 16px;font-size:13px;white-space:nowrap;min-height:44px}.works-container{grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:16px}.works-container.list .work-card{flex-direction:column;padding:12px}.works-container.list .work-logo{width:60px;min-width:60px;margin-bottom:12px;margin-right:0}.works-container.list .work-info{margin-bottom:12px;text-align:center}.works-container.list .work-actions{flex-direction:column;padding-top:12px;border-top:1px solid #e0e0e0;margin-left:0;width:100%;gap:8px}.works-container.list .work-actions button{width:100%;min-height:44px}.batch-actions{flex-direction:column;align-items:stretch;gap:10px}.batch-actions button{width:100%;min-height:44px}}@media (max-width: 480px){.works-page{padding:8px}.works-container{grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px}.new-work-card{aspect-ratio:1}.new-work-icon{font-size:40px}.tab{padding:10px 12px;font-size:12px}}.editor-layout{display:flex;flex-direction:column;min-height:100vh;background-color:#f5f5f5;overflow-y:auto;overflow-x:hidden}.ai-toolbar{display:flex;justify-content:space-between;align-items:center;padding:10px 20px;background-color:#fff;border-bottom:1px solid #e5e7eb;height:56px;box-shadow:0 1px 3px #0000000a}.ai-toolbar-left{display:flex;align-items:center;gap:10px}.ai-continue-btn{padding:8px 18px;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease;box-shadow:0 2px 4px #22c55e33}.ai-continue-btn:hover{background:linear-gradient(135deg,#16a34a,#15803d);box-shadow:0 4px 8px #22c55e4d;transform:translateY(-1px)}.ai-video-btn{padding:8px 18px;background:linear-gradient(135deg,#3b82f6,#2563eb);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease;box-shadow:0 2px 4px #3b82f633}.ai-video-btn:hover{background:linear-gradient(135deg,#2563eb,#1d4ed8);box-shadow:0 4px 8px #3b82f64d;transform:translateY(-1px)}.toolbar-actions{display:flex;align-items:center;gap:12px;margin-left:16px}.last-saved{font-size:13px;color:#6b7280;white-space:nowrap;font-weight:400}.icon-btn{background:none;border:none;font-size:18px;cursor:pointer;padding:4px;color:#666;transition:color .2s}.icon-btn:hover{color:#333}.chapter-edit-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.chapter-edit-dialog{background-color:#fff;border-radius:8px;width:500px;max-width:90vw;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 4px 20px #00000026}.form-label{display:block;margin-bottom:8px;font-size:14px;font-weight:500;color:#333}.form-input{width:100%;padding:10px 12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;transition:border-color .2s;box-sizing:border-box}.form-input:focus{outline:none;border-color:#22c55e}.form-textarea{width:100%;padding:10px 12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;resize:vertical;transition:border-color .2s;box-sizing:border-box;font-family:inherit}.chapter-summary-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;justify-content:center;align-items:center;z-index:1000}.chapter-summary-dialog{background-color:#fff;border-radius:8px;width:600px;max-width:90vw;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 4px 20px #00000026}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #e0e0e0}.dialog-header h3{margin:0;font-size:18px;font-weight:500;color:#333}.close-btn{background:none;border:none;font-size:24px;color:#666;cursor:pointer;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.dialog-content{padding:20px;flex:1;overflow-y:auto}.summary-textarea{width:100%;padding:12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;resize:vertical;transition:border-color .2s;box-sizing:border-box;font-family:inherit;line-height:1.6}.summary-textarea:focus{outline:none;border-color:#22c55e}.dialog-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 20px;border-top:1px solid #e0e0e0}.btn-cancel{padding:8px 20px;background-color:#f5f5f5;color:#333;border:1px solid #e0e0e0;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.btn-cancel:hover{background-color:#e8e8e8}.btn-save{padding:8px 20px;background-color:#22c55e;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.btn-save:hover{background-color:#16a34a}.chapter-sidebar{width:280px;background-color:#fafafa;border-right:1px solid #e5e7eb;display:flex;flex-direction:column;height:100%;overflow:hidden}.rewards-section{padding:12px 16px;background-color:#f8f9fa;border-bottom:1px solid #e0e0e0}.rewards-title{font-size:14px;font-weight:500;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;margin-bottom:8px}.work-resources{display:flex;gap:8px;margin-top:8px}.resource-link{background:none;border:none;font-size:18px;cursor:pointer;padding:4px 8px;border-radius:4px;transition:background-color .2s}.resource-link:hover{background-color:#e8e8e8}.chapter-toolbar{display:flex;gap:8px;padding:8px 12px;border-bottom:1px solid #f0f0f0;background-color:#fafafa}.toolbar-icon-btn{background:none;border:none;font-size:14px;cursor:pointer;padding:4px 8px;color:#666;border-radius:3px;transition:background-color .2s}.toolbar-icon-btn:hover{background-color:#e8e8e8}.new-chapter-btn{display:flex;align-items:center;justify-content:center;gap:6px;margin:12px;padding:10px 16px;background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border:none;border-radius:8px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s ease;box-shadow:0 2px 4px #22c55e33}.new-chapter-btn:hover{background:linear-gradient(135deg,#16a34a,#15803d);box-shadow:0 4px 8px #22c55e4d;transform:translateY(-1px)}.plus-icon{font-size:18px;font-weight:300}.chapter-list{flex:1;overflow-y:auto;padding:8px;background-color:#fff}.chapter-item{padding:14px;margin-bottom:6px;border-radius:8px;cursor:pointer;transition:all .2s ease;border:1px solid transparent;background-color:#fff}.chapter-item:hover{background-color:#f9fafb;border-color:#e5e7eb;box-shadow:0 1px 3px #0000000d}.chapter-item.active{background:linear-gradient(135deg,#eff6ff,#dbeafe);border-color:#3b82f6;box-shadow:0 2px 6px #3b82f626}.chapter-header{display:flex;flex-direction:column;gap:6px}.chapter-title{font-size:14px;font-weight:500;color:#333}.chapter-meta{display:flex;flex-direction:column;gap:4px;font-size:12px;color:#666}.word-count{font-weight:500}.chapter-actions{display:flex;gap:6px;margin-top:8px;padding-top:8px;border-top:1px solid #e0e0e0}.chapter-action-btn{padding:5px 10px;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:6px;cursor:pointer;font-size:12px;color:#6b7280;transition:all .2s ease;font-weight:500}.chapter-action-btn:hover{background-color:#f3f4f6;border-color:#d1d5db;color:#374151}.chapter-action-btn.delete-btn{color:#dc2626}.chapter-action-btn.delete-btn:hover{background-color:#fee2e2;border-color:#fca5a5}.chapter-more-menu{position:relative}.more-menu-dropdown{position:absolute;top:100%;right:0;margin-top:4px;background-color:#fff;border:1px solid #e0e0e0;border-radius:6px;box-shadow:0 2px 8px #0000001a;display:none;flex-direction:column;min-width:120px;z-index:100;overflow:hidden}.chapter-more-menu:hover .more-menu-dropdown{display:flex}.more-menu-dropdown button{padding:8px 12px;background:none;border:none;text-align:left;cursor:pointer;font-size:13px;color:#333;transition:background-color .2s}.more-menu-dropdown button:hover{background-color:#f5f5f5}.more-menu-dropdown button:not(:last-child){border-bottom:1px solid #f0f0f0}@media (max-width: 768px){.chapter-sidebar{width:100%;border-right:none;border-bottom:1px solid #e5e7eb;max-height:50vh;overflow-y:auto}.chapter-item{padding:12px;margin-bottom:8px;width:100%;box-sizing:border-box;min-width:0}.chapter-header{width:100%;min-width:0}.chapter-title{font-size:15px;word-wrap:break-word;word-break:break-all;overflow-wrap:break-word}.chapter-meta{width:100%;min-width:0;font-size:11px;gap:3px}.chapter-date{word-wrap:break-word;word-break:break-all;overflow-wrap:break-word;white-space:normal;display:block;width:100%}.word-count{display:block;width:100%;margin-bottom:4px}.chapter-list{padding:8px 12px;width:100%;box-sizing:border-box}.new-chapter-btn{margin:12px;width:calc(100% - 24px);box-sizing:border-box;min-height:44px}.rewards-section{padding:10px 12px}.rewards-title{font-size:13px;white-space:normal;word-wrap:break-word}.chapter-actions{flex-wrap:wrap;gap:4px}.chapter-action-btn{flex:1;min-width:60px;min-height:36px;font-size:11px}}@media (max-width: 480px){.chapter-item{padding:10px}.chapter-title{font-size:14px}.chapter-meta{font-size:10px}.chapter-date{font-size:10px;line-height:1.4}.word-count{font-size:11px}.new-chapter-btn{font-size:13px;padding:12px 16px}}.editor-toolbar{display:flex;justify-content:space-between;align-items:center;padding:10px 20px;background-color:#fff;border-bottom:1px solid #e5e7eb;gap:8px;flex-wrap:wrap;box-shadow:0 1px 2px #00000008}.toolbar-left,.toolbar-center,.toolbar-right{display:flex;align-items:center;gap:4px}.toolbar-center{flex:1;justify-content:center}.toolbar-btn{background:none;border:none;padding:7px 11px;cursor:pointer;font-size:15px;color:#6b7280;border-radius:6px;transition:all .2s ease;min-width:36px;display:flex;align-items:center;justify-content:center}.toolbar-btn:hover:not(:disabled){background-color:#f9fafb;color:#374151}.toolbar-btn:disabled{opacity:.5;cursor:not-allowed}.toolbar-divider{width:1px;height:20px;background-color:#e0e0e0;margin:0 4px}.toolbar-btn.active{background:linear-gradient(135deg,#eff6ff,#dbeafe);color:#2563eb}.toolbar-zoom-group{display:flex;align-items:center;gap:4px;padding:0 8px}.zoom-indicator{font-size:12px;color:#666;min-width:35px;text-align:center}.search-bar{display:flex;align-items:center;gap:8px;padding:8px 16px;background-color:#f8f9fa;border-bottom:1px solid #e0e0e0}.search-input{flex:1;padding:6px 12px;border:1px solid #e0e0e0;border-radius:4px;font-size:14px;outline:none}.search-input:focus{border-color:#3b82f6}.search-btn{padding:6px 12px;background-color:#3b82f6;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.search-btn:hover{background-color:#2563eb}.search-close{padding:6px 10px;background:none;border:none;font-size:18px;color:#666;cursor:pointer;border-radius:4px}.search-close:hover{background-color:#e8e8e8}.editor-content{flex:1;display:flex;flex-direction:column;background-color:#fff;height:100%;overflow:hidden}.editor-main{flex:1;display:flex;flex-direction:column;padding:48px 80px;overflow-y:auto;background-color:#fff}.chapter-title-area{margin-bottom:30px}.chapter-title{font-size:28px;font-weight:600;color:#1f2937;margin:0;letter-spacing:-.5px}.editor-textarea-wrapper{flex:1;position:relative}.editor-textarea{width:100%;height:100%;min-height:500px;border:none;outline:none;resize:none;font-size:16px;line-height:2;color:#1f2937;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,PingFang SC,Hiragino Sans GB,Microsoft YaHei,sans-serif;background-color:#fff}.editor-textarea::placeholder{color:#999}.editor-footer{display:flex;justify-content:space-between;align-items:center;padding:20px 0;margin-top:24px;border-top:1px solid #e5e7eb;font-size:13px;color:#6b7280}.word-count-indicator{font-weight:500}.page-indicator{color:#999}.ai-panel-container .ai-continue-overlay{position:static;background-color:transparent;display:block;width:100%;height:100%;padding:0;overflow:hidden}.ai-panel-container .ai-continue-dialog{width:100%;max-width:none;max-height:100%;height:100%;margin:0;border-radius:0;box-shadow:none;display:flex;flex-direction:column;overflow:hidden}.ai-panel-container .dialog-content{max-height:none!important;height:100%;display:flex!important;flex-direction:column!important;padding:8px 10px!important;overflow-y:auto!important;overflow-x:hidden!important;gap:8px!important;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#94a3b8 #f1f5f9}.ai-panel-container .result-section{flex:1;min-height:300px;max-height:500px;display:flex;flex-direction:column;margin-bottom:12px;border:1px solid #e0e0e0;border-radius:6px;background-color:#fff;overflow:hidden}.ai-panel-container .result-content{flex:1;min-height:0;padding:16px 14px!important;font-size:15px!important;line-height:1.8!important;overflow-y:auto!important;overflow-x:hidden!important;-webkit-overflow-scrolling:touch}.ai-panel-container .result-header{padding:8px 14px!important;border-bottom:1px solid #e0e0e0}.ai-panel-container .result-footer{padding:8px 14px!important;border-top:1px solid #e0e0e0}.ai-continue-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:flex-start;justify-content:center;z-index:1000;overflow-y:auto;padding:20px;-webkit-overflow-scrolling:touch}.ai-continue-dialog{background-color:#fff;border-radius:8px;width:85%;max-width:800px;max-height:90vh!important;display:flex!important;flex-direction:column!important;box-shadow:0 4px 20px #0000004d;margin:20px auto;overflow:hidden!important;position:relative}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:10px 14px;border-bottom:1px solid #e0e0e0;flex-shrink:0}.ai-panel-container .dialog-header{padding:8px 10px!important;flex-shrink:0;border-bottom:1px solid #e0e0e0}.header-left{display:flex;flex-direction:column;gap:4px}.dialog-header h3{margin:0;font-size:16px;font-weight:600;color:#333}.token-info-header{display:flex;gap:12px;font-size:12px}.token-balance{color:#667eea;font-weight:600}.estimated-cost{color:#666}.close-btn{background:none;border:none;font-size:28px;color:#999;cursor:pointer;line-height:1;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.dialog-content{flex:1 1 auto!important;overflow-y:auto!important;overflow-x:hidden!important;padding:12px 16px!important;min-height:0!important;max-height:calc(90vh - 180px)!important;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#94a3b8 #f1f5f9;position:relative;display:flex!important;flex-direction:column!important}.dialog-content::-webkit-scrollbar{width:8px!important;display:block!important}.dialog-content::-webkit-scrollbar-track{background:#f1f5f9;border-radius:4px}.dialog-content::-webkit-scrollbar-thumb{background:#94a3b8;border-radius:4px}.dialog-content::-webkit-scrollbar-thumb:hover{background:#64748b}.form-section{margin-bottom:16px}.ai-panel-container .form-section{margin-bottom:10px}.advanced-features-toggle{display:flex;align-items:center;gap:8px;margin-bottom:6px}.advanced-features-label{font-size:12px;font-weight:500;color:#333;cursor:pointer}.advanced-features-desc{font-size:11px;color:#666;line-height:1.4;margin:4px 0 0}.textarea-with-counter{position:relative}.form-textarea{width:100%;padding:6px 8px;border:1px solid #e0e0e0;border-radius:4px;font-size:12px;font-family:inherit;resize:vertical;box-sizing:border-box;transition:border-color .2s}.form-textarea:focus{outline:none;border-color:#22c55e}.character-cards-selector{display:flex;flex-direction:column;gap:8px}.selected-character-tags{display:flex;flex-wrap:wrap;gap:6px}.character-card-tag{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;background-color:#f0f0f0;border-radius:4px;font-size:12px}.btn-select-character{display:flex;align-items:center;gap:6px;padding:6px 12px;border:1px solid #e0e0e0;border-radius:4px;background-color:#fff;color:#333;font-size:12px;cursor:pointer;transition:all .2s}.btn-select-character:hover{border-color:#22c55e;background-color:#f0fdf4}.search-icon{font-size:14px}.selected-glossary-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:8px}.glossary-tag{display:inline-flex;align-items:center;gap:4px;padding:4px 8px;background-color:#f0f0f0;border-radius:4px;font-size:12px}.disclaimer-section{margin-top:12px;padding-top:12px;border-top:1px solid #e0e0e0}.ai-disclaimer{font-size:11px;color:#999;text-align:center;margin:0}.btn-generate-primary{width:100%;padding:10px 20px;background-color:#3b82f6;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.btn-generate-primary:hover:not(:disabled){background-color:#2563eb}.btn-generate-primary:disabled{background-color:#9ca3af;cursor:not-allowed}.ai-panel-container .form-section{margin-bottom:16px;padding:0}.ai-panel-container .form-label{font-size:13px;font-weight:500;color:#333;margin-bottom:8px;display:block}.ai-panel-container .form-select,.ai-panel-container .character-input,.ai-panel-container .custom-prompt-input{width:100%;box-sizing:border-box}.ai-panel-container .prompt-tabs{margin-bottom:12px;border-bottom:2px solid #e0e0e0}.ai-panel-container .prompt-tab{padding:8px 12px;font-size:13px}.ai-panel-container .quick-prompts{max-height:350px;overflow-y:auto;padding-right:4px;margin-top:8px}.ai-panel-container .quick-prompt-item{margin-bottom:8px;padding:10px 12px}.ai-panel-container .character-tags{display:flex;flex-wrap:wrap;gap:6px;align-items:center;margin-top:6px}.ai-panel-container .character-tag{font-size:13px;padding:5px 10px}.ai-panel-container .character-input{flex:1;min-width:150px;margin-top:0}.ai-panel-container .dialog-footer{margin-top:auto;padding-top:12px;border-top:1px solid #e0e0e0;background-color:#fafafa}.ai-panel-container .btn-generate{flex:1;max-width:none}.form-label{display:block;font-size:13px;font-weight:500;color:#333;margin-bottom:6px}.ai-panel-container .form-label{font-size:12px;margin-bottom:5px}.form-select{width:100%;padding:6px 10px;border:1px solid #e0e0e0;border-radius:6px;font-size:13px;background-color:#fff;cursor:pointer;transition:border-color .2s;box-sizing:border-box}.ai-panel-container .form-select{padding:5px 8px;font-size:12px;border-radius:4px}.form-select:focus{outline:none;border-color:#22c55e}.character-tags{display:flex;flex-wrap:wrap;gap:8px;align-items:center}.character-tag{display:inline-flex;align-items:center;gap:6px;padding:6px 12px;background-color:#f0f0f0;border-radius:6px;font-size:14px}.tag-remove{background:none;border:none;color:#999;cursor:pointer;font-size:18px;line-height:1;padding:0;width:18px;height:18px;display:flex;align-items:center;justify-content:center}.tag-remove:hover{color:#333}.character-input{padding:5px 10px;border:1px solid #e0e0e0;border-radius:6px;font-size:13px;min-width:150px;box-sizing:border-box;transition:border-color .2s}.character-input:focus{outline:none;border-color:#22c55e}.prompt-tabs{display:flex;gap:0;border-bottom:2px solid #e0e0e0;margin-bottom:12px}.prompt-tab{padding:8px 16px;background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;font-size:14px;color:#666;margin-bottom:-2px;transition:color .2s}.prompt-tab:hover{color:#22c55e}.prompt-tab.active{color:#22c55e;border-bottom-color:#22c55e;font-weight:500}.quick-prompts{display:flex;flex-direction:column;gap:8px}.quick-prompt-item{padding:10px 12px;background-color:#f9f9f9;border:1px solid #e0e0e0;border-radius:6px;cursor:pointer;transition:all .2s;margin-bottom:6px}.quick-prompt-item:hover{background-color:#f0f0f0;border-color:#d0d0d0}.quick-prompt-item.selected{background-color:#e3f2fd;border-color:#22c55e}.prompt-label{font-size:13px;font-weight:600;color:#333;margin-bottom:4px}.quick-prompt-item.selected .prompt-label{color:#1976d2}.prompt-text{font-size:12px;color:#666;line-height:1.4}.quick-prompt-item.selected .prompt-text{color:#1976d2}.prompt-hint{font-size:12px;color:#999;margin-top:8px}.custom-prompt-input{width:100%;padding:10px;border:1px solid #e0e0e0;border-radius:6px;font-size:13px;font-family:inherit;resize:vertical;box-sizing:border-box;transition:border-color .2s}.ai-panel-container .custom-prompt-input{padding:6px 8px;font-size:12px;border-radius:4px;min-height:60px}.custom-prompt-input:focus{outline:none;border-color:#22c55e}.prompt-file-loader{display:flex;flex-direction:column;gap:16px}.file-loader-section{padding:16px;background-color:#f9f9f9;border:1px solid #e0e0e0;border-radius:6px}.file-loader-label{display:block;font-size:14px;font-weight:500;color:#333;margin-bottom:8px}.file-loader-hint{font-size:12px;color:#666;margin-bottom:12px}.file-input-wrapper{display:flex;flex-direction:column;gap:8px}.btn-load-file{padding:10px 20px;background-color:#3b82f6;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s;align-self:flex-start}.btn-load-file:hover{background-color:#2563eb}.loaded-file-info{display:flex;align-items:center;justify-content:space-between;padding:10px 12px;background-color:#e3f2fd;border:1px solid #90caf9;border-radius:6px;font-size:13px}.file-name{color:#1976d2;font-weight:500}.btn-remove-file{background:none;border:none;color:#1976d2;cursor:pointer;font-size:20px;line-height:1;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.btn-remove-file:hover{background-color:#bbdefb;color:#0d47a1}.loaded-prompt-preview{margin-top:12px}.loaded-prompt-content{width:100%;padding:12px;border:1px solid #e0e0e0;border-radius:6px;font-size:13px;font-family:Courier New,monospace;resize:vertical;background-color:#fafafa;color:#333;line-height:1.6;box-sizing:border-box}.loaded-prompt-content:focus{outline:none;border-color:#3b82f6;background-color:#fff}.preview-hint{font-size:12px;color:#666;margin-top:8px;padding:8px 12px;background-color:#fff3cd;border:1px solid #ffc107;border-radius:4px}.empty-prompt-hint{padding:16px;background-color:#f0f9ff;border:1px solid #bae6fd;border-radius:6px;font-size:13px;color:#0369a1}.empty-prompt-hint p{margin:0 0 8px;font-weight:500}.empty-prompt-hint ul{margin:8px 0 0;padding-left:20px}.empty-prompt-hint li{margin-bottom:6px;line-height:1.6}.empty-prompt-hint code{background-color:#e0e7ff;padding:2px 6px;border-radius:3px;font-family:Courier New,monospace;font-size:12px;color:#1e40af}.subsequent-plot-wrapper{position:relative}.subsequent-plot-input{width:100%;padding:12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;font-family:inherit;resize:vertical;box-sizing:border-box;transition:border-color .2s}.subsequent-plot-input:focus{outline:none;border-color:#22c55e}.chapter-constraint-item{position:relative;margin-bottom:15px}.chapter-constraint-item:last-child{margin-bottom:0}.ai-panel-container .chapter-constraint-item{margin-bottom:10px}.ai-panel-container .chapter-constraint-item:last-child{margin-bottom:0}.constraint-label{display:block;font-size:14px;font-weight:500;color:#333;margin-bottom:8px}.ai-panel-container .constraint-label{font-size:12px;margin-bottom:5px}.constraint-input{width:100%;padding:12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;font-family:inherit;resize:vertical;transition:border-color .2s;box-sizing:border-box}.ai-panel-container .constraint-input{padding:6px 8px;font-size:12px;border-radius:4px;min-height:60px}.constraint-input:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.char-counter{position:absolute;bottom:8px;right:12px;font-size:12px;color:#999;background-color:#ffffffe6;padding:2px 6px;border-radius:3px}.ai-panel-container .char-counter{bottom:5px;right:8px;font-size:11px;padding:2px 4px}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.ai-panel-container .section-header{margin-bottom:6px}.auto-associate{display:flex;align-items:center;gap:8px}.ai-panel-container .auto-associate{gap:6px}.auto-associate-label{display:flex;align-items:center;gap:6px;font-size:13px;color:#666}.ai-panel-container .auto-associate-label{font-size:12px;gap:4px}.auto-associate-input{width:60px;padding:4px 6px;border:1px solid #e0e0e0;border-radius:4px;font-size:13px;box-sizing:border-box}.ai-panel-container .auto-associate-input{width:50px;padding:3px 5px;font-size:12px}.auto-associate-input:disabled{background-color:#f5f5f5;color:#999}.toggle-switch{position:relative;display:inline-block;width:44px;height:24px}.toggle-switch input{opacity:0;width:0;height:0}.toggle-slider{position:absolute;cursor:pointer;top:0;left:0;right:0;bottom:0;background-color:#ccc;transition:.3s;border-radius:24px}.toggle-slider:before{position:absolute;content:"";height:18px;width:18px;left:3px;bottom:3px;background-color:#fff;transition:.3s;border-radius:50%}.toggle-switch input:checked+.toggle-slider{background-color:#22c55e}.toggle-switch input:checked+.toggle-slider:before{transform:translate(20px)}.help-icon{width:18px;height:18px;border-radius:50%;background-color:#e0e0e0;color:#666;font-size:12px;display:flex;align-items:center;justify-content:center;cursor:help}.section-hint{font-size:12px;color:#999;margin-bottom:12px;line-height:1.5}.ai-panel-container .section-hint{font-size:11px;color:#666;margin-bottom:6px;line-height:1.4}.selected-items{display:flex;flex-direction:column;gap:6px;margin-bottom:12px;max-height:200px;overflow-y:auto}.selected-item{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;background-color:#f9f9f9;border-radius:6px;font-size:14px}.item-remove{background:none;border:none;color:#999;cursor:pointer;font-size:18px;line-height:1;padding:0;width:20px;height:20px;display:flex;align-items:center;justify-content:center}.item-remove:hover{color:#333}.action-buttons{display:flex;gap:8px;flex-wrap:wrap}.btn-clear{padding:6px 12px;background-color:#fff;border:1px solid #ff4444;border-radius:6px;color:#f44;cursor:pointer;font-size:13px;transition:all .2s}.btn-clear:hover{background-color:#f44;color:#fff}.btn-quick{padding:6px 12px;background-color:#22c55e;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:13px;transition:all .2s}.btn-quick:hover{background-color:#16a34a}.btn-select{padding:6px 12px;background-color:#22c55e;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:13px;transition:all .2s}.btn-select:hover{background-color:#16a34a}.btn-select-blue{padding:6px 12px;background-color:#3b82f6;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:13px;transition:all .2s}.btn-select-blue:hover{background-color:#2563eb}.selector-panel{margin-top:12px;border:1px solid #e0e0e0;border-radius:6px;max-height:300px;overflow-y:auto}.selector-list{display:flex;flex-direction:column}.selector-item{display:flex;justify-content:space-between;align-items:center;padding:10px 12px;cursor:pointer;font-size:14px;transition:all .2s;border-bottom:1px solid #f0f0f0}.selector-item:last-child{border-bottom:none}.selector-item:hover{background-color:#f5f5f5}.selector-item.selected{background-color:#e3f2fd;color:#1976d2}.check{color:#22c55e;font-weight:700}.dialog-footer{display:flex;justify-content:flex-end;gap:6px;padding:8px 14px;border-top:1px solid #e0e0e0;flex-shrink:0;flex-wrap:wrap}.ai-panel-container .dialog-footer{padding:8px 14px!important;gap:6px!important}.btn-view-result{padding:10px 20px;background-color:#fff;border:1px solid #e0e0e0;border-radius:6px;color:#666;cursor:pointer;font-size:14px;transition:all .2s}.btn-view-result:hover{background-color:#f5f5f5;border-color:#d0d0d0}.btn-generate{padding:10px 30px;background-color:#3b82f6;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.btn-generate:hover{background-color:#2563eb}.btn-generate:disabled{opacity:.6;cursor:not-allowed}.result-section{margin-bottom:0;border:1px solid #e0e0e0;border-radius:4px;background-color:#fff;display:flex;flex-direction:column;overflow:hidden;flex:1;min-height:0;height:100%}.result-header{display:flex;justify-content:space-between;align-items:center;padding:6px 10px;border-bottom:1px solid #e0e0e0;flex-shrink:0;min-height:36px}.result-header h4{margin:0;font-size:13px;font-weight:600;color:#333}.generating-indicator{font-size:13px;color:#22c55e;animation:pulse 1.5s ease-in-out infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.result-content{padding:16px 14px;flex:1;min-height:0;overflow-y:auto;overflow-x:hidden;font-size:15px;line-height:1.8;color:#333;white-space:pre-wrap;word-wrap:break-word;word-break:break-word;overflow-wrap:break-word;-webkit-overflow-scrolling:touch;scrollbar-width:thin;scrollbar-color:#94a3b8 #f1f5f9}.result-content::-webkit-scrollbar{width:6px}.result-content::-webkit-scrollbar-track{background:#f1f5f9;border-radius:3px}.result-content::-webkit-scrollbar-thumb{background:#94a3b8;border-radius:3px}.result-content::-webkit-scrollbar-thumb:hover{background:#64748b}.generating-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;min-height:150px}.generated-content-text{white-space:pre-wrap;word-wrap:break-word;word-break:break-word;overflow-wrap:break-word;color:#333;font-size:15px;line-height:1.8}.result-footer{padding:8px 14px;border-top:1px solid #e0e0e0;display:flex;justify-content:space-between;align-items:center;background-color:#f9f9f9;flex-shrink:0;min-height:36px}.word-count{font-size:13px;color:#666;font-weight:500}.ai-disclaimer{font-size:12px;color:#999}.toggle-config-section{padding:12px 0;text-align:center}.btn-toggle-config{padding:8px 16px;background-color:#f5f5f5;border:1px solid #e0e0e0;border-radius:6px;color:#666;cursor:pointer;font-size:13px;transition:all .2s}.btn-toggle-config:hover{background-color:#e8e8e8;border-color:#d0d0d0}.btn-continue{padding:6px 12px;background-color:#3b82f6;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:13px;transition:all .2s;white-space:nowrap}.btn-continue:hover{background-color:#2563eb}.btn-previous{padding:6px 12px;background-color:#f5f5f5;border:1px solid #e0e0e0;border-radius:6px;color:#666;cursor:pointer;font-size:13px;transition:all .2s;white-space:nowrap}.btn-previous:hover:not(:disabled){background-color:#e8e8e8;border-color:#d0d0d0}.btn-previous:disabled{opacity:.5;cursor:not-allowed}.btn-regenerate{padding:6px 12px;background-color:#fff;border:1px solid #ff4444;border-radius:6px;color:#f44;cursor:pointer;font-size:13px;transition:all .2s;white-space:nowrap}.btn-regenerate:hover{background-color:#f44;color:#fff}.btn-copy-result{padding:6px 12px;background-color:#22c55e;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:13px;transition:all .2s;white-space:nowrap}.btn-copy-result:hover{background-color:#16a34a}.btn-export{padding:6px 12px;background-color:#ff6b35;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:13px;transition:all .2s;white-space:nowrap}.btn-export:hover{background-color:#ff5722}.btn-use{padding:6px 16px;background-color:#22c55e;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:13px;font-weight:500;transition:all .2s;white-space:nowrap}.btn-use:hover{background-color:#16a34a}.chat-section{display:flex;flex-direction:column;max-height:600px;min-height:400px;border:1px solid #e0e0e0;border-radius:8px;background-color:#fff;overflow:hidden}.chat-header{display:flex;justify-content:space-between;align-items:center;padding:12px 16px;border-bottom:1px solid #e0e0e0;background-color:#f8f9fa;flex-shrink:0}.chat-header h4{margin:0;font-size:16px;font-weight:500;color:#333}.btn-exit-chat{padding:6px 12px;background-color:#f5f5f5;border:1px solid #e0e0e0;border-radius:4px;color:#666;cursor:pointer;font-size:12px;transition:all .2s}.btn-exit-chat:hover{background-color:#e8e8e8;border-color:#d0d0d0}.chat-messages{flex:1;overflow-y:auto;overflow-x:hidden;padding:16px;display:flex;flex-direction:column;gap:16px;min-height:0;-webkit-overflow-scrolling:touch}.chat-message{display:flex;flex-direction:column;gap:6px}.user-message{align-items:flex-end}.assistant-message{align-items:flex-start}.message-role{font-size:12px;color:#999;font-weight:500}.user-message .message-role{color:#3b82f6}.assistant-message .message-role{color:#22c55e}.message-content{max-width:80%;padding:12px 16px;border-radius:8px;font-size:14px;line-height:1.6;word-wrap:break-word;white-space:pre-wrap}.user-message .message-content{background-color:#3b82f6;color:#fff;border-bottom-right-radius:2px}.assistant-message .message-content{background-color:#f0f0f0;color:#333;border-bottom-left-radius:2px}.message-content.error-message{background-color:#fee2e2;color:#dc2626;border:1px solid #fca5a5}.chat-input-area{display:flex;gap:8px;padding:12px;border-top:1px solid #e0e0e0;background-color:#fafafa;flex-shrink:0}.chat-input{flex:1;padding:10px 12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;resize:none;font-family:inherit;transition:border-color .2s;box-sizing:border-box}.chat-input:focus{outline:none;border-color:#3b82f6}.chat-input:disabled{background-color:#f5f5f5;cursor:not-allowed}.btn-send-chat{padding:10px 24px;background-color:#3b82f6;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s;white-space:nowrap}.btn-send-chat:hover:not(:disabled){background-color:#2563eb}.btn-send-chat:disabled{background-color:#cbd5e1;cursor:not-allowed}.work-info-bar{display:flex;justify-content:space-between;align-items:center;padding:14px 20px;background-color:#fff;border-bottom:1px solid #e5e7eb;box-shadow:0 1px 3px #0000000a}.work-info-left{display:flex;align-items:center;gap:16px;flex:1}.back-btn{padding:7px 14px;background-color:#f9fafb;border:1px solid #e5e7eb;border-radius:8px;cursor:pointer;font-size:14px;color:#6b7280;transition:all .2s ease;font-weight:500}.back-btn:hover{background-color:#f3f4f6;border-color:#d1d5db;color:#374151}.work-title-info{display:flex;flex-direction:column;gap:4px}.work-title{margin:0;font-size:18px;font-weight:600;color:#333}.work-description{font-size:13px;color:#999}.work-info-right{display:flex;align-items:center;gap:16px}.work-word-count{font-size:14px;color:#666;font-weight:500}.editor-container{display:flex;height:calc(100vh - 180px);overflow:hidden;position:relative}.ai-panel-container{width:0;transition:width .3s ease-in-out;overflow:hidden;border-left:1px solid #e5e7eb;background:#fff;box-shadow:-2px 0 8px #0000000a}.ai-panel-container.visible{width:600px;min-width:600px}.ai-panel-container.hidden{width:0;min-width:0}@media (max-width: 768px){.work-info-bar{padding:12px 16px;flex-wrap:wrap}.work-info-left{width:100%;margin-bottom:12px}.work-info-right{width:100%;justify-content:flex-end;flex-wrap:wrap;gap:12px}.work-title{font-size:16px}.work-description{font-size:12px}.back-btn{padding:10px 14px;font-size:13px;min-height:44px}.editor-container{height:calc(100vh - 200px);flex-direction:column}.ai-panel-container.visible{width:100%;min-width:100%;max-height:50vh;border-left:none;border-top:1px solid #e5e7eb;order:2}.ai-panel-container.hidden{display:none}}@media (max-width: 480px){.work-info-bar{padding:10px 12px}.work-title{font-size:15px}.editor-container{height:calc(100vh - 180px)}.ai-panel-container.visible{max-height:40vh}}.logo-leopard{width:80px;height:60px;background-image:url(/images/leopard-pattern.png);background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:8px;position:relative;overflow:hidden;box-shadow:0 2px 8px #0003}.form-options{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px;font-size:14px}.checkbox-label{display:flex;align-items:center;gap:6px;color:#666;cursor:pointer}.checkbox-input{width:16px;height:16px;cursor:pointer}.forgot-link{color:#22c55e;text-decoration:none;transition:color .2s}.forgot-link:hover{color:#16a34a;text-decoration:underline}.auth-page{min-height:100vh;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#667eea,#764ba2);padding:20px}.auth-container{width:100%;max-width:420px;background-color:#fff;border-radius:12px;box-shadow:0 10px 40px #0000001a;padding:40px}.auth-header{text-align:center;margin-bottom:32px}.auth-logo{display:flex;align-items:center;justify-content:center;gap:8px;margin-bottom:16px}.logo-leopard{width:80px;height:60px;background-image:url(/images/leopard-pattern.png);background-size:cover;background-position:center;background-repeat:no-repeat;border-radius:8px;position:relative;overflow:hidden;box-shadow:0 2px 8px #0003}.logo-leopard:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;background:linear-gradient(135deg,#d2691e,peru,#d2691e,peru,#d2691e);background-size:20px 20px;border-radius:8px;z-index:-1}.auth-title{font-size:28px;font-weight:600;color:#333;margin-bottom:8px}.auth-subtitle{font-size:14px;color:#666}.auth-form{margin-bottom:24px}.auth-error{background-color:#fee2e2;color:#991b1b;padding:12px;border-radius:6px;margin-bottom:20px;font-size:14px;text-align:center}.form-group{margin-bottom:20px}.form-label{display:block;font-size:14px;font-weight:500;color:#333;margin-bottom:8px}.form-input{width:100%;padding:12px 16px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;transition:all .2s;background-color:#fff}.form-input:focus{outline:none;border-color:#22c55e;box-shadow:0 0 0 3px #22c55e1a}.form-input::placeholder{color:#999}.form-agreement{margin-bottom:24px;font-size:13px;color:#666}.checkbox-label{display:flex;align-items:flex-start;gap:6px;cursor:pointer;line-height:1.5}.checkbox-input{width:16px;height:16px;cursor:pointer;margin-top:2px;flex-shrink:0}.agreement-link{color:#22c55e;text-decoration:none}.agreement-link:hover{text-decoration:underline}.auth-button{width:100%;padding:12px;background-color:#22c55e;color:#fff;border:none;border-radius:6px;font-size:16px;font-weight:500;cursor:pointer;transition:all .2s}.auth-button:hover:not(:disabled){background-color:#16a34a;transform:translateY(-1px);box-shadow:0 4px 12px #22c55e4d}.auth-button:active:not(:disabled){transform:translateY(0)}.auth-button:disabled{background-color:#9ca3af;cursor:not-allowed}.auth-footer{text-align:center;padding-top:24px;border-top:1px solid #e0e0e0;font-size:14px;color:#666}.auth-link{color:#22c55e;text-decoration:none;font-weight:500;margin-left:4px;transition:color .2s}.auth-link:hover{color:#16a34a;text-decoration:underline}.token-history-page{padding:24px;max-width:900px;margin:0 auto}.page-header{display:flex;align-items:center;gap:16px;margin-bottom:24px}.btn-back{padding:8px 16px;background:#f5f5f5;border:none;border-radius:6px;cursor:pointer;font-size:14px;color:#666;transition:all .2s}.btn-back:hover{background:#e0e0e0}.page-header h2{margin:0;font-size:24px;font-weight:600;color:#333}.account-summary{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:16px;margin-bottom:24px}.summary-card{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;padding:20px;border-radius:12px;text-align:center}.summary-label{font-size:14px;opacity:.9;margin-bottom:8px}.summary-value{font-size:24px;font-weight:700}.btn-recharge-main{background:linear-gradient(135deg,#22c55e,#16a34a);color:#fff;border:none;padding:20px;border-radius:12px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s}.btn-recharge-main:hover{transform:translateY(-2px);box-shadow:0 4px 12px #22c55e4d}.filter-tabs{display:flex;gap:8px;margin-bottom:20px;border-bottom:2px solid #f0f0f0}.filter-tab{padding:12px 20px;background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;font-size:14px;color:#666;transition:all .2s;margin-bottom:-2px}.filter-tab:hover{color:#667eea}.filter-tab.active{color:#667eea;border-bottom-color:#667eea;font-weight:600}.transactions-list{display:flex;flex-direction:column;gap:12px}.transaction-item{display:flex;align-items:center;gap:16px;padding:16px;background:#fff;border:1px solid #e0e0e0;border-radius:8px;transition:all .2s}.transaction-item:hover{box-shadow:0 2px 8px #0000001a}.transaction-icon{font-size:32px;width:48px;height:48px;display:flex;align-items:center;justify-content:center;background:#f5f5f5;border-radius:50%;flex-shrink:0}.transaction-info{flex:1;min-width:0}.transaction-type{font-size:16px;font-weight:600;color:#333;margin-bottom:4px}.transaction-description{font-size:14px;color:#666;margin-bottom:4px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.transaction-date{font-size:12px;color:#999}.transaction-amount{text-align:right;flex-shrink:0}.amount-value{font-size:18px;font-weight:700;margin-bottom:4px}.token-change{font-size:13px}.transaction-amount.recharge .amount-value{color:#22c55e}.transaction-amount.recharge .token-change{color:#16a34a}.transaction-amount.consume .amount-value{color:#ef4444}.transaction-amount.consume .token-change{color:#dc2626}.empty-state{text-align:center;padding:60px 20px;color:#999}.empty-state p{font-size:16px;margin-bottom:20px}.btn-empty-recharge{padding:10px 24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.btn-empty-recharge:hover{transform:translateY(-1px);box-shadow:0 4px 12px #667eea4d}.loading{text-align:center;padding:60px 20px;font-size:16px;color:#666}.character-cards-page{padding:20px;max-width:1200px;margin:0 auto}.cards-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}.card-item{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:16px;box-shadow:0 2px 4px #0000001a}.card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid #f0f0f0}.card-header h3{margin:0;font-size:18px;color:#333}.card-actions{display:flex;gap:8px}.card-content{font-size:14px;color:#666}.card-field{margin-bottom:12px}.card-field strong{color:#333;display:block;margin-bottom:4px}.card-field p{margin:0;line-height:1.6}.card-tags{display:flex;flex-wrap:wrap;gap:6px;margin-top:12px}.form-group input,.form-group textarea{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;font-family:inherit}.empty-state{grid-column:1 / -1;text-align:center;padding:60px 20px;color:#999}.loading{text-align:center;padding:60px 20px;color:#999}.memos-page{padding:20px;max-width:1200px;margin:0 auto}.memos-list{display:flex;flex-direction:column;gap:16px}.memo-item{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:16px;box-shadow:0 2px 4px #0000001a}.memo-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid #f0f0f0}.memo-header h3{margin:0;font-size:18px;color:#333}.memo-actions{display:flex;align-items:center;gap:8px}.memo-category{padding:4px 8px;background:#f0f0f0;border-radius:4px;font-size:12px;color:#666}.memo-content{margin-bottom:12px;line-height:1.6;color:#666}.empty-content{color:#999;font-style:italic}.memo-tags{display:flex;flex-wrap:wrap;gap:6px}.glossaries-page{padding:20px;max-width:1200px;margin:0 auto}.page-header{display:flex;align-items:center;justify-content:space-between;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #e0e0e0}.page-header h2{margin:0;flex:1;text-align:center}.btn-back{padding:8px 16px;background:#f5f5f5;border:1px solid #ddd;border-radius:4px;cursor:pointer}.btn-new{padding:8px 20px;background:#22c55e;color:#fff;border:none;border-radius:4px;cursor:pointer;font-weight:500}.glossaries-list{display:flex;flex-direction:column;gap:16px}.glossary-item{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:16px;box-shadow:0 2px 4px #0000001a}.glossary-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid #f0f0f0}.glossary-header h3{margin:0;font-size:18px;color:#333}.glossary-actions{display:flex;align-items:center;gap:8px}.glossary-category{padding:4px 8px;background:#f0f0f0;border-radius:4px;font-size:12px;color:#666}.btn-edit,.btn-delete{padding:4px 12px;border:none;border-radius:4px;cursor:pointer;font-size:12px}.btn-edit{background:#3b82f6;color:#fff}.glossary-content{margin-bottom:12px;line-height:1.6;color:#666}.glossary-tags{display:flex;flex-wrap:wrap;gap:6px}.tag{display:inline-block;padding:4px 8px;background:#f0f0f0;border-radius:4px;font-size:12px}.dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.dialog{background:#fff;border-radius:8px;width:90%;max-width:600px;max-height:90vh;overflow-y:auto}.dialog-close{background:none;border:none;font-size:24px;cursor:pointer;color:#999}.dialog-content{padding:20px}.form-group{margin-bottom:16px}.form-group label{display:block;margin-bottom:6px;font-weight:500;color:#333}.form-group input,.form-group textarea,.form-group select{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:4px;font-size:14px;font-family:inherit}.form-group textarea{resize:vertical}.tags-input{display:flex;gap:8px;margin-bottom:8px}.tags-input input{flex:1}.tags-input button{padding:8px 16px;background:#3b82f6;color:#fff;border:none;border-radius:4px;cursor:pointer}.tags-list{display:flex;flex-wrap:wrap;gap:6px}.tags-list .tag{display:flex;align-items:center;gap:4px}.tags-list .tag button{background:none;border:none;cursor:pointer;color:#999;padding:0;margin-left:4px}.dialog-footer{display:flex;justify-content:flex-end;gap:12px;padding:20px;border-top:1px solid #e0e0e0}.btn-cancel,.btn-save{padding:8px 20px;border:none;border-radius:4px;cursor:pointer;font-weight:500}.btn-cancel{background:#f5f5f5;color:#333}.btn-save{background:#22c55e;color:#fff}.empty-state,.loading{text-align:center;padding:60px 20px;color:#999}.video-generate-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000}.video-generate-dialog{background:#fff;border-radius:12px;width:90%;max-width:600px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 40px #0003}.close-btn{background:none;border:none;font-size:28px;color:#999;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.close-btn:hover{background-color:#f5f5f5;color:#333}.dialog-content{padding:20px;max-height:70vh;overflow-y:auto}.video-info{background-color:#f9f9f9;padding:15px;border-radius:8px;margin-bottom:20px}.video-info p{margin:8px 0;color:#666}.settings-section{margin-bottom:20px}.settings-section h4{margin:0 0 15px;color:#333;font-size:16px}.setting-item label{display:block;margin-bottom:5px;color:#666;font-size:14px}.setting-item select,.setting-item input[type=number]{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px}.setting-item .hint{display:block;margin-top:5px;font-size:12px;color:#999}.warning-section{background-color:#fff3cd;border:1px solid #ffc107;border-radius:8px;padding:15px;margin-bottom:20px}.work-select-section{margin-bottom:20px}.work-select-section h4{margin:0 0 10px;color:#333;font-size:16px}.work-select{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;margin-bottom:15px}.chapter-select-section{margin-bottom:20px}.chapter-select-section h4{margin:0 0 10px;color:#333;font-size:16px}.chapter-select{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;margin-bottom:15px}.selected-chapter-info{background-color:#f9f9f9;padding:12px;border-radius:6px;margin-top:10px}.prompt-preview{margin-top:20px;padding:15px;background-color:#f0f9ff;border:1px solid #bae6fd;border-radius:8px;max-height:200px;overflow-y:auto}.prompt-preview h5{margin:0 0 10px;color:#0369a1;font-size:14px}.prompt-preview p{margin:0;color:#0c4a6e;font-size:13px;line-height:1.6;white-space:pre-wrap}.result-info{margin:15px 0;padding:12px;background-color:#f9fafb;border-radius:6px}.result-info h5{margin:0 0 8px;color:#333;font-size:14px;font-weight:600}.result-info p{margin:0;color:#666;font-size:13px;line-height:1.6;white-space:pre-wrap}.scenes-preview{margin-top:20px;padding:15px;background-color:#f0f9ff;border:1px solid #bae6fd;border-radius:8px;max-height:200px;overflow-y:auto}.scenes-preview h5{margin:0 0 10px;color:#0369a1;font-size:14px}.scenes-preview p{margin:5px 0;color:#0c4a6e;font-size:13px}.generated-scenes-list{display:flex;flex-wrap:wrap;gap:8px;margin-top:10px}.scene-item{padding:4px 10px;background-color:#dbeafe;border-radius:4px;font-size:12px;color:#1e40af}.progress-container{margin-bottom:20px}.progress-bar{width:100%;height:24px;background-color:#e0e0e0;border-radius:12px;overflow:hidden;margin-bottom:10px}.progress-fill{height:100%;background:linear-gradient(90deg,#22c55e,#16a34a);transition:width .3s ease;border-radius:12px}.progress-text{font-size:16px;font-weight:600;color:#333}.current-step{font-size:16px;color:#666;margin-bottom:10px}.status-info{margin-top:20px;color:#999;font-size:14px}.completed-section h4{margin:0 0 20px;color:#22c55e;font-size:20px}.video-preview{margin:20px 0;border-radius:8px;overflow:hidden;background-color:#000}.action-buttons{display:flex;gap:10px;justify-content:center;margin-top:20px}.error-section{text-align:center;padding:20px}.error-section h4{margin:0 0 15px;color:#dc2626;font-size:20px}.error-message{color:#666;margin-bottom:20px;padding:15px;background-color:#fee2e2;border-radius:8px}.btn-cancel,.btn-generate,.btn-primary,.btn-secondary{padding:10px 20px;border:none;border-radius:6px;font-size:14px;cursor:pointer;transition:all .2s}.btn-cancel{background-color:#f5f5f5;color:#666}.btn-cancel:hover{background-color:#e0e0e0}.btn-generate,.btn-primary{background-color:#22c55e;color:#fff}.btn-generate:hover,.btn-primary:hover{background-color:#16a34a}.btn-secondary{background-color:#3b82f6;color:#fff;text-decoration:none;display:inline-block}.lora-images-section{margin-top:24px;padding:20px;background:#f9f9f9;border-radius:8px;border:1px solid #e0e0e0}.lora-images-section h4{margin:0 0 8px;font-size:16px;font-weight:600}.section-hint{margin:0 0 16px;font-size:13px;color:#666}.images-selection-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;max-height:300px;overflow-y:auto;padding:8px}.image-selection-card{position:relative;background:#fff;border:2px solid #e0e0e0;border-radius:8px;padding:8px;cursor:pointer;transition:all .2s}.image-selection-card:hover{border-color:#3b82f6;box-shadow:0 2px 8px #3b82f633}.image-selection-card.selected{border-color:#3b82f6;background:#e3f2fd}.image-selection-card input[type=checkbox]{position:absolute;top:8px;right:8px;width:18px;height:18px;cursor:pointer;z-index:10}.image-preview-small{width:100%;aspect-ratio:1;background:#f5f5f5;border-radius:6px;overflow:hidden;margin-bottom:8px}.image-preview-small img{width:100%;height:100%;object-fit:cover}.image-placeholder-small{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#999;font-size:12px}.image-info-small{display:flex;align-items:center;gap:6px}.image-type-badge{font-size:16px}.image-name-small{flex:1;font-size:12px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.selected-images-info{margin-top:12px;padding:8px 12px;background:#e3f2fd;border:1px solid #90caf9;border-radius:6px;font-size:13px;color:#1976d2;text-align:center}.video-generate-page{height:100vh;display:flex;flex-direction:column;background-color:#f5f5f5}.page-header{display:flex;justify-content:space-between;align-items:center;padding:15px 20px;background:#fff;border-bottom:1px solid #e0e0e0;box-shadow:0 2px 4px #0000000d}.page-header h1{margin:0;font-size:24px;color:#333}.header-actions{display:flex;gap:10px;align-items:center}.btn-back,.btn-stop{padding:8px 16px;border-radius:6px;font-size:14px;cursor:pointer;transition:all .2s;border:none}.btn-back{background-color:#f5f5f5;color:#666;border:1px solid #ddd}.btn-back:hover{background-color:#e0e0e0;color:#333}.btn-stop{background-color:#dc2626;color:#fff;font-weight:500}.btn-stop:hover:not(:disabled){background-color:#b91c1c;transform:translateY(-1px);box-shadow:0 2px 8px #dc26264d}.btn-stop:disabled{background-color:#9ca3af;cursor:not-allowed;opacity:.7}.book-list-container{flex:1;padding:30px;overflow-y:auto}.book-list-container h2{margin:0 0 20px;font-size:20px;color:#333}.book-card{background:#fff;border-radius:8px;padding:20px;cursor:pointer;transition:all .2s;box-shadow:0 2px 8px #0000001a;border:2px solid transparent}.book-card:hover{transform:translateY(-2px);box-shadow:0 4px 12px #00000026;border-color:#22c55e}.book-cover{width:100%;height:200px;margin-bottom:15px;border-radius:6px;overflow:hidden;background-color:#f0f0f0;display:flex;align-items:center;justify-content:center}.book-info h3{margin:0 0 10px;font-size:18px;color:#333}.book-info p{margin:0;font-size:14px;color:#666;line-height:1.5}.empty-state{text-align:center;padding:60px 20px;color:#999;font-size:16px}.loading{text-align:center;padding:60px 20px;color:#666;font-size:16px}.video-generate-layout{flex:1;display:flex;flex-direction:column;overflow:hidden}.video-toolbar{display:flex;justify-content:space-between;align-items:center;padding:12px 20px;background:#fff;border-bottom:1px solid #e0e0e0;flex-wrap:wrap;gap:10px}.toolbar-left{display:flex;align-items:center;gap:15px;flex:1;min-width:200px}.toolbar-left h2{margin:0;font-size:18px;color:#333}.toolbar-right{display:flex;gap:10px;align-items:center;flex-wrap:wrap}.video-content-layout{flex:1;display:flex;overflow:hidden}.video-sidebar{width:300px;background:#fff;border-right:1px solid #e0e0e0;overflow-y:auto}.video-sidebar .chapter-sidebar{height:100%;display:flex;flex-direction:column}.video-sidebar .rewards-section{padding:15px;border-bottom:1px solid #e0e0e0}.video-sidebar .rewards-title{font-size:16px;font-weight:600;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.video-sidebar .chapter-list{flex:1;overflow-y:auto;padding:10px}.video-sidebar .chapter-item{padding:12px;margin-bottom:8px;border-radius:6px;cursor:pointer;transition:all .2s;border:1px solid transparent}.video-sidebar .chapter-item:hover{background-color:#f5f5f5}.video-sidebar .chapter-item.active{background-color:#e8f5e9;border-color:#22c55e}.video-sidebar .chapter-header{display:flex;flex-direction:column;gap:5px}.video-sidebar .chapter-title{font-size:14px;font-weight:500;color:#333}.video-sidebar .chapter-meta{font-size:12px;color:#999}.video-sidebar .word-count{margin-right:10px}.status-badge{display:inline-block;padding:2px 8px;border-radius:10px;font-size:11px;font-weight:500;margin-left:8px}.status-badge.generating{background-color:#dbeafe;color:#1e40af}.status-badge.ready,.status-badge.completed{background-color:#dcfce7;color:#166534}.status-badge.failed{background-color:#fee2e2;color:#991b1b}.status-badge.stopped{background-color:#f3f4f6;color:#6b7280}.video-main-content{flex:1;overflow-y:auto;padding:20px;background:#f5f5f5}.chapter-header{background:#fff;padding:20px;border-radius:8px;margin-bottom:20px;box-shadow:0 2px 4px #0000000d}.chapter-header h3{margin:0 0 10px;font-size:20px;color:#333}.chapter-header p{margin:0;color:#666;font-size:14px}.settings-section{background:#fff;padding:20px;border-radius:8px;margin-bottom:20px;box-shadow:0 2px 4px #0000000d}.settings-section h4{margin:0 0 20px;font-size:18px;color:#333;padding-bottom:10px;border-bottom:2px solid #22c55e}.settings-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(250px,1fr));gap:20px;margin-bottom:20px}.form-group{margin-bottom:15px}.form-group label{display:block;margin-bottom:8px;font-weight:500;color:#666;font-size:14px}.form-select,.form-input{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;transition:border-color .2s}.form-select:focus,.form-input:focus{outline:none;border-color:#22c55e;box-shadow:0 0 0 3px #22c55e1a}.action-section{text-align:center;padding-top:20px}.btn-generate{padding:12px 40px;background-color:#22c55e;color:#fff;border:none;border-radius:6px;font-size:16px;font-weight:600;cursor:pointer;transition:all .2s}.btn-generate:hover:not(:disabled){background-color:#16a34a;transform:translateY(-2px);box-shadow:0 4px 12px #22c55e4d}.btn-generate:disabled{background-color:#ccc;cursor:not-allowed}.progress-section{background:#fff;padding:20px;border-radius:8px;margin-bottom:20px;box-shadow:0 2px 4px #0000000d}.progress-section h4{margin:0 0 15px;font-size:18px;color:#333;display:flex;align-items:center;gap:10px}.badge-background{background-color:#22c55e;color:#fff;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:400}.progress-container{margin-bottom:15px}.progress-bar{width:100%;height:30px;background-color:#e0e0e0;border-radius:15px;overflow:hidden;margin-bottom:10px}.progress-fill{height:100%;background:linear-gradient(90deg,#22c55e,#16a34a);transition:width .3s ease;border-radius:15px}.progress-text{text-align:center;font-size:18px;font-weight:600;color:#333}.current-step{text-align:center;font-size:14px;color:#666}.scenes-section{background:#fff;padding:20px;border-radius:8px;box-shadow:0 2px 4px #0000000d}.scenes-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #22c55e}.scenes-header h4{margin:0;font-size:18px;color:#333}.scenes-actions{display:flex;gap:10px;flex-wrap:wrap}.btn-secondary,.btn-primary{padding:8px 16px;border-radius:6px;font-size:14px;cursor:pointer;transition:all .2s;border:none}.btn-secondary{background-color:#f5f5f5;color:#666;border:1px solid #ddd}.btn-secondary:hover:not(:disabled){background-color:#e0e0e0;color:#333}.btn-primary:disabled,.btn-secondary:disabled{opacity:.6;cursor:not-allowed}.summary-box{background:#f0f9ff;border:1px solid #bae6fd;border-radius:6px;padding:15px;margin-bottom:20px}.summary-box h5{margin:0 0 10px;color:#0369a1;font-size:14px}.summary-box p{margin:0;color:#0c4a6e;font-size:13px;line-height:1.6}.scenes-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:20px}.scene-item{background-color:#fdfdfd;border:2px solid #e0e0e0;border-radius:8px;padding:15px;transition:all .2s}.scene-item.selected{border-color:#22c55e;box-shadow:0 0 0 2px #22c55e33}.scene-header{display:flex;align-items:center;gap:10px;margin-bottom:15px;padding-bottom:10px;border-bottom:1px solid #f0f0f0}.scene-header h5{margin:0;font-size:16px;color:#333;flex-grow:1}.btn-delete-scene{background:none;border:none;color:#999;font-size:20px;cursor:pointer;line-height:1;transition:color .2s;padding:0;width:24px;height:24px;display:flex;align-items:center;justify-content:center}.btn-delete-scene:hover{color:#ef4444}.scene-content{display:flex;flex-direction:column;gap:15px}.form-textarea{width:100%;padding:8px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;font-family:inherit;resize:vertical;min-height:60px}.form-textarea:focus{outline:none;border-color:#22c55e;box-shadow:0 0 0 3px #22c55e1a}.error-section{background:#fff;padding:20px;border-radius:8px;border-left:4px solid #dc2626;box-shadow:0 2px 4px #0000000d}.error-section h4{margin:0 0 15px;color:#dc2626;font-size:18px}.error-message{padding:15px;background-color:#fee2e2;border-radius:6px;color:#991b1b;margin-bottom:15px;font-size:14px;line-height:1.6;white-space:pre-wrap}.btn-reset{padding:10px 20px;background-color:#f5f5f5;color:#666;border:1px solid #ddd;border-radius:6px;font-size:14px;cursor:pointer;transition:all .2s}.btn-reset:hover{background-color:#e0e0e0;color:#333}.videos-section{background:#fff;padding:20px;border-radius:8px;margin-bottom:20px;box-shadow:0 2px 4px #0000000d}.videos-section h2{margin:0 0 20px;font-size:20px;color:#333}.videos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px}.video-item{background:#f9f9f9;border-radius:8px;padding:15px;border:1px solid #e0e0e0}.video-item h4{margin:0 0 15px;font-size:16px;color:#333}.video-error{padding:20px;background:#fee2e2;border-radius:6px;color:#991b1b;text-align:center}.success-section{background:#fff;padding:30px;border-radius:8px;text-align:center;box-shadow:0 2px 4px #0000000d}.success-section h2{margin:0 0 15px;color:#22c55e;font-size:24px}.success-section p{margin:0;color:#666;font-size:16px}.video-generate-content{flex:1;overflow-y:auto;padding:20px}.dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.dialog-content{background:#fff;border-radius:8px;box-shadow:0 4px 20px #0000004d;width:90%;max-width:600px;max-height:80vh;display:flex;flex-direction:column;overflow:hidden}.dialog-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #e0e0e0}.dialog-header h3{margin:0;font-size:20px;color:#333}.dialog-close{background:none;border:none;font-size:24px;color:#999;cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.dialog-close:hover{background-color:#f5f5f5;color:#333}.dialog-body{padding:20px;overflow-y:auto;flex:1}.dialog-footer{display:flex;justify-content:flex-end;gap:10px;padding:20px;border-top:1px solid #e0e0e0}.form-hint{font-size:12px;color:#666;margin:5px 0 10px;line-height:1.5}.video-scene-generate-page{padding:20px;max-width:1600px;margin:0 auto;width:100%;min-height:calc(100vh - 40px)}.page-header{display:flex;align-items:center;gap:16px;margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid #e0e0e0}.page-content{background:#fff;border-radius:8px;padding:24px;box-shadow:0 2px 8px #0000001a}.scenes-count-small{color:#3b82f6;font-weight:500}.settings-section{margin-bottom:24px;padding:20px;background:#f9fafb;border-radius:8px;border:1px solid #e0e0e0}.settings-section h3{margin:0 0 20px;font-size:18px;font-weight:600;color:#333}.loading-state,.empty-state{text-align:center;padding:40px;color:#666}.works-list,.chapters-list{margin-top:20px}.works-list h2,.chapters-list h2{margin:0 0 12px;font-size:20px;font-weight:600;color:#333}.section-hint{margin:0 0 20px;font-size:14px;color:#666}.works-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px;margin-top:20px}.work-card{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:20px;cursor:pointer;transition:all .2s}.work-card:hover{border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626;transform:translateY(-2px)}.work-card h3{margin:0 0 12px;font-size:18px;font-weight:600;color:#333}.work-description{margin:0 0 12px;font-size:14px;color:#666;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.work-meta{font-size:12px;color:#999}.chapters-table{margin-top:20px;overflow-x:auto}.chapters-table table{width:100%;border-collapse:collapse;background:#fff}.chapters-table th{background:#f9fafb;padding:12px;text-align:left;font-weight:600;font-size:14px;color:#333;border-bottom:2px solid #e0e0e0}.chapters-table td{padding:12px;border-bottom:1px solid #f0f0f0;font-size:14px;color:#666}.chapters-table tr:hover{background:#f9fafb}.chapter-title-cell{display:flex;align-items:center;gap:8px}.has-summary{font-size:16px;cursor:help}.status-badge{font-weight:500;font-size:13px}.progress-cell{display:flex;align-items:center;gap:8px;min-width:120px}.progress-bar-small{flex:1;height:8px;background-color:#e0e0e0;border-radius:4px;overflow:hidden}.progress-fill-small{height:100%;background:linear-gradient(90deg,#3b82f6,#2563eb);transition:width .3s ease;border-radius:4px}.progress-text-small{font-size:12px;color:#666;min-width:35px;text-align:right}.scenes-count{font-weight:500;color:#3b82f6}.action-buttons-cell{display:flex;gap:8px}.btn-generate,.btn-view,.btn-retry{padding:6px 12px;border:none;border-radius:4px;font-size:13px;cursor:pointer;transition:all .2s}.btn-generate{background-color:#22c55e;color:#fff}.btn-generate:hover:not(:disabled){background-color:#16a34a}.btn-generate:disabled{background-color:#9ca3af;cursor:not-allowed}.btn-view{background-color:#3b82f6;color:#fff}.btn-view:hover{background-color:#2563eb}.btn-retry{background-color:#f59e0b;color:#fff}.btn-retry:hover{background-color:#d97706}.generating-text{font-size:13px;color:#3b82f6;font-style:italic}.scenes-view-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background-color:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000}.scenes-view-dialog{background:#fff;border-radius:12px;width:90%;max-width:900px;max-height:90vh;overflow:hidden;display:flex;flex-direction:column;box-shadow:0 10px 40px #0003}.scenes-view-dialog .dialog-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #e0e0e0}.scenes-view-dialog .dialog-header h3{margin:0;font-size:20px;color:#333}.scenes-view-dialog .close-btn{background:none;border:none;font-size:28px;color:#999;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.scenes-view-dialog .close-btn:hover{background-color:#f5f5f5;color:#333}.scenes-view-dialog .dialog-content{padding:20px;overflow-y:auto;flex:1}.dialog-info{margin-bottom:20px;padding-bottom:20px;border-bottom:1px solid #f0f0f0}.dialog-info p{margin:8px 0;color:#666;font-size:14px}.summary-section{margin-top:16px;padding:16px;background-color:#f0f9ff;border:1px solid #bae6fd;border-radius:8px}.summary-section h4{margin:0 0 12px;font-size:16px;color:#0369a1}.summary-section p{margin:0;color:#0c4a6e;line-height:1.6;white-space:pre-wrap}.scenes-list-dialog{margin-top:20px}.scenes-list-dialog h4{margin:0 0 16px;font-size:18px;color:#333}.scene-card-dialog{background:#f9fafb;border:1px solid #e0e0e0;border-radius:8px;padding:16px;margin-bottom:16px}.scene-header-dialog{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid #e0e0e0}.scene-header-dialog h5{margin:0;font-size:16px;font-weight:600;color:#333}.scene-duration-dialog{padding:4px 12px;background-color:#e3f2fd;color:#1976d2;border-radius:12px;font-size:12px;font-weight:500}.scene-content-dialog{display:flex;flex-direction:column;gap:12px}.scene-description-dialog,.scene-prompt-dialog{padding:12px;background-color:#fff;border-radius:6px}.scene-description-dialog strong,.scene-prompt-dialog strong{display:block;margin-bottom:8px;color:#333;font-size:14px}.scene-description-dialog p,.scene-prompt-dialog p{margin:0;color:#666;font-size:14px;line-height:1.6;white-space:pre-wrap}.scene-prompt-dialog{background-color:#f0f9ff;border:1px solid #bae6fd}.scene-prompt-dialog p{color:#0c4a6e;font-style:italic}.empty-scenes{text-align:center;padding:40px;color:#999}.scenes-view-dialog .dialog-footer{padding:20px;border-top:1px solid #e0e0e0;display:flex;justify-content:flex-end}.form-section{margin-bottom:24px}.form-section h3{margin:0 0 12px;font-size:18px;font-weight:600;color:#333}.form-select{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;background:#fff;cursor:pointer;margin-bottom:12px}.selected-chapter-info{background-color:#f9f9f9;padding:12px;border-radius:6px;margin-top:12px}.selected-chapter-info p{margin:5px 0;color:#666;font-size:14px}.setting-item{margin-bottom:16px}.setting-item label{display:block;margin-bottom:6px;color:#666;font-size:14px;font-weight:500}.setting-item select,.setting-item input[type=number]{width:100%;padding:10px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px}.setting-item select:focus,.setting-item input[type=number]:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.setting-item .hint{display:block;margin-top:6px;font-size:12px;color:#999}.info-section{background-color:#f0f9ff;padding:16px;border-radius:8px;margin-bottom:20px;border:1px solid #bae6fd}.info-section p{margin:8px 0;color:#0369a1;font-size:14px}.warning-section{background-color:#fff3cd;border:1px solid #ffc107;border-radius:8px;padding:16px;margin-bottom:24px}.warning-section p{margin:0 0 10px;font-weight:600;color:#856404}.warning-section ul{margin:0;padding-left:20px;color:#856404}.warning-section li{margin:5px 0;font-size:14px}.action-buttons{display:flex;gap:12px;justify-content:flex-start}.btn-primary,.btn-secondary{padding:12px 24px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s}.btn-primary{background-color:#22c55e;color:#fff}.btn-primary:hover:not(:disabled){background-color:#16a34a}.btn-secondary{background-color:#3b82f6;color:#fff}.btn-secondary:hover{background-color:#2563eb}.generating-section{text-align:center;padding:40px 20px}.result-preview{margin-top:24px;padding:16px;background-color:#f0f9ff;border:1px solid #bae6fd;border-radius:8px;text-align:left}.result-preview h4{margin:0 0 12px;color:#0369a1;font-size:16px}.result-preview p{margin:0;color:#0c4a6e;font-size:14px;line-height:1.6;white-space:pre-wrap}.completed-section{text-align:center;padding:20px}.success-icon{font-size:64px;margin-bottom:20px}.completed-section h2{margin:0 0 24px;color:#22c55e;font-size:24px}.result-section{text-align:left;margin:24px 0;padding:20px;background-color:#f9fafb;border-radius:8px}.result-section h3{margin:0 0 16px;color:#333;font-size:18px;font-weight:600}.result-section .summary-info{margin:0 0 16px;color:#666;font-size:14px;font-weight:500}.result-section p{margin:0 0 16px;color:#666;font-size:14px;line-height:1.6;white-space:pre-wrap}.scenes-list{display:flex;flex-direction:column;gap:16px;max-height:calc(100vh - 400px);min-height:500px;overflow-y:auto;padding:8px}.scene-card{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:16px;transition:all .2s}.scene-card:hover{box-shadow:0 4px 12px #0000001a;border-color:#3b82f6}.scene-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;padding-bottom:12px;border-bottom:1px solid #f0f0f0}.scene-header h4{margin:0;font-size:16px;font-weight:600;color:#333}.scene-duration{padding:4px 12px;background-color:#e3f2fd;color:#1976d2;border-radius:12px;font-size:12px;font-weight:500}.scene-content{display:flex;flex-direction:column;gap:12px}.scene-description,.scene-prompt{padding:12px;background-color:#f9f9f9;border-radius:6px}.scene-description strong,.scene-prompt strong{display:block;margin-bottom:8px;color:#333;font-size:14px}.scene-description p,.scene-prompt p{margin:0;color:#666;font-size:14px;line-height:1.6;white-space:pre-wrap}.scene-prompt{background-color:#f0f9ff;border:1px solid #bae6fd}.scene-prompt p{color:#0c4a6e;font-style:italic}.error-section{text-align:center;padding:40px 20px}.error-message{color:#666;margin-bottom:24px;padding:16px;background-color:#fee2e2;border-radius:8px;font-size:14px;max-width:100%;overflow-x:auto;text-align:left}.error-message p{margin:4px 0;line-height:1.6}.video-generate-from-images-page{padding:20px;max-width:1400px;margin:0 auto}.page-header{display:flex;align-items:center;gap:15px;margin-bottom:20px}.btn-back{padding:8px 16px;background:#f3f4f6;border:1px solid #d1d5db;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.btn-back:hover{background:#e5e7eb}.page-header h1{margin:0;font-size:24px;font-weight:600}.page-content{background:#fff;border-radius:8px;padding:30px;box-shadow:0 1px 3px #0000001a}.loading-state{text-align:center;padding:40px;color:#6b7280}.works-list h2{margin-top:0;margin-bottom:10px;font-size:20px}.section-hint{color:#6b7280;font-size:14px;margin-bottom:20px}.empty-state{text-align:center;padding:60px 20px;color:#6b7280}.empty-state p{margin-bottom:20px}.works-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}.work-card{padding:20px;border:1px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s}.work-card:hover{border-color:#3b82f6;box-shadow:0 4px 6px #0000001a}.work-card h3{margin:0 0 10px;font-size:18px;color:#111827}.work-description{color:#6b7280;font-size:14px;margin-bottom:10px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.work-meta{display:flex;gap:15px;font-size:14px;color:#6b7280}.page-layout-split{display:flex;gap:20px;height:calc(100vh - 120px)}.left-panel{width:300px;background:#fff;border-radius:8px;padding:20px;box-shadow:0 1px 3px #0000001a;overflow-y:auto}.panel-header{margin-bottom:20px}.panel-header h2{margin:0 0 5px;font-size:18px}.chapters-list-sidebar{display:flex;flex-direction:column;gap:10px}.chapter-item{padding:15px;border:1px solid #e5e7eb;border-radius:6px;cursor:pointer;transition:all .2s}.chapter-item:hover{border-color:#3b82f6;background:#f9fafb}.chapter-item.selected{border-color:#3b82f6;background:#eff6ff}.chapter-item-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.chapter-item-header h3{margin:0;font-size:16px;font-weight:500}.status-badge-small{font-size:12px;padding:2px 8px;border-radius:4px;background:#f3f4f6}.chapter-item-meta{display:flex;gap:15px;font-size:12px;color:#6b7280;margin-bottom:8px}.videos-count-small{color:#3b82f6;font-weight:500}.progress-bar-mini{height:4px;background:#e5e7eb;border-radius:2px;overflow:hidden;margin-top:8px}.progress-fill-mini{height:100%;background:#3b82f6;transition:width .3s}.right-panel{flex:1;background:#fff;border-radius:8px;padding:30px;box-shadow:0 1px 3px #0000001a;overflow-y:auto}.empty-selection{text-align:center;padding:60px 20px;color:#6b7280}.chapter-detail-panel{display:flex;flex-direction:column;gap:20px}.chapter-detail-header{display:flex;justify-content:space-between;align-items:center;padding-bottom:15px;border-bottom:1px solid #e5e7eb}.chapter-detail-header h2{margin:0;font-size:22px}.chapter-info{display:flex;gap:15px;align-items:center}.status-badge{font-size:14px;padding:4px 12px;border-radius:6px;background:#f3f4f6;font-weight:500}.error-message{padding:12px 16px;background:#fef2f2;border:1px solid #fecaca;border-radius:6px;color:#dc2626}.actions-section{display:flex;flex-direction:column;gap:30px;padding:20px;background:#f9fafb;border-radius:8px}.action-group{display:flex;flex-direction:column;gap:10px}.action-group h3{margin:0;font-size:16px;font-weight:600}.hint{color:#6b7280;font-size:14px;margin:0}.btn-primary{padding:10px 20px;background:#3b82f6;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.btn-primary:hover:not(:disabled){background:#2563eb}.btn-primary:disabled{background:#9ca3af;cursor:not-allowed}.btn-generate-large{padding:12px 24px;font-size:16px}.image-upload-area{display:flex;align-items:center;gap:15px}.upload-button{padding:10px 20px;background:#3b82f6;color:#fff;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;display:inline-block;transition:all .2s}.upload-button:hover{background:#2563eb}.upload-count{color:#6b7280;font-size:14px}.image-previews{display:grid;grid-template-columns:repeat(auto-fill,minmax(150px,1fr));gap:15px;margin-top:15px}.image-preview-item{position:relative;border:1px solid #e5e7eb;border-radius:6px;overflow:hidden;aspect-ratio:1}.image-preview-item img{width:100%;height:100%;object-fit:cover}.btn-remove{position:absolute;top:5px;right:5px;width:24px;height:24px;background:#0009;color:#fff;border:none;border-radius:50%;cursor:pointer;font-size:18px;line-height:1;display:flex;align-items:center;justify-content:center}.image-index{position:absolute;bottom:5px;left:5px;background:#0009;color:#fff;padding:2px 8px;border-radius:4px;font-size:12px}.generating-section{padding:20px;background:#f0f9ff;border:1px solid #bae6fd;border-radius:8px}.progress-container{margin-bottom:10px}.progress-bar{height:8px;background:#e5e7eb;border-radius:4px;overflow:hidden;margin-bottom:8px}.progress-fill{height:100%;background:#3b82f6;transition:width .3s}.progress-text{text-align:center;font-size:14px;color:#6b7280}.current-step{text-align:center;color:#3b82f6;font-weight:500}.videos-section{margin-top:30px}.videos-section h3{margin-bottom:15px;font-size:18px}.videos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:20px}.video-card{border:1px solid #e5e7eb;border-radius:8px;overflow:hidden;transition:all .2s}.video-card:hover{box-shadow:0 4px 6px #0000001a}.video-card img{width:100%;aspect-ratio:16/9;object-fit:cover}.video-placeholder{width:100%;aspect-ratio:16/9;background:#f3f4f6;display:flex;align-items:center;justify-content:center;color:#6b7280}.video-info{padding:12px}.video-info h4{margin:0 0 8px;font-size:14px;font-weight:500}.scenes-section{margin-top:20px}.scenes-section h3{margin-bottom:15px;font-size:18px}.scenes-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:15px;margin-bottom:20px}.scene-card{padding:15px;border:2px solid #e5e7eb;border-radius:8px;cursor:pointer;transition:all .2s;background:#fff}.scene-card:hover{border-color:#3b82f6;box-shadow:0 4px 6px #0000001a}.scene-card.selected{border-color:#3b82f6;background:#eff6ff}.scene-card.completed{border-color:#22c55e}.scene-card-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.scene-card-header h4{margin:0;font-size:16px;font-weight:600}.scene-status-badge{font-size:12px;padding:2px 8px;border-radius:4px;background:#f3f4f6;font-weight:500}.scene-card-content{display:flex;flex-direction:column;gap:8px}.scene-description{font-size:14px;color:#6b7280;margin:0;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden}.scene-meta{display:flex;gap:15px;font-size:12px;color:#6b7280}.has-video{color:#22c55e;font-weight:500}.scene-progress{margin-top:10px}.scenes-count-badge{font-size:12px;padding:2px 8px;border-radius:4px;background:#3b82f6;color:#fff;font-weight:500}.no-scenes-badge{font-size:12px;padding:2px 8px;border-radius:4px;background:#f3f4f6;color:#6b7280}.chapter-hint{margin-top:8px;padding:8px;background:#fef3c7;border-radius:4px}.chapter-hint p{margin:0;font-size:12px;color:#92400e}.generate-section{margin-top:30px;padding:20px;background:#f9fafb;border-radius:8px}.generate-section-fixed{position:sticky;top:0;z-index:10;margin-top:0;margin-bottom:20px;box-shadow:0 2px 8px #0000001a;background:#fff;border:1px solid #e5e7eb}.selected-scene-info{margin-bottom:15px}.selected-scene-info h4{margin:0 0 8px;font-size:16px}.selected-scene-info p{margin:0;color:#6b7280;font-size:14px}.modal-content{background:#fff;border-radius:8px;width:90%;max-width:600px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 25px -5px #0000001a}.video-generate-dialog{max-width:700px}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:1px solid #e5e7eb}.modal-header h2{margin:0;font-size:20px}.btn-close{width:32px;height:32px;background:none;border:none;font-size:24px;cursor:pointer;color:#6b7280;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.btn-close:hover{background:#f3f4f6;color:#111827}.modal-body{padding:20px;overflow-y:auto;flex:1;display:flex;flex-direction:column;gap:20px}.scene-info-section,.settings-section,.reference-image-section{padding:15px;background:#f9fafb;border-radius:6px}.scene-info-section h3,.settings-section h3,.reference-image-section h3{margin:0 0 15px;font-size:16px;font-weight:600}.scene-info-item{margin-bottom:12px}.scene-info-item:last-child{margin-bottom:0}.scene-info-item label{font-weight:500;color:#374151;display:inline-block;min-width:80px}.scene-info-item p{margin:5px 0 0;color:#6b7280;font-size:14px;line-height:1.6}.setting-item{margin-bottom:15px}.setting-item:last-child{margin-bottom:0}.setting-item label{display:block;margin-bottom:8px;font-weight:500;color:#374151}.setting-item select{width:100%;padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;background:#fff}.image-preview-container{position:relative;display:inline-block;margin-top:10px}.image-preview-container img{max-width:100%;max-height:300px;border-radius:6px;border:1px solid #e5e7eb}.image-preview-container .btn-remove{position:absolute;top:10px;right:10px;padding:6px 12px;background:#000000b3;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:14px}.modal-footer{padding:20px;border-top:1px solid #e5e7eb;display:flex;justify-content:flex-end;gap:10px}.btn-secondary{padding:10px 20px;background:#f3f4f6;color:#374151;border:1px solid #d1d5db;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.btn-secondary:hover:not(:disabled){background:#e5e7eb}.btn-secondary:disabled{opacity:.5;cursor:not-allowed}.scenes-list{display:flex;flex-direction:column;gap:15px}.scene-item{padding:15px;border:1px solid #e5e7eb;border-radius:6px;background:#f9fafb}.scene-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:10px}.scene-header h4{margin:0;font-size:16px;font-weight:600}.scene-duration{font-size:14px;color:#6b7280}.scene-content{display:flex;flex-direction:column;gap:8px}.scene-content p{margin:0;font-size:14px;line-height:1.6}.scene-content strong{color:#111827}.modal-actions{margin-top:20px;display:flex;justify-content:flex-end}.loading-images{text-align:center;padding:20px;color:#6b7280}.chapter-images-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(120px,1fr));gap:12px;margin-top:15px;max-height:300px;overflow-y:auto;padding:8px}.chapter-image-item{position:relative;border:2px solid #e5e7eb;border-radius:8px;overflow:hidden;cursor:pointer;transition:all .2s;background:#fff;aspect-ratio:1}.chapter-image-item:hover{border-color:#3b82f6;box-shadow:0 4px 6px #0000001a}.chapter-image-item.selected{border-color:#3b82f6;background:#eff6ff}.image-checkbox{position:absolute;top:5px;left:5px;z-index:10;background:#ffffffe6;border-radius:4px;padding:2px}.image-checkbox input[type=checkbox]{width:18px;height:18px;cursor:pointer}.chapter-image-item img{width:100%;height:100%;object-fit:cover;display:block}.image-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:#f3f4f6;color:#6b7280;font-size:12px;text-align:center;padding:8px}.image-name{position:absolute;bottom:0;left:0;right:0;background:linear-gradient(to top,rgba(0,0,0,.7),transparent);color:#fff;padding:8px 4px 4px;font-size:11px;text-align:center;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.btn-use-image{position:absolute;top:50%;left:50%;transform:translate(-50%,-50%);padding:6px 12px;background:#3b82f6;color:#fff;border:none;border-radius:4px;font-size:12px;cursor:pointer;opacity:0;transition:opacity .2s;z-index:5}.chapter-image-item.selected .btn-use-image{opacity:1}.btn-use-image:hover{background:#2563eb}@media (max-width: 768px){.video-generate-from-images-page{padding:12px}.page-header{flex-direction:column;align-items:flex-start;gap:12px;margin-bottom:16px}.page-header h1{font-size:20px}.page-content{padding:16px}.page-layout-split{flex-direction:column;height:auto;gap:16px}.left-panel{width:100%;max-height:40vh;order:2}.right-panel{width:100%;order:1;padding:16px}.chapter-item{padding:12px}.chapter-item-header h3{font-size:15px}.chapter-item-meta{flex-wrap:wrap;gap:8px;font-size:11px}.scenes-grid{grid-template-columns:1fr;gap:12px}.scene-card{padding:12px}.scene-card-header h4{font-size:15px}.image-previews{grid-template-columns:repeat(auto-fill,minmax(100px,1fr));gap:10px}.chapter-images-grid{grid-template-columns:repeat(auto-fill,minmax(80px,1fr));gap:8px}.btn-primary,.btn-secondary,.upload-button{padding:12px 20px;font-size:14px;min-height:44px;width:100%}.btn-back{padding:10px 16px;font-size:13px;min-height:44px}.modal-content{width:95%;max-width:none;max-height:95vh;margin:10px}.modal-header,.modal-body,.modal-footer{padding:16px}.modal-header h2{font-size:18px}.generate-section,.generate-section-fixed{padding:16px;margin-top:20px}.actions-section{padding:16px;gap:20px}.action-group h3{font-size:15px}.videos-grid{grid-template-columns:1fr;gap:16px}}@media (max-width: 480px){.video-generate-from-images-page{padding:8px}.page-header h1{font-size:18px}.page-content,.left-panel,.right-panel{padding:12px}.chapter-item,.scene-card{padding:10px}.image-previews{grid-template-columns:repeat(auto-fill,minmax(80px,1fr))}.chapter-images-grid{grid-template-columns:repeat(auto-fill,minmax(70px,1fr))}}.videos-page{padding:24px;max-width:1400px;margin:0 auto}.videos-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:24px}.videos-header h1{margin:0;font-size:28px;font-weight:600;color:#333}.header-actions{display:flex;gap:12px}.videos-filters{display:flex;gap:16px;align-items:center;margin-bottom:24px;padding:16px;background:#f8f9fa;border-radius:8px;flex-wrap:wrap}.filter-group{display:flex;align-items:center;gap:8px}.filter-group label{font-weight:500;color:#555;white-space:nowrap}.filter-group select{padding:8px 12px;border:1px solid #ddd;border-radius:6px;font-size:14px;background:#fff;cursor:pointer;min-width:150px}.filter-group select:focus{outline:none;border-color:#4a90e2;box-shadow:0 0 0 3px #4a90e21a}.btn-primary{padding:10px 20px;background:#4a90e2;color:#fff;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:background .2s}.btn-secondary{padding:8px 16px;background:#fff;color:#555;border:1px solid #ddd;border-radius:6px;font-size:14px;cursor:pointer;transition:all .2s}.btn-secondary:hover{background:#f5f5f5;border-color:#bbb}.btn-icon{background:none;border:none;cursor:pointer;font-size:18px;padding:4px 8px;border-radius:4px;transition:background .2s}.btn-icon:hover{background:#f0f0f0}.btn-link{background:none;border:none;color:#4a90e2;cursor:pointer;font-size:13px;text-decoration:underline;padding:0}.btn-link:hover{color:#357abd}.loading-container{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:60px 20px;color:#666}.loading-spinner{width:40px;height:40px;border:4px solid #f3f3f3;border-top:4px solid #4a90e2;border-radius:50%;animation:spin 1s linear infinite;margin-bottom:16px}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.error-message{padding:12px 16px;background:#fee;color:#c33;border-radius:6px;margin-bottom:24px;border:1px solid #fcc}.empty-state{text-align:center;padding:80px 20px;color:#666}.empty-icon{font-size:64px;margin-bottom:16px}.empty-state h3{margin:0 0 8px;font-size:20px;color:#333}.empty-state p{margin:0 0 24px;color:#888}.videos-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:24px}.video-card{background:#fff;border:1px solid #e0e0e0;border-radius:12px;overflow:hidden;transition:box-shadow .2s,transform .2s}.video-card:hover{box-shadow:0 4px 12px #0000001a;transform:translateY(-2px)}.video-card-header{display:flex;justify-content:space-between;align-items:flex-start;padding:16px;border-bottom:1px solid #f0f0f0}.video-title-section{flex:1;min-width:0}.video-title{margin:0 0 8px;font-size:16px;font-weight:600;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.status-badge{display:inline-block;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:500}.status-pending{background:#fff3cd;color:#856404}.status-processing{background:#cfe2ff;color:#084298}.status-ready,.status-completed{background:#d1e7dd;color:#0f5132}.status-failed{background:#f8d7da;color:#842029}.status-stopped{background:#e2e3e5;color:#41464b}.video-actions{display:flex;gap:4px;align-items:center}.btn-icon.btn-save{color:#22c55e;font-size:18px}.btn-icon.btn-save:hover{background:#f0fdf4;color:#16a34a}.saved-badge{display:inline-block;padding:4px 10px;border-radius:12px;font-size:12px;font-weight:500;background:#d1e7dd;color:#0f5132;margin-right:4px}.btn-link.btn-save-scene{color:#22c55e;font-size:13px}.btn-link.btn-save-scene:hover{background:#f0fdf4;color:#16a34a}.btn-link.btn-regenerate{color:#3b82f6;font-size:13px}.btn-link.btn-regenerate:hover{background:#eff6ff;color:#2563eb}.saved-badge-scene{display:inline-block;padding:2px 8px;border-radius:8px;font-size:12px;font-weight:500;background:#d1e7dd;color:#0f5132;margin-left:4px}.video-preview{position:relative;width:100%;aspect-ratio:16 / 9;background:#000;overflow:hidden}.video-thumbnail{width:100%;height:100%;object-fit:cover}.video-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;color:#999;background:#f5f5f5}.video-placeholder span{font-size:48px;margin-bottom:8px}.video-placeholder p{margin:0;font-size:14px}.video-progress-overlay{position:absolute;bottom:0;left:0;right:0;background:#000000b3;padding:12px;display:flex;align-items:center;gap:12px}.progress-bar{flex:1;height:6px;background:#ffffff4d;border-radius:3px;overflow:hidden}.progress-fill{height:100%;background:#4a90e2;transition:width .3s}.progress-text{color:#fff;font-size:12px;font-weight:500;min-width:40px;text-align:right}.video-play-overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:#0000004d;opacity:0;transition:opacity .2s}.video-preview:hover .video-play-overlay{opacity:1}.video-no-video-overlay{position:absolute;top:0;left:0;right:0;bottom:0;display:flex;align-items:center;justify-content:center;background:#00000080}.no-video-message{text-align:center;color:#fff;padding:16px}.no-video-message span{font-size:32px;display:block;margin-bottom:8px}.no-video-message p{margin:0 0 4px;font-size:14px;font-weight:500}.no-video-message small{font-size:12px;opacity:.9}.play-button{width:64px;height:64px;border-radius:50%;background:#ffffffe6;border:none;font-size:24px;cursor:pointer;display:flex;align-items:center;justify-content:center;transition:transform .2s,background .2s}.play-button:hover{transform:scale(1.1);background:#fff}.video-info{padding:16px}.info-row{display:flex;margin-bottom:8px;font-size:14px}.info-row:last-child{margin-bottom:0}.info-label{color:#666;min-width:80px;font-weight:500}.info-value{color:#333;flex:1}.error-row{display:flex;margin-top:8px;padding-top:8px;border-top:1px solid #f0f0f0;font-size:13px}.error-label{color:#c33;min-width:80px;font-weight:500}.error-value{color:#c33;flex:1}.video-scenes{border-top:1px solid #f0f0f0;padding:16px;background:#fafafa}.scenes-header{font-weight:600;color:#555;margin-bottom:12px;font-size:14px}.scenes-list{display:flex;flex-direction:column;gap:8px;max-height:200px;overflow-y:auto}.scene-item{display:flex;gap:12px;padding:10px;background:#fff;border-radius:6px;border:1px solid #e0e0e0;transition:border-color .2s}.scene-item.completed{border-color:#d1e7dd;background:#f8fff9}.scene-number{flex-shrink:0;width:28px;height:28px;display:flex;align-items:center;justify-content:center;background:#f0f0f0;border-radius:4px;font-size:12px;font-weight:600;color:#666}.scene-item.completed .scene-number{background:#d1e7dd;color:#0f5132}.scene-info{flex:1;min-width:0}.scene-description{font-size:13px;color:#333;margin-bottom:6px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.scene-status-badge{width:18px;height:18px;display:flex;align-items:center;justify-content:center;border-radius:50%;font-size:10px;font-weight:600}.scene-status-badge.completed{background:#d1e7dd;color:#0f5132}.scene-status-badge.failed{background:#f8d7da;color:#842029}.scene-status-badge.pending{background:#fff3cd;color:#856404}@media (max-width: 768px){.videos-page{padding:12px}.videos-header{flex-direction:column;align-items:flex-start;gap:12px;padding:16px 12px}.videos-header h1{font-size:20px}.videos-filters{flex-direction:column;align-items:stretch;gap:12px;width:100%}.filter-group{flex-direction:column;align-items:stretch;gap:8px;width:100%}.filter-group label{font-size:13px}.filter-group select,.filter-group input{width:100%;min-height:44px;font-size:14px;padding:10px 12px}.videos-grid{grid-template-columns:1fr;gap:16px;margin-top:16px}.video-card{width:100%}.video-card-header{padding:12px}.video-card-header h3{font-size:16px}.video-card-body{padding:12px}.video-actions{flex-direction:column;gap:8px}.btn-action{width:100%;min-height:44px;padding:12px 16px}.scenes-list{max-height:300px}.scene-item{padding:10px}.video-modal-content{max-width:95vw;margin:10px}.video-modal-header{padding:12px 16px}.video-modal-header h3{font-size:16px}.video-modal-body{padding:16px}.video-modal-body video{max-height:60vh}}@media (max-width: 480px){.videos-page{padding:8px}.videos-header{padding:12px 8px}.videos-header h1{font-size:18px}.videos-filters{gap:10px}.videos-grid{gap:12px}.video-card-header,.video-card-body{padding:10px}}.video-player-container{position:relative;width:100%;height:100%;background:#000}.video-player{width:100%;height:100%;object-fit:contain}.video-player-info{position:absolute;top:0;left:0;right:0;background:linear-gradient(to bottom,rgba(0,0,0,.7),transparent);padding:12px 16px;display:flex;justify-content:space-between;align-items:center;z-index:10}.playing-scene-label{color:#fff;font-size:14px;font-weight:500}.btn-close-player{background:#fff3;border:none;color:#fff;width:28px;height:28px;border-radius:50%;cursor:pointer;font-size:20px;line-height:1;display:flex;align-items:center;justify-content:center;transition:background .2s}.btn-close-player:hover{background:#ffffff4d}.scene-item.playing{background:#f0f7ff;border-color:#4a90e2}.btn-playing{color:#4a90e2;font-weight:500}.video-error-message{display:flex;flex-direction:column;align-items:center;justify-content:center;width:100%;height:100%;color:#fff;padding:20px;text-align:center}.video-error-message span{font-size:48px;margin-bottom:12px}.video-error-message p{margin:0 0 12px;font-size:16px}.video-modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#000c;display:flex;align-items:center;justify-content:center;z-index:10000;padding:20px}.video-modal-content{background:#fff;border-radius:12px;max-width:90vw;max-height:90vh;width:100%;display:flex;flex-direction:column;box-shadow:0 8px 32px #0000004d}.video-modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 20px;border-bottom:1px solid #e0e0e0}.video-modal-header h3{margin:0;font-size:18px;font-weight:600;color:#333}.video-modal-body{padding:20px;flex:1;overflow:auto;display:flex;flex-direction:column;align-items:center}.video-modal-body video{width:100%;max-width:100%;max-height:70vh;border-radius:8px;background:#000}.btn-close{background:none;border:none;font-size:24px;color:#666;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.btn-close:hover{background:#f0f0f0;color:#333}.scene-status{display:flex;align-items:center;gap:8px}.btn-link{background:none;border:none;color:#4a90e2;cursor:pointer;font-size:14px;padding:4px 8px;border-radius:4px;transition:all .2s;text-decoration:none}.btn-link:hover{background:#f0f7ff;color:#357abd}.btn-link.btn-danger{color:#dc3545}.btn-link.btn-danger:hover{background:#fff5f5;color:#c82333}.btn-link.btn-primary{color:#28a745}.btn-link.btn-primary:hover{background:#f0fff4;color:#218838}.image-generate-page{padding:20px;max-width:1600px;margin:0 auto;width:100%;min-height:calc(100vh - 40px)}.page-header{display:flex;align-items:center;gap:16px;margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid #e0e0e0;position:relative;z-index:10}.page-header h1{margin:0;font-size:24px;font-weight:600;color:#333}.btn-refresh-header{margin-left:auto!important;padding:8px 16px!important;background:#3b82f6!important;color:#fff!important;border:none!important;border-radius:4px!important;cursor:pointer!important;font-size:14px!important;font-weight:500!important;pointer-events:auto!important;z-index:1000!important;position:relative!important;user-select:none;-webkit-user-select:none;transition:background-color .2s}.btn-refresh-header:hover{background:#2563eb!important}.btn-refresh-header:active{background:#1d4ed8!important}.btn-refresh-header:focus{outline:2px solid #3b82f6;outline-offset:2px}.btn-back{padding:8px 16px;background-color:#f5f5f5;border:1px solid #e0e0e0;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.btn-back:hover{background-color:#e8e8e8;border-color:#d0d0d0}.book-list-container{background:#fff;border-radius:8px;padding:24px;box-shadow:0 2px 8px #0000001a}.book-list-container h2{margin:0 0 20px;font-size:20px;font-weight:600}.book-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:20px}.book-card{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:16px;cursor:pointer;transition:all .2s}.book-card:hover{border-color:#3b82f6;box-shadow:0 4px 12px #3b82f626}.book-cover{width:100%;height:200px;margin-bottom:12px;border-radius:6px;overflow:hidden;background:#f5f5f5}.book-cover img{width:100%;height:100%;object-fit:cover}.book-info h3{margin:0 0 8px;font-size:16px;font-weight:600}.book-info p{margin:0;font-size:14px;color:#666;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.work-detail-container{position:relative}.loading-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#ffffffe6;display:flex;align-items:center;justify-content:center;z-index:100;font-size:16px;color:#666;pointer-events:none}.page-layout-split{display:flex;gap:20px;height:calc(100vh - 140px);min-height:600px}.left-panel{width:350px;background:#fff;border-radius:8px;padding:20px;box-shadow:0 2px 8px #0000001a;display:flex;flex-direction:column;overflow:hidden}.panel-header{margin-bottom:16px;padding-bottom:16px;border-bottom:1px solid #e0e0e0}.panel-header h2{margin:0 0 8px;font-size:18px;font-weight:600;color:#333}.chapters-list-sidebar{flex:1;overflow-y:auto;display:flex;flex-direction:column;gap:12px}.right-panel{flex:1;background:#fff;border-radius:8px;padding:24px;box-shadow:0 2px 8px #0000001a;overflow-y:auto}.empty-selection{display:flex;align-items:center;justify-content:center;height:100%;color:#999;font-size:16px}.chapter-detail-panel{height:100%}.chapter-detail-header{margin-bottom:24px;padding-bottom:16px;border-bottom:2px solid #e0e0e0}.chapter-detail-header h2{margin:0 0 12px;font-size:24px;font-weight:600;color:#333}.chapter-info{display:flex;gap:16px;align-items:center;font-size:14px;color:#666}.content-grid{display:grid;grid-template-columns:1fr 1fr;gap:24px;align-items:start}.selection-panel,.images-panel{display:flex;flex-direction:column;gap:20px;min-height:0;position:relative;z-index:1}.section-card{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:20px;box-shadow:0 2px 8px #0000001a;position:relative;z-index:1}.section-card h3{margin:0 0 16px;font-size:18px;font-weight:600;padding-bottom:12px;border-bottom:2px solid #f0f0f0}.chapters-list{display:flex;flex-direction:column;gap:8px;max-height:300px;overflow-y:auto}.chapter-item{padding:16px;border:1px solid #e0e0e0;border-radius:8px;cursor:pointer;transition:all .2s;background:#fff}.chapter-item:hover{border-color:#3b82f6;box-shadow:0 2px 8px #3b82f626}.chapter-item.selected{border-color:#3b82f6;background:#f0f9ff;box-shadow:0 2px 8px #3b82f633}.chapter-item-header{display:flex;justify-content:space-between;align-items:flex-start;margin-bottom:8px}.chapter-item-header h3{margin:0;font-size:16px;font-weight:600;color:#333;flex:1}.status-badge-small{font-size:12px;font-weight:500;padding:2px 8px;border-radius:4px;background:#0000000d}.chapter-item-meta{display:flex;justify-content:space-between;align-items:center;font-size:12px;color:#666;margin-bottom:8px}.images-count-small{color:#3b82f6;font-weight:500}.progress-bar-mini{width:100%;height:4px;background-color:#e0e0e0;border-radius:2px;overflow:hidden;margin-top:8px}.progress-fill-mini{height:100%;background:linear-gradient(90deg,#3b82f6,#2563eb);transition:width .3s ease}.chapter-item.clickable{cursor:pointer;display:flex;justify-content:space-between;align-items:center}.chapter-item.clickable:hover{background:#f0f0f0;border-color:#3b82f6}.chapter-arrow{color:#999;font-size:16px}.btn-primary{padding:12px 24px;background-color:#3b82f6;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.btn-primary:hover:not(:disabled){background-color:#2563eb}.btn-primary:disabled{background-color:#9ca3af;cursor:not-allowed}.btn-generate-large{width:100%;padding:14px;font-size:16px;font-weight:600;margin-top:20px}.empty-state-small{text-align:center;padding:20px;color:#999;font-size:13px}.section-hint{font-size:12px;color:#666;margin:8px 0;font-style:italic}.items-list{display:flex;flex-direction:column;gap:12px;max-height:400px;overflow-y:auto}.item-card{display:flex;gap:12px;padding:12px;background:#f9f9f9;border:1px solid #e0e0e0;border-radius:6px}.item-card input[type=checkbox]{margin-top:4px;width:18px;height:18px;cursor:pointer}.item-info{flex:1}.item-info h4{margin:0 0 6px;font-size:16px;font-weight:600}.item-info p{margin:0 0 8px;font-size:14px;color:#666;line-height:1.5;overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical}.btn-generate-small{padding:6px 12px;background-color:#3b82f6;border:none;border-radius:4px;color:#fff;cursor:pointer;font-size:13px;transition:all .2s}.btn-generate-small:hover{background-color:#2563eb}.images-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(200px,1fr));gap:16px;max-height:none;overflow-y:visible}.image-card{position:relative;background:#fff;border:1px solid #e0e0e0;border-radius:8px;overflow:hidden;transition:all .2s}.image-card:hover{box-shadow:0 4px 12px #00000026}.image-card.selected-for-compose{border:2px solid #3b82f6;box-shadow:0 0 0 3px #3b82f61a}.image-checkbox{position:absolute;top:10px;left:10px;z-index:10;background:#ffffffe6;padding:5px;border-radius:4px;box-shadow:0 2px 4px #0000001a}.image-preview{width:100%;aspect-ratio:1;background:#f5f5f5;overflow:hidden;position:relative}.image-preview img{width:100%;height:100%;object-fit:cover}.image-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;color:#999;font-size:14px}.image-error-overlay{position:absolute;top:0;left:0;right:0;bottom:0;background:#dc2626e6;display:flex;align-items:center;justify-content:center;padding:16px}.image-error-text{color:#fff;font-size:13px;text-align:center;line-height:1.5;word-break:break-word}.image-info{padding:12px;display:flex;align-items:center;gap:8px}.image-type{font-size:20px}.image-name{flex:1;font-size:14px;font-weight:500;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.btn-delete{padding:4px 8px;background-color:#fee2e2;border:1px solid #fca5a5;border-radius:4px;color:#dc2626;cursor:pointer;font-size:12px;transition:all .2s}.btn-delete:hover{background-color:#fecaca;border-color:#f87171}.empty-state{text-align:center;padding:40px;color:#999;font-size:14px}.loading{text-align:center;padding:40px;color:#666;font-size:14px}.btn-refresh-images{padding:6px 12px!important;font-size:12px!important;background:#3b82f6!important;color:#fff!important;border:1px solid #2563eb!important;border-radius:4px!important;cursor:pointer!important;pointer-events:auto!important;z-index:1000!important;position:relative!important;user-select:none;-webkit-user-select:none;transition:background-color .2s}.btn-refresh-images:hover{background:#2563eb!important}.btn-refresh-images:active{background:#1d4ed8!important}.btn-refresh-images:focus{outline:2px solid #3b82f6;outline-offset:2px}.tabs-container{margin-bottom:24px}.tabs{display:flex;gap:8px;border-bottom:2px solid #e0e0e0}.tab{padding:12px 24px;background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;font-size:14px;font-weight:500;color:#666;transition:all .2s;margin-bottom:-2px}.tab:hover{color:#3b82f6}.tab.active{color:#3b82f6;border-bottom-color:#3b82f6}.image-tabs{display:flex;gap:8px;border-bottom:2px solid #e0e0e0;margin-bottom:24px}.image-tab{padding:12px 24px;background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;font-size:14px;font-weight:500;color:#666;transition:all .2s;margin-bottom:-2px}.image-tab:hover{color:#3b82f6;background:#f0f9ff}.image-tab.active{color:#3b82f6;border-bottom-color:#3b82f6;background:#f0f9ff}.reference-image-upload{margin-top:12px}.btn-upload-reference{padding:10px 20px;background-color:#f3f4f6;border:2px dashed #d1d5db;border-radius:8px;color:#374151;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s;width:100%;display:flex;align-items:center;justify-content:center;gap:8px}.btn-upload-reference:hover:not(:disabled){background-color:#e5e7eb;border-color:#9ca3af}.btn-upload-reference:disabled{opacity:.6;cursor:not-allowed}.reference-image-preview{position:relative;display:inline-block;width:100%;max-width:400px;border-radius:8px;overflow:hidden;border:2px solid #e0e0e0}.reference-image-preview img{width:100%;height:auto;display:block}.btn-remove-reference{position:absolute;top:8px;right:8px;padding:6px 12px;background-color:#dc2626e6;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:12px;font-weight:500;transition:all .2s}.btn-remove-reference:hover:not(:disabled){background-color:#dc2626}.btn-remove-reference:disabled{opacity:.6;cursor:not-allowed}.identify-sections{margin-bottom:24px;padding:20px;background:#f0f9ff;border-radius:8px;border:1px solid #bae6fd}.identify-sections h3{margin:0 0 12px;font-size:18px;font-weight:600;color:#0369a1}.identify-section-item{margin-bottom:24px;padding:16px;background:#fff;border-radius:8px;border:1px solid #e0e0e0}.identify-section-item:last-child{margin-bottom:0}.identify-section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:12px}.identify-section-header h4{margin:0;font-size:16px;font-weight:600;color:#333}.identify-buttons{display:flex;gap:12px;margin-bottom:16px;flex-wrap:wrap}.identify-progress{display:flex;align-items:center;gap:12px;margin-top:12px}.progress-text-small{font-size:12px;color:#666;min-width:40px;text-align:right}.error-message-small{margin-top:12px;padding:8px 12px;background-color:#fee2e2;border:1px solid #fca5a5;border-radius:6px;color:#dc2626;font-size:13px}.btn-identify{padding:8px 16px;border:none;border-radius:6px;font-size:14px;font-weight:500;cursor:pointer;transition:all .2s;color:#fff;white-space:nowrap}.btn-identify-scenes{background-color:#3b82f6}.btn-identify-scenes:hover:not(:disabled){background-color:#2563eb}.btn-identify-characters{background-color:#8b5cf6}.btn-identify-characters:hover:not(:disabled){background-color:#7c3aed}.btn-identify-items{background-color:#10b981}.btn-identify-items:hover:not(:disabled){background-color:#059669}.btn-identify:disabled{background-color:#9ca3af;cursor:not-allowed;opacity:.6}.identified-results{margin-top:20px;padding:16px;background:#fff;border-radius:8px;border:1px solid #e0e0e0}.identified-results{margin-top:16px;padding:16px;background:#f9fafb;border-radius:8px;border:1px solid #e0e0e0}.identified-results h4,.identified-results h5{margin:0 0 16px;font-size:16px;font-weight:600;color:#333}.identified-results h5{font-size:14px;margin-bottom:12px}.identified-list{display:flex;flex-direction:column;gap:12px}.identified-item{display:flex;justify-content:space-between;align-items:flex-start;padding:16px;background:#f9fafb;border:1px solid #e0e0e0;border-radius:6px;gap:16px}.identified-item-content{flex:1}.identified-item-name{margin-bottom:8px}.identified-item-name strong{font-size:16px;color:#333}.identified-item-description{font-size:14px;color:#666;line-height:1.5;white-space:pre-wrap}.btn-generate-from-result{padding:8px 16px;background-color:#22c55e;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s;white-space:nowrap}.btn-generate-from-result:hover:not(:disabled){background-color:#16a34a}.btn-generate-from-result:disabled{background-color:#9ca3af;cursor:not-allowed}.generate-section{margin-bottom:24px;padding:20px;background:#f9fafb;border-radius:8px;border:1px solid #e0e0e0}.generate-section h3{margin:0 0 20px;font-size:18px;font-weight:600;color:#333}.generating-section{text-align:center;padding:40px 20px;margin-bottom:24px}.progress-container{margin-bottom:24px}.progress-bar{width:100%;height:32px;background-color:#e0e0e0;border-radius:16px;overflow:hidden;margin-bottom:12px}.progress-fill{height:100%;background:linear-gradient(90deg,#22c55e,#16a34a);transition:width .3s ease;border-radius:16px}.progress-text{font-size:18px;font-weight:600;color:#333}.current-step{font-size:16px;color:#666;margin-bottom:20px}.images-section{margin-top:24px}.images-section h3{margin:0 0 20px;font-size:18px;font-weight:600;color:#333}.empty-images{text-align:center;padding:40px;color:#999;font-size:14px}.empty-images .empty-hint{font-size:12px;color:#999;margin-top:8px}.error-section{text-align:center;padding:40px 20px;margin-bottom:24px;background:#fef2f2;border:1px solid #fecaca;border-radius:8px}.error-icon{font-size:64px;margin-bottom:20px}.error-section h2{margin:0 0 16px;color:#dc2626;font-size:24px}.error-section .error-message{padding:16px;background:#fff;border:1px solid #fca5a5;border-radius:6px;text-align:left;max-width:600px;margin:20px auto}.error-section .error-message strong{display:block;margin-bottom:8px;color:#dc2626}.error-section .error-message p{margin:0;color:#666;line-height:1.6;white-space:pre-wrap}.error-actions{display:flex;gap:12px;justify-content:center;margin-top:24px}.generate-form{background:#fff;border:1px solid #e0e0e0;border-radius:8px;padding:20px;margin-bottom:24px;box-shadow:0 2px 8px #0000001a}.form-section{margin-bottom:20px}.form-section:last-child{margin-bottom:0}.form-label{display:block;margin-bottom:8px;font-size:14px;font-weight:600;color:#333}.form-textarea{width:100%;padding:12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;font-family:inherit;resize:vertical;min-height:120px}.form-textarea:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.form-select{width:100%;padding:10px 12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;background:#fff;cursor:pointer}.form-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.char-counter{text-align:right;font-size:12px;color:#999;margin-top:4px}.generate-btn{padding:12px 24px;background-color:#3b82f6;border:none;border-radius:6px;color:#fff;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.generate-btn:hover:not(:disabled){background-color:#2563eb}.generate-btn:disabled{background-color:#9ca3af;cursor:not-allowed}.error-message{padding:12px;background-color:#fee2e2;border:1px solid #fca5a5;border-radius:6px;color:#dc2626;margin-top:16px}.scenes-panel,.items-panel{margin-bottom:24px}.scenes-list,.items-list{margin-top:20px}.scenes-list h4,.items-list h4{margin:0 0 12px;font-size:16px;font-weight:600}.scene-item{display:flex;justify-content:space-between;align-items:center;padding:16px;background:#f9f9f9;border:1px solid #e0e0e0;border-radius:6px;margin-bottom:12px}.scene-info h5{margin:0 0 8px;font-size:16px;font-weight:600}.scene-info p{margin:0;font-size:14px;color:#666;line-height:1.5}.section-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:16px}.section-header h3{margin:0}.empty-hint{font-size:12px;color:#999;margin-top:8px}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;padding:20px}.modal-content{background:#fff;border-radius:12px;width:100%;max-width:600px;max-height:90vh;display:flex;flex-direction:column;box-shadow:0 20px 25px -5px #0000001a,0 10px 10px -5px #0000000a}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px 24px;border-bottom:1px solid #e0e0e0}.modal-header h3{margin:0;font-size:20px;font-weight:600;color:#333}.modal-close{background:none;border:none;font-size:28px;color:#999;cursor:pointer;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:all .2s}.modal-close:hover{background:#f5f5f5;color:#333}.modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:20px 24px;border-top:1px solid #e0e0e0}.btn-secondary{padding:10px 20px;background-color:#f3f4f6;border:1px solid #d1d5db;border-radius:6px;color:#374151;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.btn-secondary:hover:not(:disabled){background-color:#e5e7eb;border-color:#9ca3af}.btn-secondary:disabled{opacity:.6;cursor:not-allowed}.prompt-preview{padding:12px;background:#f9fafb;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;color:#333;line-height:1.6;white-space:pre-wrap;max-height:200px;overflow-y:auto}.identified-item-preview{padding:16px;background:#f0f9ff;border:1px solid #bae6fd;border-radius:8px;margin-bottom:16px}.identified-item-preview .identified-item-name{margin-bottom:8px}.identified-item-preview .identified-item-name strong{font-size:16px;color:#0369a1}.identified-item-preview .identified-item-description{font-size:14px;color:#666;line-height:1.6;white-space:pre-wrap}.chapter-content-preview-collapsible{margin-bottom:20px;padding:12px;background:#f9fafb;border:1px solid #e0e0e0;border-radius:8px}.chapter-content-toggle{padding:8px 16px;background:#3b82f6;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s}.chapter-content-toggle:hover{background:#2563eb}.chapter-content-preview-text{margin-top:12px;padding:16px;background:#fff;border:1px solid #e0e0e0;border-radius:6px;max-height:300px;overflow-y:auto}.chapter-content-text{font-size:14px;line-height:1.8;color:#333;white-space:pre-wrap;word-wrap:break-word}body>div[style*="position: fixed"][style*="bottom: 0"][style*=overflow-x],body>div[style*="position:fixed"][style*="bottom:0"][style*=overflow-x]{display:none!important}@media (max-width: 768px){.page-layout-split{flex-direction:column;height:auto;min-height:auto}.left-panel{width:100%;max-height:300px}.right-panel{width:100%}.modal-content{max-width:100%;max-height:95vh}}.interactive-novel-page{padding:20px;max-width:1200px;margin:0 auto}.page-header{margin-bottom:30px}.page-header h1{font-size:28px;font-weight:600;margin-bottom:12px;color:#333}.page-description{font-size:16px;color:#666;line-height:1.6;margin:0}.page-content{margin-top:30px}.loading-state{text-align:center;padding:60px 20px;color:#999;font-size:16px}.empty-state{text-align:center;padding:60px 20px}.empty-state p{font-size:16px;color:#666;margin-bottom:20px}.btn-primary{background:#4a90e2;color:#fff;border:none;padding:12px 24px;border-radius:6px;font-size:15px;font-weight:500;cursor:pointer;transition:background .2s}.btn-primary:hover{background:#357abd}.works-section{margin-bottom:40px}.works-section h2{font-size:22px;font-weight:600;margin-bottom:12px;color:#333}.section-hint{font-size:14px;color:#666;margin-bottom:24px;line-height:1.6}.works-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(280px,1fr));gap:20px;margin-bottom:40px}.work-card-interactive{background:#fff;border:1px solid #e0e0e0;border-radius:8px;overflow:hidden;cursor:pointer;transition:all .2s;display:flex;flex-direction:column}.work-card-interactive:hover{border-color:#4a90e2;box-shadow:0 4px 12px #4a90e226;transform:translateY(-2px)}.work-card-image{width:100%;height:160px;overflow:hidden;background:#f5f5f5;display:flex;align-items:center;justify-content:center}.work-card-image img{width:100%;height:100%;object-fit:cover}.work-card-placeholder{width:100%;height:100%;display:flex;align-items:center;justify-content:center;background:linear-gradient(135deg,#f5f5f5,#e8e8e8)}.placeholder-icon{font-size:48px;opacity:.3}.work-card-content{padding:16px;flex:1;display:flex;flex-direction:column}.work-card-content h3{font-size:18px;font-weight:600;margin:0 0 8px;color:#333;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.work-description{font-size:14px;color:#666;line-height:1.5;margin:0 0 12px;display:-webkit-box;-webkit-line-clamp:2;-webkit-box-orient:vertical;overflow:hidden;flex:1}.work-meta{font-size:13px;color:#999;margin-top:auto}.help-section{background:#f8f9fa;border-radius:8px;padding:24px;margin-top:40px}.help-section h3{font-size:18px;font-weight:600;margin:0 0 16px;color:#333}.help-section ol{margin:0;padding-left:24px;color:#666;line-height:1.8}.help-section li{margin-bottom:8px}.help-section li:last-child{margin-bottom:0}@media (max-width: 768px){.interactive-novel-page{padding:16px}.page-header h1{font-size:24px}.works-grid{grid-template-columns:1fr;gap:16px}.help-section{padding:20px}}.interactive-novel-game{display:flex;flex-direction:column;height:100vh;background:linear-gradient(135deg,#f5f7fa,#c3cfe2);color:#333;overflow:hidden}.game-header{display:flex;align-items:center;justify-content:space-between;padding:16px 24px;background:#fffffffa;box-shadow:0 2px 12px #00000014;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);z-index:10;border-bottom:1px solid rgba(0,0,0,.05)}.btn-back,.btn-reset{padding:8px 16px;background:#667eea;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.btn-back:hover,.btn-reset:hover{background:#5568d3}.btn-back:active,.btn-reset:active{transform:scale(.98)}.btn-export{padding:8px 16px;background:linear-gradient(135deg,#48bb78,#38a169);color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;font-weight:500;transition:all .2s;white-space:nowrap;display:flex;align-items:center;gap:4px;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.btn-export:hover:not(:disabled){background:linear-gradient(135deg,#38a169,#2f855a);transform:translateY(-1px);box-shadow:0 4px 12px #48bb784d}.btn-export:active:not(:disabled){transform:translateY(0)}.btn-export:disabled{opacity:.6;cursor:not-allowed}.game-title{font-size:20px;font-weight:600;margin:0;color:#333;flex:1;text-align:center}.model-selector-section{margin-bottom:20px;padding-bottom:16px;border-bottom:1px solid rgba(0,0,0,.1)}.model-selector-label{font-size:13px;font-weight:600;color:#666;margin-bottom:8px}.model-selector-wrapper{width:100%}.model-select{width:100%;padding:10px 12px;border:2px solid #e2e8f0;border-radius:8px;font-size:14px;background:#fff;cursor:pointer;transition:all .2s;color:#333}.model-select:focus{outline:none;border-color:#667eea;box-shadow:0 0 0 3px #667eea1a}.model-select:hover{border-color:#667eea}.loading-screen{display:flex;align-items:center;justify-content:center;flex:1;color:#fff;font-size:18px}.game-setup{display:flex;align-items:flex-start;justify-content:center;flex:1;padding:40px;overflow-y:auto;-webkit-overflow-scrolling:touch}.setup-card{background:#fff;border-radius:16px;padding:32px;max-width:800px;width:100%;max-height:calc(100vh - 80px);box-shadow:0 10px 40px #0003;overflow-y:auto;-webkit-overflow-scrolling:touch}.setup-card::-webkit-scrollbar,.game-setup::-webkit-scrollbar{width:10px}.setup-card::-webkit-scrollbar-track,.game-setup::-webkit-scrollbar-track{background:#f1f1f1;border-radius:5px}.setup-card::-webkit-scrollbar-thumb,.game-setup::-webkit-scrollbar-thumb{background:#888;border-radius:5px}.setup-card::-webkit-scrollbar-thumb:hover,.game-setup::-webkit-scrollbar-thumb:hover{background:#555}.setup-card h2{margin:0 0 16px;font-size:24px;color:#333}.setup-hint{color:#666;font-size:14px;line-height:1.6;margin-bottom:20px}.setup-input{width:100%;padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;font-family:inherit;resize:vertical;box-sizing:border-box;margin-bottom:24px;transition:border-color .2s}.setup-input:focus{outline:none;border-color:#667eea}.btn-start-game{width:100%;padding:14px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:16px;font-weight:600;cursor:pointer;transition:transform .2s}.btn-start-game:hover:not(:disabled){transform:translateY(-2px)}.btn-start-game:disabled{opacity:.6;cursor:not-allowed}.game-container{display:flex;flex-direction:column;flex:1;overflow:hidden;background:linear-gradient(135deg,#f8fafc,#fff,#f8fafc);position:relative}.game-layout{display:flex;flex:1;overflow:hidden;gap:0;position:relative}.game-messages{flex:1;overflow-y:auto;padding:32px;display:flex;flex-direction:column;gap:24px;-webkit-overflow-scrolling:touch;background:linear-gradient(to bottom,#f8fafc,#fff,#f8fafc);position:relative;min-width:0}.game-messages:before{content:"";position:absolute;top:0;left:0;right:0;height:1px;background:linear-gradient(90deg,transparent,rgba(102,126,234,.1),transparent)}.game-message{display:flex;animation:fadeIn .3s ease-in}@keyframes fadeIn{0%{opacity:0;transform:translateY(10px)}to{opacity:1;transform:translateY(0)}}.game-message.game{justify-content:flex-start}.game-message.player{justify-content:flex-end}.game-content,.player-content{max-width:85%;display:flex;flex-direction:column;gap:10px;position:relative}.message-header{display:flex;align-items:center;justify-content:space-between;gap:12px;margin-bottom:8px}.btn-regenerate{padding:6px 12px;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;border:none;border-radius:6px;font-size:12px;font-weight:500;cursor:pointer;transition:all .2s;white-space:nowrap;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.btn-regenerate:hover:not(:disabled){background:linear-gradient(135deg,#d97706,#b45309);transform:translateY(-1px);box-shadow:0 2px 8px #f59e0b4d}.btn-regenerate:active:not(:disabled){transform:translateY(0)}.btn-regenerate:disabled{opacity:.6;cursor:not-allowed}.regenerate-panel{margin-top:0;margin-bottom:8px;padding:16px;background:linear-gradient(135deg,#fef3c7,#fde68a);border:2px solid #f59e0b;border-radius:12px;display:flex;flex-direction:column;gap:12px;animation:slideDown .3s ease-out}@keyframes slideDown{0%{opacity:0;transform:translateY(-10px)}to{opacity:1;transform:translateY(0)}}.regenerate-label{font-size:14px;font-weight:600;color:#92400e}.regenerate-input{width:100%;padding:12px;border:2px solid #fbbf24;border-radius:8px;font-size:14px;font-family:inherit;resize:vertical;background:#fff;transition:border-color .2s;box-sizing:border-box}.regenerate-input:focus{outline:none;border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b1a}.regenerate-actions{display:flex;gap:8px;justify-content:flex-end}.btn-regenerate-confirm{padding:10px 20px;background:linear-gradient(135deg,#f59e0b,#d97706);color:#fff;border:none;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.btn-regenerate-confirm:hover:not(:disabled){background:linear-gradient(135deg,#d97706,#b45309);transform:translateY(-2px);box-shadow:0 4px 12px #f59e0b66}.btn-regenerate-confirm:active:not(:disabled){transform:translateY(0)}.btn-regenerate-confirm:disabled{opacity:.6;cursor:not-allowed}.btn-regenerate-cancel{padding:10px 20px;background:#f5f5f5;color:#666;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;font-weight:600;cursor:pointer;transition:all .2s;-webkit-tap-highlight-color:transparent;touch-action:manipulation}.btn-regenerate-cancel:hover:not(:disabled){background:#eee;border-color:#ccc}.btn-regenerate-cancel:disabled{opacity:.6;cursor:not-allowed}.message-role-label{font-size:12px;font-weight:600;text-transform:uppercase;letter-spacing:.8px;padding:4px 12px;border-radius:12px;display:inline-block;width:fit-content;margin-bottom:4px}.game-content .message-role-label{color:#667eea;background:linear-gradient(135deg,#667eea1a,#667eea0d);border:1px solid rgba(102,126,234,.2)}.player-content .message-role-label{color:#764ba2;background:linear-gradient(135deg,#764ba21a,#764ba20d);border:1px solid rgba(118,75,162,.2);margin-left:auto}.message-text{padding:18px 22px;border-radius:18px;font-size:16px;line-height:1.85;word-wrap:break-word;white-space:pre-wrap;transition:all .3s cubic-bezier(.4,0,.2,1);position:relative;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px)}.game-content .message-text{background:linear-gradient(135deg,#fff,#f8fafc);color:#1a202c;border:1.5px solid #e2e8f0;border-bottom-left-radius:4px;box-shadow:0 4px 16px #0000000f,0 1px 3px #0000000a}.game-content .message-text:hover{box-shadow:0 6px 24px #0000001a,0 2px 6px #0000000f;transform:translateY(-1px);border-color:#cbd5e0}.game-content .message-text:before{content:"";position:absolute;left:-1.5px;top:0;bottom:0;width:3px;background:linear-gradient(180deg,#667eea,#764ba2);border-radius:2px 0 0 2px}.player-content .message-text{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-bottom-right-radius:4px;box-shadow:0 6px 24px #667eea59,0 2px 8px #764ba233;text-shadow:0 1px 2px rgba(0,0,0,.1)}.player-content .message-text:hover{box-shadow:0 8px 32px #667eea73,0 4px 12px #764ba24d;transform:translateY(-2px)}.typing-indicator{display:inline-flex;align-items:center;gap:4px;animation:blink 1.5s infinite}.typing-indicator:after{content:"...";animation:dots 1.5s infinite}@keyframes blink{0%,to{opacity:1}50%{opacity:.5}}@keyframes dots{0%,20%{content:"."}40%{content:".."}60%,to{content:"..."}}.game-interaction{width:380px;min-width:380px;max-width:380px;padding:28px 24px;background:linear-gradient(135deg,#fffffffa,#f8fafcfa);border-left:1px solid rgba(226,232,240,.8);box-shadow:-4px 0 16px #0000000f;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);position:relative;overflow-y:auto;-webkit-overflow-scrolling:touch;display:flex;flex-direction:column}.game-interaction:before{content:"";position:absolute;top:0;left:0;bottom:0;width:1px;background:linear-gradient(180deg,transparent,rgba(102,126,234,.2),transparent)}.custom-action-section{margin-top:24px;padding-top:24px;border-top:1px solid #e2e8f0}.custom-action-label{font-size:14.5px;color:#64748b;margin-bottom:14px;font-weight:600;display:flex;align-items:center;gap:6px}.custom-action-label:before{content:"💭";font-size:16px}.choice-interaction,.input-interaction{display:flex;flex-direction:column;gap:16px;flex:1}.interaction-prompt{font-size:17px;font-weight:600;color:#1a202c;margin-bottom:6px;display:flex;align-items:center;gap:8px}.interaction-prompt:before{content:"✨";font-size:18px}.choices-container{display:flex;flex-direction:column;gap:12px;flex:1;overflow-y:auto;-webkit-overflow-scrolling:touch}.choice-button{padding:16px 20px;background:linear-gradient(135deg,#fff,#f8fafc);border:2px solid #667eea;border-radius:14px;color:#667eea;font-size:15px;font-weight:500;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-tap-highlight-color:transparent;touch-action:manipulation;text-align:left;box-shadow:0 4px 12px #667eea1f,0 2px 4px #667eea14;position:relative;overflow:hidden;display:flex;align-items:center;gap:12px;width:100%;flex-shrink:0}.choice-button:before{content:"";position:absolute;top:0;left:-100%;width:100%;height:100%;background:linear-gradient(90deg,transparent,rgba(255,255,255,.3),transparent);transition:left .5s}.choice-button:hover:not(:disabled):before{left:100%}.choice-button:hover:not(:disabled){background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;transform:translateY(-2px);box-shadow:0 8px 28px #667eea66,0 4px 12px #764ba24d;border-color:transparent}.choice-button:active:not(:disabled){transform:translateY(0);box-shadow:0 4px 16px #667eea4d}.choice-number{font-size:13px;font-weight:700;opacity:.8;min-width:56px;padding:4px 10px;background:#667eea1a;border-radius:8px;text-align:center;transition:all .3s}.choice-button:hover:not(:disabled) .choice-number{background:#ffffff40;opacity:1}.choice-text{flex:1}.choice-button:hover:not(:disabled) .choice-number{opacity:1}.choice-button:disabled{opacity:.6;cursor:not-allowed}.input-container{display:flex;gap:12px}.game-input{flex:1;padding:16px 20px;border:2px solid #e2e8f0;border-radius:14px;font-size:15.5px;-webkit-tap-highlight-color:transparent;touch-action:manipulation;transition:all .3s cubic-bezier(.4,0,.2,1);background:linear-gradient(135deg,#fff,#f8fafc);box-shadow:0 2px 8px #0000000a,inset 0 1px 2px #00000005}.game-input:focus{outline:none;border-color:#667eea;box-shadow:0 6px 20px #667eea33,0 2px 8px #667eea1a,inset 0 1px 2px #00000005;transform:translateY(-2px);background:#fff}.game-input:disabled{background:#f5f5f5;cursor:not-allowed}.btn-submit{padding:16px 32px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:14px;font-size:15.5px;font-weight:600;cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1);-webkit-tap-highlight-color:transparent;touch-action:manipulation;white-space:nowrap;box-shadow:0 6px 20px #667eea59,0 2px 8px #764ba233;position:relative;overflow:hidden}.btn-submit:hover:not(:disabled){transform:translateY(-3px);box-shadow:0 8px 28px #667eea73,0 4px 12px #764ba24d}.btn-submit:active:not(:disabled){transform:translateY(-1px);box-shadow:0 4px 16px #667eea59}.btn-submit:active:not(:disabled){transform:translateY(0)}.btn-submit:disabled{opacity:.6;cursor:not-allowed}.chapters-list{display:flex;flex-direction:column;gap:12px;margin-bottom:24px;max-height:calc(100vh - 300px);overflow-y:auto;-webkit-overflow-scrolling:touch;padding-right:8px}.chapters-list::-webkit-scrollbar{width:8px}.chapters-list::-webkit-scrollbar-track{background:#f1f1f1;border-radius:4px}.chapters-list::-webkit-scrollbar-thumb{background:#888;border-radius:4px}.chapters-list::-webkit-scrollbar-thumb:hover{background:#555}.chapter-item{padding:16px;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;transition:all .2s}.chapter-item:hover{border-color:#667eea;background:#f8f9ff;transform:translate(4px)}.chapter-title{font-size:16px;font-weight:600;color:#333;margin-bottom:8px}.chapter-summary{font-size:14px;color:#666;margin-bottom:8px;line-height:1.5}.chapter-preview{font-size:13px;color:#999;line-height:1.5}.characters-section{margin-bottom:32px}.characters-section:last-child{margin-bottom:0}.characters-section h3{font-size:18px;font-weight:600;color:#333;margin-bottom:16px}.characters-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(250px,1fr));gap:16px;margin-bottom:24px;max-height:none}.character-item{padding:16px;border:2px solid #e0e0e0;border-radius:8px;cursor:pointer;transition:all .2s;background:#fff;display:flex;flex-direction:column;min-height:120px;justify-content:flex-start;text-align:left}.character-item:hover{border-color:#667eea;background:#f8f9ff;transform:translateY(-2px);box-shadow:0 4px 12px #667eea26}.character-name{font-size:16px;font-weight:600;color:#333;margin-bottom:10px;word-wrap:break-word}.character-desc{font-size:13px;color:#666;line-height:1.5;word-wrap:break-word;overflow-wrap:break-word;flex:1;overflow:hidden;display:-webkit-box;-webkit-line-clamp:4;-webkit-box-orient:vertical}.custom-character-form{display:flex;flex-direction:column;gap:12px}.character-name-input,.character-desc-input{padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;font-family:inherit;resize:vertical;transition:border-color .2s}.character-name-input:focus,.character-desc-input:focus{outline:none;border-color:#667eea}.btn-submit-character{padding:12px 24px;background:linear-gradient(135deg,#667eea,#764ba2);color:#fff;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:transform .2s}.btn-submit-character:hover:not(:disabled){transform:translateY(-2px)}.btn-submit-character:disabled{opacity:.6;cursor:not-allowed}.btn-back-step{width:100%;padding:12px;background:#f5f5f5;color:#666;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;cursor:pointer;transition:all .2s;margin-top:16px}.btn-back-step:hover{background:#eee;border-color:#ccc}.game-info-bar{display:flex;align-items:center;gap:16px;padding:16px 32px;background:linear-gradient(135deg,#fffffffa,#f8fafcfa);border-bottom:1px solid rgba(226,232,240,.8);font-size:14px;color:#64748b;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);width:100%;box-sizing:border-box;box-shadow:0 2px 8px #0000000a;flex-shrink:0}.game-info-bar span{padding:8px 16px;background:linear-gradient(135deg,#f1f5f9,#e2e8f0);border-radius:22px;font-weight:600;border:1.5px solid rgba(102,126,234,.15);box-shadow:0 2px 6px #0000000d;transition:all .2s}.game-info-bar span:hover{transform:translateY(-1px);box-shadow:0 4px 10px #00000014;border-color:#667eea40}.game-info-bar .game-ended{background:linear-gradient(135deg,#fee2e2,#fecaca);color:#dc2626;font-weight:600;border-color:#dc262633}.save-dialog-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000;animation:fadeIn .3s}.save-dialog{background:#fff;border-radius:16px;padding:32px;max-width:500px;width:90%;box-shadow:0 10px 40px #0000004d;animation:slideUp .3s}@keyframes slideUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.save-dialog h2{margin:0 0 16px;font-size:24px;color:#333}.save-dialog p{margin:0 0 24px;color:#666;line-height:1.6}.save-options{display:flex;flex-direction:column;gap:16px}.btn-save-original,.btn-save-new,.btn-dont-save{padding:14px 24px;border:none;border-radius:8px;font-size:15px;font-weight:600;cursor:pointer;transition:transform .2s}.btn-save-original{background:linear-gradient(135deg,#667eea,#764ba2);color:#fff}.btn-save-new{background:linear-gradient(135deg,#764ba2,#667eea);color:#fff}.btn-dont-save{background:#f5f5f5;color:#666;border:2px solid #e0e0e0}.btn-save-original:hover:not(:disabled),.btn-save-new:hover:not(:disabled){transform:translateY(-2px)}.btn-dont-save:hover{background:#eee}.btn-save-new:disabled{opacity:.6;cursor:not-allowed}.save-new-section{display:flex;flex-direction:column;gap:12px}.new-work-title-input{padding:12px;border:2px solid #e0e0e0;border-radius:8px;font-size:14px;transition:border-color .2s}.new-work-title-input:focus{outline:none;border-color:#667eea}@media (max-width: 768px){.interactive-novel-game{height:100vh;height:100dvh}.game-header{padding:10px 12px;flex-wrap:wrap;gap:8px;min-height:50px}.btn-back,.btn-export{padding:8px 12px;font-size:13px;min-height:36px;flex-shrink:0}.game-title{font-size:15px;flex:1;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;padding:0 8px}.game-layout{flex-direction:column}.game-messages{padding:16px 12px;gap:16px;flex:1;min-height:0;-webkit-overflow-scrolling:touch}.game-content,.player-content{max-width:92%}.message-text{padding:12px 16px;font-size:15px;line-height:1.6}.message-role-label{font-size:11px;padding:3px 10px}.game-interaction{width:100%;min-width:100%;max-width:100%;padding:16px 12px;border-left:none;border-top:1px solid rgba(226,232,240,.8);box-shadow:0 -4px 16px #0000000f;max-height:50vh;overflow-y:auto;-webkit-overflow-scrolling:touch}.game-interaction:before{top:0;left:0;right:0;width:100%;height:1px;background:linear-gradient(90deg,transparent,rgba(102,126,234,.2),transparent)}.model-selector-section{margin-bottom:16px;padding-bottom:12px}.model-selector-label{font-size:12px;margin-bottom:6px}.model-select{padding:12px;font-size:15px;min-height:44px}.choice-button{padding:14px 16px;font-size:15px;min-height:48px;flex-direction:column;align-items:flex-start;gap:8px}.choice-number{min-width:auto;width:100%;text-align:left;font-size:12px}.choice-text{font-size:15px;line-height:1.5}.interaction-prompt{font-size:15px;margin-bottom:12px}.custom-action-label{font-size:13px;margin-bottom:8px}.game-input{padding:12px;font-size:16px;min-height:44px}.btn-submit{padding:12px 20px;font-size:14px;min-height:44px}.setup-card{padding:20px 16px;max-height:calc(100vh - 80px);max-height:calc(100dvh - 80px);margin:12px}.chapters-list{max-height:calc(100vh - 280px);max-height:calc(100dvh - 280px);gap:12px}.chapter-item{padding:16px;min-height:60px}.chapter-title{font-size:16px;margin-bottom:8px}.chapter-summary{font-size:13px}.chapter-preview{font-size:12px}.characters-list{grid-template-columns:1fr;gap:12px}.character-item{min-height:auto;padding:14px}.character-name{font-size:16px;margin-bottom:8px}.character-desc{font-size:13px;line-height:1.5}.game-info-bar{flex-wrap:wrap;gap:8px;padding:10px 12px;font-size:12px}.game-info-bar span{padding:4px 10px;font-size:11px}.message-header{flex-wrap:wrap;gap:8px}.btn-regenerate{padding:6px 10px;font-size:11px;min-height:32px}.regenerate-panel{padding:12px;gap:10px}.regenerate-label{font-size:13px}.regenerate-input{padding:10px;font-size:16px;min-height:80px}.regenerate-actions{flex-direction:column;gap:8px}.btn-regenerate-confirm,.btn-regenerate-cancel{padding:12px 16px;font-size:14px;min-height:44px;width:100%}.save-dialog{padding:20px 16px;max-width:90%;margin:20px}.save-dialog h3{font-size:18px;margin-bottom:16px}.new-work-title-input{padding:12px;font-size:16px;min-height:44px}.btn-save-original,.btn-save-new{padding:12px 20px;font-size:14px;min-height:44px;width:100%;margin-bottom:8px}.btn-dont-save{padding:12px 20px;font-size:14px;min-height:44px;width:100%}}@media (max-width: 480px){.game-header{padding:8px 10px;gap:6px}.btn-back,.btn-export{padding:6px 10px;font-size:12px;min-height:32px}.game-title{font-size:14px;padding:0 6px}.game-messages{padding:12px 10px;gap:12px}.game-content,.player-content{max-width:95%}.message-text{padding:10px 14px;font-size:14px}.game-interaction{padding:12px 10px;max-height:45vh}.choice-button{padding:12px 14px;font-size:14px;min-height:44px}.setup-card{padding:16px 12px;margin:8px}.chapter-item,.character-item{padding:12px}.game-info-bar{padding:8px 10px;font-size:11px}}@media (max-width: 768px) and (orientation: landscape){.game-interaction{max-height:40vh}.game-messages{max-height:60vh}}.admin-page{background-color:#fff;padding:20px;border-radius:8px;min-height:calc(100vh - 200px);max-width:1400px;margin:0 auto}.admin-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:30px;padding-bottom:20px;border-bottom:2px solid #e0e0e0}.admin-header h1{margin:0;font-size:24px;font-weight:600;color:#111827}.admin-actions{display:flex;gap:12px;align-items:center}.btn-page-editor{display:flex;align-items:center;gap:6px;padding:10px 16px;background-color:#10b981;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:background-color .2s;text-decoration:none}.btn-page-editor:hover{background-color:#059669}.btn-refresh,.btn-create{display:flex;align-items:center;gap:6px;padding:10px 16px;background-color:#3b82f6;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:background-color .2s}.btn-refresh:hover,.btn-create:hover{background-color:#2563eb}.btn-create{background-color:#22c55e}.btn-create:hover{background-color:#16a34a}.stats-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(200px,1fr));gap:20px;margin-bottom:30px}.stat-card{background:#fff;padding:24px;border-radius:8px;box-shadow:0 2px 4px #0000001a;text-align:center;border:1px solid #e0e0e0;transition:transform .2s,box-shadow .2s}.stat-card h3{margin:0 0 12px;font-size:16px;font-weight:600;color:#666}.stat-card .stat-value{margin:0;font-size:32px;font-weight:700;color:#111827}.users-section{background:#fff;padding:24px;border-radius:8px;box-shadow:0 2px 4px #0000001a;border:1px solid #e0e0e0}.section-header{display:flex;align-items:center;justify-content:space-between;gap:15px;margin-bottom:20px;padding-bottom:15px;border-bottom:2px solid #e0e0e0}.section-header h2{margin:0;font-size:20px;font-weight:600;color:#111827}.btn-back{display:flex;align-items:center;gap:6px;padding:8px 16px;background:#f3f4f6;color:#374151;border:1px solid #d1d5db;border-radius:6px;cursor:pointer;font-size:14px;transition:all .2s}.btn-back:hover{background:#e5e7eb;border-color:#9ca3af}.users-grid{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:20px;margin-bottom:20px}.user-card{background:#f9fafb;padding:20px;border-radius:8px;border:1px solid #e5e7eb;cursor:pointer;transition:all .2s}.user-card:hover{background:#f3f4f6;border-color:#3b82f6;box-shadow:0 4px 6px #0000001a}.user-header{margin-bottom:12px}.user-header h3{margin:0 0 4px;font-size:18px;font-weight:600;color:#111827}.user-email{font-size:14px;color:#6b7280}.user-stats{display:flex;gap:16px;margin-bottom:12px;padding:12px 0;border-top:1px solid #e5e7eb;border-bottom:1px solid #e5e7eb}.stat-item{display:flex;flex-direction:column;gap:4px}.stat-label{font-size:12px;color:#6b7280}.stat-value{font-size:16px;font-weight:600;color:#111827}.user-meta{display:flex;flex-direction:column;gap:6px;font-size:13px;color:#6b7280}.meta-item{display:flex;align-items:center}.user-detail-section{background:#fff;padding:24px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.detail-tabs{margin-bottom:20px}.tab-buttons{display:flex;gap:0;border-bottom:2px solid #e0e0e0;margin-bottom:20px}.tab-btn{padding:12px 24px;background:none;border:none;border-bottom:2px solid transparent;cursor:pointer;font-size:14px;font-weight:500;color:#666;transition:all .2s;margin-bottom:-2px}.tab-btn:hover{color:#22c55e}.tab-btn.active{color:#22c55e;border-bottom-color:#22c55e;font-weight:600}.detail-content{min-height:200px}.items-list{display:grid;grid-template-columns:repeat(auto-fill,minmax(300px,1fr));gap:16px}.item-card{background:#f9fafb;padding:16px;border-radius:6px;border:1px solid #e5e7eb}.item-card h4{margin:0 0 8px;font-size:16px;font-weight:600;color:#111827}.item-meta{margin:8px 0;font-size:13px;color:#6b7280}.item-desc{margin:8px 0 0;font-size:14px;color:#374151;line-height:1.5}.image-preview{margin-top:12px;border-radius:6px;overflow:hidden}.image-preview img{width:100%;height:auto;display:block}.pagination{display:flex;justify-content:center;align-items:center;gap:16px;margin-top:24px;padding-top:20px;border-top:2px solid #e0e0e0}.pagination button{padding:8px 16px;background:#3b82f6;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:background-color .2s}.pagination button:hover:not(:disabled){background:#2563eb}.pagination button:disabled{background:#d1d5db;cursor:not-allowed}.pagination span{font-size:14px;color:#666}.loading{text-align:center;padding:40px;color:#6b7280;font-size:16px}.error{text-align:center;padding:40px;color:#ef4444;font-size:16px;background:#fef2f2;border-radius:6px;border:1px solid #fecaca}.empty-state{text-align:center;padding:40px;color:#6b7280;font-size:16px}.not-found-page{text-align:center;padding:60px 20px}.not-found-page h1{font-size:48px;color:#111827;margin-bottom:16px}.not-found-page p{font-size:18px;color:#6b7280}.user-actions{margin-top:12px;padding-top:12px;border-top:1px solid #e5e7eb;display:flex;gap:8px}.btn-edit{padding:6px 12px;background:#3b82f6;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:13px;transition:background .2s}.clickable{cursor:pointer}.clickable:hover{background:#f3f4f6;border-color:#3b82f6}.item-actions{margin-top:12px;display:flex;gap:8px}.btn-view{padding:6px 12px;background:#22c55e;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:13px;transition:background-color .2s;margin-right:4px}.btn-view:hover{background:#16a34a}.btn-edit{padding:6px 12px;background:#3b82f6;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:13px;transition:background-color .2s;margin-right:4px}.btn-edit:hover{background:#2563eb}.btn-delete{padding:6px 12px;background:#ef4444;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:13px;transition:background-color .2s}.work-detail-section,.chapter-detail-section,.video-detail-section,.image-detail-section{background:#fff;padding:24px;border-radius:8px;box-shadow:0 2px 4px #0000001a}.chapters-list{display:flex;flex-direction:column;gap:12px}.chapter-item{background:#f9fafb;padding:16px;border-radius:6px;border:1px solid #e5e7eb}.chapter-item h4{margin:0 0 8px;font-size:16px;font-weight:600;color:#111827}.chapter-meta{margin:8px 0;font-size:13px;color:#6b7280}.chapter-content{margin-top:20px}.chapter-info{background:#f9fafb;padding:16px;border-radius:6px;margin-bottom:20px}.chapter-info p{margin:8px 0;font-size:14px;color:#374151}.chapter-text{background:#fff;padding:20px;border-radius:6px;border:1px solid #e5e7eb}.chapter-text h3{margin:0 0 16px;font-size:18px;font-weight:600;color:#111827}.content-text{white-space:pre-wrap;word-wrap:break-word;font-size:14px;line-height:1.6;color:#374151;max-height:600px;overflow-y:auto;padding:16px;background:#f9fafb;border-radius:6px;margin:0}.detail-info{margin-top:20px}.info-item{margin-bottom:16px;padding:12px;background:#f9fafb;border-radius:6px;font-size:14px;color:#374151}.info-item strong{color:#111827;margin-right:8px}.info-item a{color:#3b82f6;text-decoration:none}.info-item a:hover{text-decoration:underline}.image-preview-small{margin-top:12px;border-radius:6px;overflow:hidden;max-width:200px;max-height:200px}.image-preview-small img{width:100%;height:auto;display:block}.image-preview-large{margin-top:12px;border-radius:6px;overflow:hidden;max-width:800px}.image-preview-large img{width:100%;height:auto;display:block}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:2000;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.modal-content{background:#fff;border-radius:8px;width:90%;max-width:500px;max-height:90vh;overflow-y:auto;box-shadow:0 10px 25px #0003;border:1px solid #e0e0e0}.modal-large{max-width:900px}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:20px;border-bottom:2px solid #e0e0e0}.modal-header h3{margin:0;font-size:20px;font-weight:600;color:#111827}.modal-close{background:none;border:none;font-size:24px;color:#6b7280;cursor:pointer;padding:0;width:30px;height:30px;display:flex;align-items:center;justify-content:center;border-radius:4px;transition:background .2s}.modal-close:hover{background:#f3f4f6}.modal-body{padding:20px}.modal-body .form-group{margin-bottom:20px}.modal-body .form-group label{display:block;margin-bottom:8px;font-weight:500;color:#374151;font-size:14px}.modal-body .form-group input,.modal-body .form-group select{width:100%;padding:10px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;transition:border-color .2s}.modal-body .form-group input:focus,.modal-body .form-group select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:20px;border-top:2px solid #e0e0e0}.btn-cancel{padding:10px 20px;background:#f3f4f6;color:#374151;border:1px solid #d1d5db;border-radius:6px;cursor:pointer;font-size:14px;transition:background .2s}.btn-cancel:hover{background:#e5e7eb}.btn-save{padding:10px 20px;background:#22c55e;color:#fff;border:none;border-radius:6px;cursor:pointer;font-size:14px;transition:background-color .2s}.btn-save:hover{background:#16a34a}.breadcrumbs{background:#fff;padding:16px 24px;border-radius:8px;box-shadow:0 2px 4px #0000001a;margin-bottom:20px;font-size:14px;color:#6b7280}.breadcrumb-link{background:none;border:none;color:#3b82f6;cursor:pointer;padding:0;font-size:14px;text-decoration:none;transition:color .2s}.breadcrumb-link:hover{color:#2563eb;text-decoration:underline}.breadcrumb-current{color:#111827;font-weight:500}.breadcrumb-separator{margin:0 8px;color:#d1d5db}.users-table{width:100%;overflow-x:auto;margin-top:20px}.users-table table{width:100%;border-collapse:collapse;background:#fff}.users-table thead{background:#f9fafb}.users-table th{padding:12px 16px;text-align:left;font-weight:600;color:#374151;border-bottom:2px solid #e0e0e0;font-size:14px;white-space:nowrap}.users-table td{padding:12px 16px;border-bottom:1px solid #e0e0e0;font-size:14px;color:#374151}.users-table tbody tr{transition:background-color .2s}.users-table tbody tr:hover{background:#f9fafb}.users-table tbody tr:last-child td{border-bottom:none}.search-filter-bar{display:flex;gap:12px;align-items:center}.search-bar{display:flex;align-items:center;gap:12px}.search-input{padding:8px 12px;border:1px solid #e0e0e0;border-radius:6px;font-size:14px;width:300px;transition:border-color .2s}.search-input:focus{outline:none;border-color:#22c55e;box-shadow:0 0 0 3px #22c55e1a}.filter-select{padding:8px 12px;border:1px solid #d1d5db;border-radius:6px;font-size:14px;background:#fff;cursor:pointer;transition:border-color .2s}.filter-select:focus{outline:none;border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.section-actions{display:flex;align-items:center;gap:12px}.filter-info{display:flex;align-items:center;justify-content:space-between;padding:12px 16px;background:#eff6ff;border:1px solid #bfdbfe;border-radius:6px;margin-bottom:16px;font-size:14px;color:#1e40af}.btn-clear-filter{padding:4px 12px;background:#3b82f6;color:#fff;border:none;border-radius:4px;cursor:pointer;font-size:12px;transition:background .2s}.btn-clear-filter:hover{background:#2563eb}.user-card{position:relative}.user-card .user-header{cursor:pointer}.user-card .user-actions{display:flex;gap:8px;margin-top:12px;padding-top:12px;border-top:1px solid #e5e7eb}.user-card .btn-view{flex:1}@media (max-width: 768px){.admin-page{padding:12px}.stats-grid{grid-template-columns:repeat(2,1fr);gap:12px}.users-grid{grid-template-columns:1fr}.search-filter-bar{flex-direction:column;width:100%}.search-input{width:100%}.section-header{flex-direction:column;align-items:flex-start;gap:12px}.section-actions{width:100%}.items-list{grid-template-columns:1fr}}.user-card:hover{transform:translateY(-2px);box-shadow:0 6px 12px #00000026}.item-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #0000001a}.btn-edit,.btn-view,.btn-delete{display:inline-flex;align-items:center;gap:4px;white-space:nowrap}.detail-tabs{flex-wrap:wrap;gap:8px}.tab-btn{position:relative;padding:12px 20px;border-radius:6px 6px 0 0}.tab-btn.active{background:#eff6ff}.stat-card{transition:transform .2s,box-shadow .2s}.stat-card:hover{transform:translateY(-2px);box-shadow:0 4px 8px #00000026}.chapters-list{display:flex;flex-direction:column;gap:16px;max-height:60vh;overflow-y:auto}.chapter-item{background:#f9fafb;padding:16px;border-radius:6px;border:1px solid #e0e0e0;transition:all .2s}.chapter-item:hover{background:#f3f4f6;border-color:#22c55e}.chapter-header{display:flex;justify-content:space-between;align-items:center;margin-bottom:8px}.chapter-header h4{margin:0;font-size:16px;font-weight:600;color:#111827}.chapter-meta{margin:8px 0;font-size:13px;color:#666}.chapter-preview{margin-top:8px;padding:12px;background:#fff;border-radius:4px;font-size:14px;color:#374151;line-height:1.6;border:1px solid #e0e0e0}.chapter-detail-content{display:flex;flex-direction:column;gap:20px}.chapter-text{margin-top:20px}.chapter-text h4{margin:0 0 12px;font-size:18px;font-weight:600;color:#111827}.content-text{white-space:pre-wrap;word-wrap:break-word;font-size:14px;line-height:1.8;color:#374151;max-height:500px;overflow-y:auto;padding:16px;background:#f9fafb;border-radius:6px;border:1px solid #e0e0e0}.video-detail-content{display:flex;flex-direction:column;gap:20px}.scenes-list{margin-top:12px;display:flex;flex-direction:column;gap:12px}.scene-item{padding:12px;background:#f9fafb;border-radius:6px;border:1px solid #e0e0e0;font-size:14px;color:#374151}.scene-item strong{color:#111827;margin-right:8px}.scene-item a{color:#3b82f6;text-decoration:none;margin-left:8px}.scene-item a:hover{text-decoration:underline}.image-detail-content{display:flex;flex-direction:column;gap:20px}.image-preview-large{margin-bottom:20px;text-align:center}.image-preview-large img{max-width:100%;max-height:500px;border-radius:8px;box-shadow:0 2px 8px #0000001a;border:1px solid #e0e0e0}.settings-json{margin-top:8px;padding:12px;background:#f9fafb;border-radius:6px;border:1px solid #e0e0e0;font-size:12px;color:#374151;overflow-x:auto;max-height:300px;overflow-y:auto}.component-text{line-height:1.6}.component-heading{margin:0 0 16px;font-weight:700}.component-heading h1{font-size:32px}.component-heading h2{font-size:24px}.component-heading h3{font-size:20px}.component-image{position:relative;width:100%}.component-image img{display:block;max-width:100%;height:auto;border-radius:4px}.image-placeholder{display:flex;flex-direction:column;align-items:center;justify-content:center;padding:40px;background:#f5f5f5;border:2px dashed #ddd;border-radius:4px;color:#999}.image-placeholder span{font-size:48px;margin-bottom:8px}.image-placeholder p{margin:0;font-size:14px}.component-button-wrapper{display:flex;justify-content:center;padding:16px 0}.component-button{padding:12px 24px;border:none;border-radius:4px;font-size:16px;cursor:pointer;transition:all .2s}.component-button.primary{background:#3b82f6;color:#fff}.component-button.primary:hover{background:#2563eb}.component-button.secondary{background:#6b7280;color:#fff}.component-button.secondary:hover{background:#4b5563}.component-divider{border:none;border-top:1px solid #ddd;margin:16px 0}.component-spacer{width:100%}.component-card{padding:20px;border:1px solid #e0e0e0;border-radius:4px;background:#fff}.component-card.with-shadow{box-shadow:0 2px 8px #0000001a}.component-card h3{margin:0 0 12px;font-size:20px;color:#333}.component-card p{margin:0;color:#666;line-height:1.6}.component-grid{display:grid;padding:16px 0}.grid-item{padding:20px;background:#f5f5f5;border:1px solid #e0e0e0;border-radius:4px;text-align:center;color:#666}.component-unknown{padding:20px;background:#fee;border:1px solid #fcc;border-radius:4px;color:#c33;text-align:center}.draggable-component{position:relative;margin-bottom:16px;border:2px solid transparent;border-radius:4px;background:#fff;transition:all .2s}.draggable-component.selected{border-color:#3b82f6;box-shadow:0 0 0 3px #3b82f61a}.draggable-component.dragging{opacity:.5}.component-handle{display:flex;align-items:center;gap:8px;padding:8px 12px;background:#f5f5f5;border-bottom:1px solid #e0e0e0;cursor:move;-webkit-user-select:none;user-select:none}.component-handle:hover{background:#e9e9e9}.drag-icon{font-size:16px;color:#999;cursor:grab}.drag-icon:active{cursor:grabbing}.component-type{flex:1;font-size:12px;color:#666;text-transform:uppercase;font-weight:500}.component-actions{display:flex;gap:4px}.btn-action{background:none;border:none;padding:4px 8px;cursor:pointer;font-size:14px;border-radius:4px;transition:all .2s}.btn-action:hover{background:#e0e0e0}.component-content{padding:16px}.component-palette{width:200px;background:#fff;border-right:1px solid #e0e0e0;padding:16px;overflow-y:auto}.component-palette h3{margin:0 0 16px;font-size:16px;color:#333}.component-list{display:flex;flex-direction:column;gap:8px}.component-item{display:flex;align-items:center;gap:12px;padding:12px;border:1px solid #e0e0e0;border-radius:4px;cursor:pointer;transition:all .2s;background:#fafafa}.component-item:hover{background:#f0f0f0;border-color:#3b82f6;transform:translate(4px)}.component-icon{font-size:20px}.component-name{font-size:14px;color:#333}.page-editor{display:flex;flex-direction:column;height:100vh;background:#f5f5f5}.page-editor-header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;background:#fff;border-bottom:1px solid #e0e0e0;box-shadow:0 2px 4px #0000000d}.page-editor-header h1{margin:0;font-size:24px;color:#333}.page-editor-actions{display:flex;gap:12px}.page-editor-actions button{padding:8px 16px;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:all .2s}.btn-load{background:#3b82f6;color:#fff}.btn-load:hover{background:#2563eb}.btn-save{background:#10b981;color:#fff}.btn-save:hover{background:#059669}.btn-clear{background:#ef4444;color:#fff}.btn-clear:hover{background:#dc2626}.page-editor-content{display:flex;flex:1;overflow:hidden}.page-editor-canvas{flex:1;overflow-y:auto;padding:24px;background:#fafafa}.empty-canvas{display:flex;flex-direction:column;align-items:center;justify-content:center;height:100%;color:#999;font-size:16px}.empty-canvas .hint{font-size:14px;margin-top:8px;color:#bbb}.canvas-content{max-width:1200px;margin:0 auto;background:#fff;min-height:100%;padding:24px;box-shadow:0 2px 8px #0000001a}.page-editor-properties{width:300px;background:#fff;border-left:1px solid #e0e0e0;padding:16px;overflow-y:auto}.page-editor-properties h3{margin:0 0 16px;font-size:18px;color:#333}.properties-content{display:flex;flex-direction:column;gap:16px}.property-group{display:flex;flex-direction:column;gap:8px}.property-group label{font-size:14px;font-weight:500;color:#666}.property-group input,.property-group textarea,.property-group select{padding:8px;border:1px solid #ddd;border-radius:4px;font-size:14px;font-family:inherit}.property-group textarea{resize:vertical;min-height:80px}.property-actions{display:flex;gap:8px;margin-top:16px;padding-top:16px;border-top:1px solid #e0e0e0}.property-actions button{flex:1;padding:8px;border:none;border-radius:4px;cursor:pointer;font-size:14px;transition:all .2s}.btn-duplicate{background:#3b82f6;color:#fff}.btn-duplicate:hover{background:#2563eb}.btn-delete{background:#ef4444;color:#fff}.btn-delete:hover{background:#dc2626}.modal-overlay{position:fixed;top:0;left:0;right:0;bottom:0;background:#00000080;display:flex;align-items:center;justify-content:center;z-index:1000}.modal-content{background:#fff;border-radius:8px;padding:0;max-width:500px;width:90%;max-height:80vh;overflow:hidden;display:flex;flex-direction:column}.modal-large{max-width:800px}.modal-header{display:flex;justify-content:space-between;align-items:center;padding:16px 24px;border-bottom:1px solid #e0e0e0}.modal-header h3{margin:0;font-size:20px;color:#333}.modal-close{background:none;border:none;font-size:24px;cursor:pointer;color:#999;padding:0;width:32px;height:32px;display:flex;align-items:center;justify-content:center}.modal-close:hover{color:#333}.modal-body{padding:24px;overflow-y:auto;flex:1}.modal-footer{display:flex;justify-content:flex-end;gap:12px;padding:16px 24px;border-top:1px solid #e0e0e0}.form-group{display:flex;flex-direction:column;gap:8px;margin-bottom:16px}.form-group label{font-size:14px;font-weight:500;color:#666}.form-group input{padding:8px;border:1px solid #ddd;border-radius:4px;font-size:14px}.btn-cancel{padding:8px 16px;border:1px solid #ddd;background:#fff;border-radius:4px;cursor:pointer;font-size:14px}.btn-cancel:hover{background:#f5f5f5}.saved-pages-list{display:flex;flex-direction:column;gap:12px}.saved-page-item{display:flex;justify-content:space-between;align-items:center;padding:16px;border:1px solid #e0e0e0;border-radius:4px;background:#fafafa}.page-info h4{margin:0 0 8px;font-size:16px;color:#333}.page-info p{margin:4px 0;font-size:12px;color:#666}.page-actions{display:flex;gap:8px}.page-actions button{padding:6px 12px;border:none;border-radius:4px;cursor:pointer;font-size:14px}.loading,.empty-state{text-align:center;padding:40px;color:#999}*{margin:0;padding:0;box-sizing:border-box}body{font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Oxygen,Ubuntu,Cantarell,Fira Sans,Droid Sans,Helvetica Neue,sans-serif;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale;background-color:#f5f5f5;-webkit-tap-highlight-color:transparent;touch-action:manipulation}button,a,input[type=button],input[type=submit],select{min-height:44px;min-width:44px}@media (max-width: 768px){body{font-size:14px}h1{font-size:24px}h2{font-size:20px}h3{font-size:18px}h4{font-size:16px}}@media (max-width: 768px){table{font-size:12px;display:block;overflow-x:auto;-webkit-overflow-scrolling:touch}input[type=text],input[type=email],input[type=password],input[type=number],textarea,select{font-size:16px}}#root{min-height:100vh;display:flex;flex-direction:column}