.hero-section{position: relative;padding: 4.5rem 0 3.5rem;text-align: center;overflow: hidden;background: radial-gradient(circle at 50% 20%,rgba(79,70,229,0.08) 0%,transparent 70%)}.hero-badge{display: inline-flex;align-items: center;gap: 0.5rem;background-color: var(--brand-primary-light);color: var(--brand-primary);padding: 0.35rem 0.85rem;border-radius: var(--radius-full);font-size: 0.85rem;font-weight: 600;margin-bottom: 1.5rem;border: 1px solid rgba(79,70,229,0.2)}.hero-title{font-size: 3rem;font-weight: 800;letter-spacing: -0.03em;margin-bottom: 1.25rem;line-height: 1.15}.hero-subtitle{font-size: 1.15rem;max-width: 680px;margin: 0 auto 2rem;color: var(--text-secondary)}.hero-search-box{max-width: 580px;margin: 0 auto 2rem;position: relative}.hero-search-input{width: 100%;padding: 1rem 1.25rem 1rem 3rem;font-size: 1rem;background: var(--bg-surface);border: 2px solid var(--border-color);border-radius: var(--radius-full);box-shadow: var(--shadow-md);color: var(--text-primary);outline: none;transition: all var(--transition-fast)}.hero-search-input:focus{border-color: var(--brand-primary);box-shadow: 0 0 0 4px rgba(79,70,229,0.15)}.hero-search-icon{position: absolute;left: 1.1rem;top: 50%;transform: translateY(-50%);color: var(--text-muted);pointer-events: none}.hero-ctas{display: flex;align-items: center;justify-content: center;gap: 1rem}.categories-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(270px,1fr));gap: 1.5rem;margin: 2rem 0}.category-card{background-color: var(--bg-surface);border: 1px solid var(--border-color);border-radius: 16px;padding: 1.6rem 1.4rem;transition: transform 0.25s cubic-bezier(0.16,1,0.3,1),box-shadow 0.25s ease,border-color 0.25s ease;display: flex;flex-direction: column;text-decoration: none;box-shadow: 0 4px 18px rgba(15,23,42,0.05),0 1px 3px rgba(0,0,0,0.03)}.category-card:hover{transform: translateY(-5px);border-color: rgba(99,102,241,0.45);box-shadow: 0 16px 36px -6px rgba(99,102,241,0.18),0 4px 12px rgba(0,0,0,0.04)}.category-icon-wrapper{width: 52px;height: 52px;border-radius: 14px;display: flex;align-items: center;justify-content: center;margin-bottom: 1.1rem;border: none;color: #ffffff !important;transition: transform 0.22s cubic-bezier(0.16,1,0.3,1),box-shadow 0.22s ease;flex-shrink: 0}.category-card:hover .category-icon-wrapper{transform: scale(1.08) rotate(-2deg)}.category-card h3{font-size: 1.15rem;font-weight: 700;color: var(--text-primary);margin-bottom: 0.45rem}.category-card p{font-size: 0.875rem;color: var(--text-secondary);line-height: 1.5;margin-bottom: 1.25rem;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden}.category-tool-count{font-size: 0.8rem;font-weight: 600;color: var(--brand-primary);margin-top: auto;display: flex;align-items: center;gap: 0.4rem}.tools-grid{display: grid;grid-template-columns: repeat(auto-fill,minmax(280px,1fr));gap: 1.5rem;margin: 1.5rem 0}.tool-card{background-color: #ffffff;border: 1px solid #e2e8f0;border-radius: 16px;padding: 1.35rem 1.25rem 1.15rem;display: flex;flex-direction: column;transition: transform 0.25s cubic-bezier(0.16,1,0.3,1),box-shadow 0.25s ease,border-color 0.25s ease;text-decoration: none;position: relative;box-shadow: 0 4px 18px rgba(15,23,42,0.05),0 1px 3px rgba(0,0,0,0.03)}.tool-card:hover{border-color: rgba(99,102,241,0.45);box-shadow: 0 16px 36px -6px rgba(99,102,241,0.18),0 4px 12px rgba(0,0,0,0.04);transform: translateY(-5px)}.tool-card-top{display: flex;align-items: center;justify-content: space-between;margin-bottom: 0.85rem}.tool-card-icon-badge{width: 48px;height: 48px;border-radius: 13px;display: flex;align-items: center;justify-content: center;border: none;color: #ffffff !important;transition: transform 0.22s cubic-bezier(0.16,1,0.3,1),box-shadow 0.22s ease;flex-shrink: 0}.tool-card-icon-badge svg{color: #ffffff !important;stroke: #ffffff !important;stroke-width: 2.2;display: block}.tool-card:hover .tool-card-icon-badge{transform: scale(1.08) rotate(-2deg)}.tool-badge{font-size: 0.72rem;font-weight: 700;padding: 0.25rem 0.6rem;border-radius: 9999px;text-transform: uppercase;letter-spacing: 0.05em}.tool-badge-free{background: rgba(16,185,129,0.12);color: #047857;border: 1px solid rgba(16,185,129,0.25)}[data-theme="dark"] .tool-badge-free{color: #34d399}.tool-badge-pro{background: rgba(245,158,11,0.15);color: #b45309;border: 1px solid rgba(245,158,11,0.3)}[data-theme="dark"] .tool-badge-pro{color: #fbbf24}.opt-format-chip{font-size: 0.72rem;font-weight: 700;padding: 0.2rem 0.55rem;border-radius: 6px;background: var(--bg-surface-raised);color: var(--text-secondary);border: 1px solid var(--border-color);letter-spacing: 0.02em}.tool-card-body{flex: 1;margin-bottom: 0.95rem}.tool-card-title{font-size: 1.05rem;font-weight: 700;color: #0f172a;margin: 0 0 0.35rem 0;line-height: 1.35;transition: color 0.15s ease}.tool-card:hover .tool-card-title{color: #4f46e5}.tool-card-description{font-size: 0.83rem;color: #64748b;line-height: 1.48;margin: 0;display: -webkit-box;-webkit-line-clamp: 2;-webkit-box-orient: vertical;overflow: hidden;min-height: 2.5em}.tool-card-bottom{margin-top: auto;padding-top: 0.75rem;border-top: 1px solid #f1f5f9}.tool-card-btn{display: flex;align-items: center;justify-content: center;gap: 0.45rem;width: 100%;padding: 0.62rem 1rem;background: linear-gradient(135deg,#6366f1 0%,#7c3aed 100%);color: #ffffff !important;font-weight: 600;font-size: 0.88rem;border-radius: 10px;box-shadow: 0 4px 12px rgba(99,102,241,0.25);transition: all 0.2s ease;text-decoration: none}.tool-card:hover .tool-card-btn{background: linear-gradient(135deg,#4f46e5 0%,#6d28d9 100%);box-shadow: 0 6px 18px rgba(99,102,241,0.4);transform: translateY(-1px)}.breadcrumb-nav{padding: 1rem 0;display: flex;align-items: center;gap: 0.5rem;font-size: 0.85rem;color: var(--text-muted)}.breadcrumb-nav a{color: var(--text-secondary)}.breadcrumb-separator{color: var(--text-muted)}.tool-workbench-card{background-color: var(--bg-surface);border: 1px solid var(--border-color);border-radius: var(--radius-lg);box-shadow: var(--shadow-sm);padding: 2rem;margin: 1.5rem 0}.tool-header-block{text-align: center;max-width: 760px;margin: 0 auto 2rem}.tool-header-block h1{font-size: 2.2rem;margin-bottom: 0.75rem}.tool-header-block p{font-size: 1.05rem}.tool-dropzone{border: 2px dashed var(--border-color);border-radius: var(--radius-lg);padding: 3rem 2rem;text-align: center;background-color: var(--bg-surface-raised);cursor: pointer;transition: all var(--transition-fast);margin-bottom: 1.5rem}.tool-dropzone.dragover,.tool-dropzone:hover{border-color: var(--brand-primary);background-color: var(--brand-primary-light)}.dropzone-icon{width: 56px;height: 56px;margin-bottom: 1rem;color: var(--brand-primary)}.dropzone-title{font-size: 1.15rem;font-weight: 700;margin-bottom: 0.35rem}.dropzone-subtitle{font-size: 0.85rem;color: var(--text-muted)}.tool-form-group{margin-bottom: 1.25rem}.tool-label{display: block;font-size: 0.9rem;font-weight: 600;margin-bottom: 0.5rem;color: var(--text-primary)}.tool-input,.tool-textarea,.tool-select{width: 100%;padding: 0.75rem 1rem;background-color: var(--bg-surface-raised);border: 1px solid var(--border-color);border-radius: var(--radius-md);font-size: 0.95rem;color: var(--text-primary);outline: none;transition: border-color var(--transition-fast)}.tool-input:focus,.tool-textarea:focus,.tool-select:focus{border-color: var(--brand-primary)}.tool-textarea{min-height: 140px;resize: vertical}.tool-processing-bar{display: none;text-align: center;padding: 2rem}.spinner{width: 40px;height: 40px;border: 4px solid var(--border-color);border-top-color: var(--brand-primary);border-radius: 50%;animation: spin 800ms linear infinite;margin: 0 auto 1rem}@keyframes spin{to{transform: rotate(360deg)}}.tool-result-area{display: none;background-color: var(--bg-surface-raised);border: 1px solid var(--border-color);border-radius: var(--radius-md);padding: 1.5rem;margin-top: 1.5rem}.result-header{display: flex;align-items: center;justify-content: space-between;margin-bottom: 1rem;padding-bottom: 0.75rem;border-bottom: 1px solid var(--border-color)}.result-actions{display: flex;align-items: center;gap: 0.5rem}.steps-container{display: grid;grid-template-columns: repeat(auto-fit,minmax(220px,1fr));gap: 1.5rem;margin: 2rem 0}.step-card{background-color: var(--bg-surface);border: 1px solid var(--border-color);border-radius: var(--radius-md);padding: 1.5rem;position: relative}.step-number{width: 32px;height: 32px;border-radius: 50%;background-color: var(--brand-primary);color: #fff;display: flex;align-items: center;justify-content: center;font-weight: 700;font-size: 0.9rem;margin-bottom: 0.75rem}.faq-list{display: flex;flex-direction: column;gap: 1rem;margin: 1.5rem 0}.faq-item{background-color: var(--bg-surface);border: 1px solid var(--border-color);border-radius: var(--radius-md);overflow: hidden}.faq-question{padding: 1.25rem;font-weight: 600;cursor: pointer;display: flex;align-items: center;justify-content: space-between;background: none;border: none;width: 100%;text-align: left;color: var(--text-primary)}.faq-answer{padding: 0 1.25rem 1.25rem;font-size: 0.95rem;line-height: 1.6;color: var(--text-secondary)}.pricing-grid{display: grid;grid-template-columns: repeat(auto-fit,minmax(260px,1fr));gap: 2rem;margin: 3rem 0}.pricing-card{background-color: var(--bg-surface);border: 1px solid var(--border-color);border-radius: var(--radius-lg);padding: 2.25rem 2rem;display: flex;flex-direction: column;position: relative;transition: all var(--transition-normal)}.pricing-card.recommended{border-color: var(--brand-primary);box-shadow: 0 0 0 2px var(--brand-primary),var(--shadow-lg)}.pricing-badge{position: absolute;top: -12px;left: 50%;transform: translateX(-50%);background: var(--brand-primary);color: #fff;padding: 0.25rem 0.75rem;border-radius: var(--radius-full);font-size: 0.75rem;font-weight: 700;text-transform: uppercase}.pricing-price{font-size: 2.5rem;font-weight: 800;color: var(--text-primary);margin: 1.25rem 0 0.5rem}.pricing-period{font-size: 0.9rem;color: var(--text-muted);font-weight: normal}.pricing-features{list-style: none;margin: 1.75rem 0;display: flex;flex-direction: column;gap: 0.85rem}.pricing-features li{display: flex;align-items: center;gap: 0.5rem;font-size: 0.9rem;color: var(--text-secondary)}.pricing-features li svg{color: var(--brand-accent);width: 18px;height: 18px;flex-shrink: 0}.modal-overlay{display: none;position: fixed;inset: 0;background-color: rgba(0,0,0,0.65);backdrop-filter: blur(4px);z-index: 2000;align-items: center;justify-content: center;padding: 1.5rem}.modal-overlay.active{display: flex}.modal-content{background-color: var(--bg-surface);border: 1px solid var(--border-color);border-radius: var(--radius-lg);max-width: 540px;width: 100%;padding: 2.25rem;box-shadow: var(--shadow-xl);position: relative}.modal-close-btn{position: absolute;top: 1.25rem;right: 1.25rem;background: none;border: none;cursor: pointer;color: var(--text-muted)}.modal-close-btn:hover{color: var(--text-primary)}.toast-container{position: fixed;bottom: 1.5rem;right: 1.5rem;z-index: 3000;display: flex;flex-direction: column;gap: 0.75rem}.toast{background-color: var(--bg-surface);border: 1px solid var(--border-color);box-shadow: var(--shadow-lg);padding: 0.875rem 1.25rem;border-radius: var(--radius-md);font-size: 0.9rem;display: flex;align-items: center;gap: 0.75rem;animation: slideUp 250ms ease}@keyframes slideUp{from{opacity: 0;transform: translateY(12px)}to{opacity: 1;transform: translateY(0)}}.tool-workflow-tabs{display: flex;align-items: center;gap: 0.35rem;border-bottom: 2px solid var(--border-color);background: var(--bg-surface-raised);padding: 0.5rem 0.75rem 0;border-top-left-radius: var(--radius-lg);border-top-right-radius: var(--radius-lg);overflow-x: auto;scrollbar-width: thin}.tool-workflow-tab{display: inline-flex;align-items: center;gap: 0.45rem;padding: 0.65rem 1rem;font-size: 0.88rem;font-weight: 600;color: var(--text-secondary);background: none;border: none;border-bottom: 3px solid transparent;cursor: pointer;white-space: nowrap;transition: all var(--transition-fast);margin-bottom: -2px;border-top-left-radius: var(--radius-sm);border-top-right-radius: var(--radius-sm)}.tool-workflow-tab:hover{color: var(--brand-primary);background: rgba(79,70,229,0.05)}.tool-workflow-tab.active{color: var(--brand-primary);border-bottom-color: var(--brand-primary);background: var(--bg-surface);font-weight: 700}.tool-workflow-tab .tab-badge{font-size: 0.7rem;padding: 0.15rem 0.45rem;border-radius: 999px;background: var(--border-color);color: var(--text-primary)}.tool-workflow-tab.active .tab-badge{background: var(--brand-primary-light);color: var(--brand-primary)}.tool-advanced-drawer{margin-top: 1.5rem;border: 1px solid var(--border-color);border-radius: var(--radius-md);overflow: hidden;background: var(--bg-surface-raised)}.tool-advanced-drawer-toggle{width: 100%;display: flex;align-items: center;justify-content: space-between;padding: 0.85rem 1.25rem;background: none;border: none;font-size: 0.9rem;font-weight: 600;color: var(--text-primary);cursor: pointer;transition: background var(--transition-fast)}.tool-advanced-drawer-toggle:hover{background: rgba(0,0,0,0.02)}.tool-advanced-drawer-toggle .toggle-icon{transition: transform 0.2s ease;font-size: 0.8rem;color: var(--text-muted)}.tool-advanced-drawer.open .tool-advanced-drawer-toggle .toggle-icon{transform: rotate(180deg)}.tool-advanced-drawer-content{display: none;padding: 1.25rem;border-top: 1px solid var(--border-color);background: var(--bg-surface)}.tool-advanced-drawer.open .tool-advanced-drawer-content{display: block}.tool-telemetry-box{background: var(--bg-surface-raised);border: 1px solid var(--border-color);border-radius: var(--radius-md);padding: 0.85rem 1.25rem;margin-top: 1rem;display: flex;align-items: center;justify-content: space-between;gap: 1rem;flex-wrap: wrap;font-size: 0.82rem;color: var(--text-secondary)}.tool-telemetry-chip{display: inline-flex;align-items: center;gap: 0.35rem}.chained-workflow-bar{margin-top: 1.5rem;padding: 1.25rem;background: var(--bg-surface);border: 1px solid var(--border-color);border-radius: var(--radius-md);box-shadow: 0 2px 6px rgba(0,0,0,0.03)}.chained-action-btn{display: inline-flex;align-items: center;gap: 0.45rem;padding: 0.5rem 0.9rem;background: var(--bg-surface-raised);border: 1px solid var(--border-color);border-radius: var(--radius-md);font-size: 0.85rem;font-weight: 600;color: var(--text-primary);cursor: pointer;transition: all var(--transition-fast)}.chained-action-btn:hover{border-color: var(--brand-primary);color: var(--brand-primary);background: var(--brand-primary-light);transform: translateY(-1px)}@media (max-width: 768px){.hero-title{font-size: clamp(1.85rem,5vw + 0.5rem,2.5rem)}.tool-header-block h1{font-size: 1.6rem}.tool-workbench-card{padding: 1.15rem}.modal-content{padding: 1.25rem;width: calc(100% - 24px) !important;max-height: 88vh;overflow-y: auto;border-radius: 16px}.tool-workflow-tabs{padding: 0.25rem 0.5rem 0;overflow-x: auto;flex-wrap: nowrap;-webkit-overflow-scrolling: touch}.tool-workflow-tab{padding: 0.5rem 0.75rem;font-size: 0.8rem;white-space: nowrap}.categories-grid{grid-template-columns: repeat(auto-fill,minmax(140px,1fr));gap: 0.75rem;margin: 1.25rem 0}.category-card{padding: 1rem 0.85rem;border-radius: 12px}.category-icon-wrapper{width: 40px;height: 40px;margin-bottom: 0.65rem;border-radius: 10px}.category-card h3{font-size: 0.95rem;margin-bottom: 0.25rem}.category-card p{font-size: 0.76rem;line-height: 1.35;margin-bottom: 0.65rem}.category-tool-count{font-size: 0.74rem}.steps-container{grid-template-columns: 1fr;gap: 1rem}.hero-ctas{flex-direction: column;width: 100%;gap: 0.65rem !important}.hero-ctas .btn{width: 100%;min-height: 46px}.pricing-grid{grid-template-columns: 1fr;gap: 1.25rem;margin: 1.75rem 0}.pricing-card{padding: 1.5rem 1.25rem;border-radius: 16px}.pricing-price{font-size: 2.1rem;margin: 1rem 0 0.25rem}.tool-inputs-duo-grid{grid-template-columns: 1fr !important}.tool-workbench-body{padding: 1.25rem 1rem !important}}@media (max-width: 360px){.categories-grid{grid-template-columns: 1fr}}.sticky-earning-popup{position: fixed;bottom: 24px;right: 24px;z-index: 9999;width: 295px;max-width: calc(100vw - 32px);background: #ffffff;border: 1px solid rgba(226,232,240,0.95);border-radius: 16px;box-shadow: 0 14px 35px -5px rgba(15,23,42,0.14),0 4px 12px -2px rgba(15,23,42,0.06),0 0 0 1px rgba(0,0,0,0.04);color: #0f172a;padding: 0.85rem 1rem 0.85rem;overflow: hidden;opacity: 0;transform: translateY(20px) scale(0.96);pointer-events: none;transition: opacity 0.3s cubic-bezier(0.16,1,0.3,1),transform 0.3s cubic-bezier(0.16,1,0.3,1);font-family: var(--font-family,system-ui,-apple-system,sans-serif)}[data-theme="dark"] .sticky-earning-popup{background: #1e293b;border-color: rgba(255,255,255,0.12);color: #f8fafc;box-shadow: 0 18px 40px -6px rgba(0,0,0,0.55),0 0 0 1px rgba(255,255,255,0.08)}.sticky-earning-popup.active{opacity: 1;transform: translateY(0) scale(1);pointer-events: auto}.sticky-earning-popup.closing{opacity: 0;transform: translateY(16px) scale(0.96);pointer-events: none}.earning-popup-glow{position: absolute;top: -30px;right: -30px;width: 100px;height: 100px;background: radial-gradient(circle,rgba(245,158,11,0.16) 0%,transparent 70%);pointer-events: none;border-radius: 50%}.earning-popup-close-btn{position: absolute;top: 10px;right: 10px;width: 28px;height: 28px;min-width: 28px;min-height: 28px;border-radius: 50%;border: 1px solid #e2e8f0;background: #f8fafc;color: #64748b;display: flex;align-items: center;justify-content: center;cursor: pointer;padding: 0;transition: all 0.2s ease;z-index: 10001;touch-action: manipulation;-webkit-tap-highlight-color: transparent}[data-theme="dark"] .earning-popup-close-btn{background: #334155;border-color: #475569;color: #cbd5e1}.earning-popup-close-btn:hover{background: #fee2e2;color: #ef4444;border-color: #fca5a5;transform: rotate(90deg)}.earning-popup-content{position: relative;z-index: 2}.earning-popup-header-row{display: flex;align-items: center;gap: 0.45rem;margin-bottom: 0.45rem;flex-wrap: wrap}.earning-popup-badge{display: inline-flex;align-items: center;gap: 0.25rem;background: #fef3c7;border: 1px solid rgba(245,158,11,0.35);color: #b45309;padding: 0.16rem 0.48rem;border-radius: 9999px;font-size: 0.65rem;font-weight: 800;letter-spacing: 0.03em;text-transform: uppercase}[data-theme="dark"] .earning-popup-badge{background: rgba(245,158,11,0.15);color: #fde047;border-color: rgba(245,158,11,0.35)}.earning-popup-badge-icon{font-size: 0.76rem;animation: pulseFire 1.6s ease-in-out infinite alternate}@keyframes pulseFire{0%{transform: scale(1)}100%{transform: scale(1.2)}}.earning-popup-title{font-size: 0.96rem;font-weight: 800;color: #0f172a;margin: 0 0 0.25rem 0;line-height: 1.25;letter-spacing: -0.015em}[data-theme="dark"] .earning-popup-title{color: #f8fafc}.earning-popup-reward-pill{display: inline-flex;align-items: center;gap: 0.25rem;background: #ecfdf5;border: 1px solid rgba(16,185,129,0.35);color: #047857;font-size: 0.72rem;font-weight: 700;padding: 0.16rem 0.5rem;border-radius: 9999px}[data-theme="dark"] .earning-popup-reward-pill{background: rgba(16,185,129,0.15);color: #34d399}.earning-popup-desc{font-size: 0.75rem;color: #64748b;line-height: 1.35;margin: 0 0 0.6rem 0}[data-theme="dark"] .earning-popup-desc{color: #94a3b8}.earning-popup-actions{display: flex;align-items: center;gap: 0.5rem}.earning-popup-cta-btn{display: inline-flex;align-items: center;justify-content: center;gap: 0.4rem;width: 100%;background: linear-gradient(135deg,#f59e0b 0%,#ea580c 100%);color: #ffffff !important;font-weight: 700;font-size: 0.82rem;padding: 0.45rem 0.85rem;border-radius: 8px;text-decoration: none;box-shadow: 0 3px 10px rgba(245,158,11,0.28);transition: all 0.2s ease}.earning-popup-cta-btn:hover{background: linear-gradient(135deg,#fbbf24 0%,#f97316 100%);box-shadow: 0 5px 14px rgba(245,158,11,0.38);transform: translateY(-1px)}@media (max-width: 768px){.sticky-earning-popup{bottom: calc(var(--mobile-nav-height,60px) + 12px);right: 14px}}@media (max-width: 480px){.sticky-earning-popup{bottom: calc(var(--mobile-nav-height,60px) + 12px);right: 12px;left: 12px;margin-inline: auto;width: calc(100% - 24px);max-width: 320px;padding: 0.75rem 0.85rem;border-radius: 14px;box-shadow: 0 10px 28px -4px rgba(15,23,42,0.16),0 2px 8px rgba(0,0,0,0.06)}.earning-popup-title{font-size: 0.92rem}.earning-popup-desc{font-size: 0.72rem;margin-bottom: 0.5rem}.earning-popup-cta-btn{padding: 0.42rem 0.75rem;font-size: 0.8rem}}.tool-guide-article{margin: 3.5rem 0 2rem;width: 100%}.tool-guide-card{background: var(--bg-surface);border: 1px solid var(--border-color);border-radius: var(--radius-lg,16px);padding: 2.25rem 2.5rem;box-shadow: 0 4px 20px rgba(0,0,0,0.04);position: relative;overflow: hidden;transition: border-color 0.2s ease,box-shadow 0.2s ease}.tool-guide-card::before{content: '';position: absolute;top: 0;left: 0;right: 0;height: 4px;background: linear-gradient(90deg,var(--brand-primary,#4f46e5) 0%,#06b6d4 50%,var(--brand-accent,#10b981) 100%)}.tool-guide-header{margin-bottom: 1.5rem}.tool-guide-meta{display: flex;align-items: center;flex-wrap: wrap;gap: 0.75rem 1.25rem;margin-bottom: 0.85rem;font-size: 0.84rem}.tool-guide-badge{display: inline-flex;align-items: center;gap: 0.35rem;background: rgba(79,70,229,0.1);color: var(--brand-primary,#4f46e5);padding: 0.3rem 0.75rem;border-radius: 9999px;font-weight: 700;font-size: 0.78rem;letter-spacing: 0.03em;text-transform: uppercase}.tool-guide-readtime,.tool-guide-author{display: inline-flex;align-items: center;gap: 0.35rem;color: var(--text-muted);font-weight: 500}.tool-guide-title{font-size: 1.65rem;font-weight: 800;line-height: 1.35;color: var(--text-primary);margin: 0.5rem 0 0.65rem;letter-spacing: -0.015em}.tool-guide-excerpt{font-size: 1.02rem;color: var(--text-secondary);line-height: 1.6;margin: 0.5rem 0 0}.tool-guide-divider{height: 1px;background: linear-gradient(90deg,var(--border-color) 0%,transparent 100%);margin: 1.5rem 0 1.75rem}.tool-guide-body{font-size: 0.98rem;line-height: 1.75;color: var(--text-secondary)}.tool-guide-body p{margin-bottom: 1.15rem}.tool-guide-body p:last-child{margin-bottom: 0}.tool-guide-body h3,.tool-guide-body h4{color: var(--text-primary);font-weight: 700;margin: 1.5rem 0 0.65rem;line-height: 1.35}.tool-guide-body h3{font-size: 1.25rem}.tool-guide-body h4{font-size: 1.1rem}.tool-guide-body ul,.tool-guide-body ol{margin: 0.75rem 0 1.25rem 1.25rem;padding-left: 0.5rem}.tool-guide-body li{margin-bottom: 0.5rem}.tool-guide-body strong{color: var(--text-primary);font-weight: 700}.tool-guide-body a{color: var(--brand-primary);text-decoration: underline;text-underline-offset: 3px}.tool-guide-body a:hover{color: var(--brand-accent)}.tool-guide-footer{display: flex;align-items: center;justify-content: space-between;flex-wrap: wrap;gap: 1rem;margin-top: 1.75rem;padding-top: 1.25rem;border-top: 1px dashed var(--border-color-subtle,var(--border-color));font-size: 0.82rem;color: var(--text-muted)}.tool-guide-rotation-note{display: inline-flex;align-items: center;gap: 0.45rem;font-weight: 500}.tool-guide-rotation-note svg{color: var(--brand-primary);flex-shrink: 0}.tool-guide-brand-tag{font-weight: 600;text-transform: uppercase;letter-spacing: 0.05em;font-size: 0.75rem;color: var(--text-muted)}@media (max-width: 640px){.tool-guide-footer{flex-direction: column;align-items: flex-start}}.hero-ref-section{position: relative;background: linear-gradient(135deg,#070d22 0%,#0c1844 40%,#13266b 75%,#1a3594 100%);color: #ffffff;padding: 4.5rem 0 5.5rem;overflow: hidden}.hero-ref-mesh{position: absolute;inset: 0;pointer-events: none;background-image: radial-gradient(ellipse 650px 480px at 85% 55%,rgba(56,189,248,0.28),transparent 70%),radial-gradient(circle 500px at 15% 20%,rgba(99,102,241,0.2),transparent 60%),radial-gradient(circle 400px at 50% 90%,rgba(139,92,246,0.15),transparent 60%);z-index: 0}.hero-ref-stars{position: absolute;inset: 0;pointer-events: none;background-image: radial-gradient(1.5px 1.5px at 12% 18%,rgba(255,255,255,0.8),transparent),radial-gradient(2px 2px at 78% 14%,rgba(255,255,255,0.9),transparent),radial-gradient(1px 1px at 42% 38%,rgba(255,255,255,0.6),transparent),radial-gradient(2px 2px at 92% 65%,rgba(255,255,255,0.8),transparent),radial-gradient(1.5px 1.5px at 28% 82%,rgba(255,255,255,0.7),transparent),radial-gradient(2px 2px at 60% 75%,rgba(255,255,255,0.5),transparent);z-index: 0}.hero-ref-container{position: relative;z-index: 1;max-width: 1320px;margin: 0 auto;padding: 0 1.5rem;display: grid;grid-template-columns: 1.15fr 1fr;align-items: center;gap: 3.5rem}.hero-ref-badge{display: inline-flex;align-items: center;gap: 0.55rem;background: rgba(255,255,255,0.08);color: #e0e7ff;border: 1px solid rgba(255,255,255,0.22);backdrop-filter: blur(12px);-webkit-backdrop-filter: blur(12px);padding: 0.42rem 1.15rem;border-radius: 9999px;font-size: 0.86rem;font-weight: 700;letter-spacing: 0.02em;margin-bottom: 1.35rem;box-shadow: 0 4px 15px rgba(0,0,0,0.2)}.hero-ref-title{font-size: clamp(2.3rem,4.4vw,3.6rem);font-weight: 900;line-height: 1.14;letter-spacing: -0.025em;color: #ffffff;margin: 0 0 1.25rem 0}.hero-ref-title-gradient{background: linear-gradient(90deg,#38bdf8 0%,#818cf8 45%,#c084fc 100%);-webkit-background-clip: text;-webkit-text-fill-color: transparent;display: inline-block}.hero-ref-subtitle{font-size: clamp(1rem,1.8vw,1.14rem);color: rgba(224,231,255,0.88);line-height: 1.6;max-width: 560px;margin: 0 0 2rem 0}.hero-ref-search-box{position: relative;max-width: 560px;margin-bottom: 2.2rem}.hero-ref-search-inner{display: flex;align-items: center;background: #ffffff;border-radius: 9999px;padding: 0.35rem 0.45rem 0.35rem 1.4rem;box-shadow: 0 15px 35px -5px rgba(0,0,0,0.35),0 0 0 1px rgba(255,255,255,0.25);transition: all 0.25s ease}.hero-ref-search-inner:focus-within{box-shadow: 0 20px 45px -5px rgba(56,189,248,0.45),0 0 0 2px #38bdf8}.hero-ref-search-icon{color: #94a3b8;margin-right: 0.75rem;flex-shrink: 0}.hero-ref-search-input{flex: 1;border: none;background: transparent;font-size: 0.98rem;color: #0f172a;outline: none;padding: 0.75rem 0;min-width: 0}.hero-ref-search-input::placeholder{color: #94a3b8;font-size: 0.94rem}.hero-ref-search-btn{width: 44px;height: 44px;border-radius: 50%;background: linear-gradient(135deg,#6366f1 0%,#4f46e5 100%);color: #ffffff;border: none;display: flex;align-items: center;justify-content: center;cursor: pointer;flex-shrink: 0;box-shadow: 0 4px 14px rgba(79,70,229,0.45);transition: transform 0.2s ease,box-shadow 0.2s ease}.hero-ref-search-btn:hover{transform: scale(1.08);box-shadow: 0 6px 20px rgba(79,70,229,0.65)}.hero-ref-benefits{display: flex;align-items: center;gap: 1.6rem;flex-wrap: wrap}.hero-ref-benefit-item{display: inline-flex;align-items: center;gap: 0.55rem;font-size: 0.86rem;font-weight: 600;color: rgba(255,255,255,0.92)}.hero-ref-benefit-icon{display: flex;align-items: center;justify-content: center;color: #38bdf8;font-size: 1.1rem}.hero-ref-right{position: relative;display: flex;align-items: center;justify-content: flex-end;min-height: 440px}.ai-assistant-card{width: 380px;max-width: 100%;background: rgba(255,255,255,0.95);backdrop-filter: blur(24px);-webkit-backdrop-filter: blur(24px);border: 1px solid rgba(255,255,255,0.45);border-radius: 22px;padding: 1.35rem 1.4rem;box-shadow: 0 25px 60px -10px rgba(0,0,0,0.4),0 0 0 1px rgba(255,255,255,0.2);color: #0f172a;position: relative;z-index: 2;transition: transform 0.25s cubic-bezier(0.16,1,0.3,1),box-shadow 0.25s ease;will-change: transform}[data-theme="dark"] .ai-assistant-card{background: rgba(15,23,42,0.92);border: 1px solid rgba(255,255,255,0.14);color: #f8fafc;box-shadow: 0 25px 60px -10px rgba(0,0,0,0.7),0 0 30px rgba(56,189,248,0.15)}.ai-assistant-header{display: flex;align-items: center;justify-content: space-between;margin-bottom: 1.1rem;padding-bottom: 0.85rem;border-bottom: 1px solid #f1f5f9}[data-theme="dark"] .ai-assistant-header{border-bottom-color: #334155}.ai-header-left{display: flex;align-items: center;gap: 0.75rem}.ai-header-avatar{width: 38px;height: 38px;border-radius: 11px;background: linear-gradient(135deg,#6366f1 0%,#3b82f6 100%);display: flex;align-items: center;justify-content: center;color: #ffffff;box-shadow: 0 4px 12px rgba(79,70,229,0.35)}.ai-header-title-row{display: flex;align-items: center;gap: 0.45rem}.ai-header-title{font-size: 0.98rem;font-weight: 800;color: #0f172a;line-height: 1}[data-theme="dark"] .ai-header-title{color: #f8fafc}.ai-online-badge{font-size: 0.65rem;font-weight: 700;background: rgba(16,185,129,0.14);color: #10b981;border: 1px solid rgba(16,185,129,0.35);padding: 0.15rem 0.48rem;border-radius: 999px;line-height: 1}.ai-header-subtitle{font-size: 0.72rem;color: #64748b;margin-top: 0.25rem}[data-theme="dark"] .ai-header-subtitle{color: #94a3b8}.ai-header-more{color: #94a3b8;cursor: pointer;padding: 0.25rem}.ai-chat-body{margin-bottom: 1rem;max-height: 170px;overflow-y: auto;display: flex;flex-direction: column;gap: 0.65rem}.ai-chat-bubble-bot{display: flex;align-items: flex-start;gap: 0.65rem;background: #f8fafc;border: 1px solid #e2e8f0;border-radius: 14px;border-top-left-radius: 4px;padding: 0.75rem 0.95rem;font-size: 0.86rem;color: #1e293b;line-height: 1.45}[data-theme="dark"] .ai-chat-bubble-bot{background: #1e293b;border-color: #334155;color: #e2e8f0}.ai-bubble-avatar{width: 26px;height: 26px;border-radius: 7px;background: rgba(79,70,229,0.15);display: flex;align-items: center;justify-content: center;font-size: 0.9rem;flex-shrink: 0}.ai-prompt-chips{display: flex;flex-wrap: wrap;gap: 0.45rem;margin-bottom: 1.15rem}.ai-chip{background: #f1f5f9;border: 1px solid #e2e8f0;color: #334155;border-radius: 999px;padding: 0.35rem 0.75rem;font-size: 0.76rem;font-weight: 600;cursor: pointer;transition: all 0.18s ease;user-select: none}[data-theme="dark"] .ai-chip{background: #1e293b;border-color: #334155;color: #cbd5e1}.ai-chip:hover{background: #e0e7ff;border-color: #818cf8;color: #4338ca;transform: translateY(-2px)}[data-theme="dark"] .ai-chip:hover{background: rgba(79,70,229,0.3);border-color: #818cf8;color: #e0e7ff}.ai-chat-input-bar{display: flex;align-items: center;gap: 0.5rem;background: #f8fafc;border: 1px solid #e2e8f0;border-radius: 999px;padding: 0.3rem 0.35rem 0.3rem 1rem}[data-theme="dark"] .ai-chat-input-bar{background: #1e293b;border-color: #334155}.ai-chat-input{flex: 1;border: none;background: transparent;font-size: 0.82rem;color: #0f172a;outline: none;min-width: 0}[data-theme="dark"] .ai-chat-input{color: #f8fafc}.ai-chat-send-btn{width: 32px;height: 32px;border-radius: 50%;background: linear-gradient(135deg,#6366f1 0%,#4f46e5 100%);color: #ffffff;border: none;display: flex;align-items: center;justify-content: center;cursor: pointer;box-shadow: 0 2px 8px rgba(79,70,229,0.35);transition: transform 0.15s ease}.ai-chat-send-btn:hover{transform: scale(1.1)}.ai-tool-results-list{display: flex;flex-direction: column;gap: 0.5rem;margin-top: 0.6rem}.ai-tool-card-result{display: flex;align-items: center;gap: 0.65rem;padding: 0.55rem 0.75rem;background: #ffffff;border: 1px solid #e2e8f0;border-radius: 12px;text-decoration: none;box-shadow: 0 2px 6px rgba(0,0,0,0.04);transition: all 0.2s cubic-bezier(0.16,1,0.3,1);color: #0f172a}[data-theme="dark"] .ai-tool-card-result{background: #1e293b;border-color: #334155;color: #f8fafc}.ai-tool-card-result:hover{transform: translateY(-2px);border-color: #6366f1;box-shadow: 0 6px 14px -2px rgba(99,102,241,0.25)}.ai-tool-card-icon{width: 32px;height: 32px;border-radius: 9px;display: flex;align-items: center;justify-content: center;color: #ffffff;flex-shrink: 0;font-size: 0.95rem}.ai-tool-card-info{flex: 1;min-width: 0}.ai-tool-card-name{font-size: 0.84rem;font-weight: 700;color: #0f172a;white-space: nowrap;overflow: hidden;text-overflow: ellipsis}[data-theme="dark"] .ai-tool-card-name{color: #f8fafc}.ai-tool-card-sub{font-size: 0.73rem;color: #64748b;white-space: nowrap;overflow: hidden;text-overflow: ellipsis}[data-theme="dark"] .ai-tool-card-sub{color: #94a3b8}.ai-tool-card-arrow{color: #6366f1;font-weight: 800;font-size: 0.88rem;transition: transform 0.15s ease}.ai-tool-card-result:hover .ai-tool-card-arrow{transform: translateX(3px)}.hero-mascot-stage{position: relative;width: 285px;height: 380px;margin-left: 10px;z-index: 1;display: flex;align-items: center;justify-content: center;flex-shrink: 0}.mascot-robot-img-wrap{width: 265px;height: 265px;aspect-ratio: 1 / 1;border-radius: 50%;overflow: hidden;position: relative;animation: floatMascot 4.5s ease-in-out infinite;box-shadow: 0 25px 50px rgba(0,0,0,0.5),0 0 45px rgba(56,189,248,0.45);border: 3.5px solid rgba(56,189,248,0.55)}.mascot-robot-img{width: 100%;height: 100%;object-fit: cover;transform: scale(1.06);display: block}.mascot-annotation{position: absolute;top: -20px;right: 10px;text-align: right;font-family: inherit;font-weight: 700;font-size: 0.74rem;color: #e0e7ff;white-space: nowrap;pointer-events: none;line-height: 1.25;display: flex;flex-direction: column;align-items: flex-end}.mascot-curved-arrow{width: 44px;height: 30px;margin-top: 2px;margin-right: 15px}.floating-badge{position: absolute;width: 40px;height: 40px;border-radius: 12px;display: flex;align-items: center;justify-content: center;color: #ffffff;box-shadow: 0 10px 22px rgba(0,0,0,0.3);border: 1.5px solid rgba(255,255,255,0.4);z-index: 4}.badge-green{background: linear-gradient(135deg,#10b981 0%,#059669 100%);left: -12px;top: 35px;animation: floatBadgeOne 3.8s ease-in-out infinite alternate}.badge-orange{background: linear-gradient(135deg,#f97316 0%,#ea580c 100%);left: -20px;bottom: 85px;animation: floatBadgeTwo 4.4s ease-in-out infinite alternate 0.5s}.badge-purple{background: linear-gradient(135deg,#8b5cf6 0%,#6d28d9 100%);right: 15px;bottom: 25px;animation: floatBadgeThree 4.1s ease-in-out infinite alternate 1s}.section-popular-ref{padding: 4.8rem 0 4.2rem;background: var(--bg-body);position: relative}.section-ref-header{display: flex;align-items: flex-end;justify-content: space-between;margin-bottom: 2.2rem;flex-wrap: wrap;gap: 1rem}.section-ref-title-group{display: flex;flex-direction: column;gap: 0.35rem}.section-ref-title{font-size: 1.95rem;font-weight: 800;color: var(--text-primary);display: flex;align-items: center;gap: 0.6rem;letter-spacing: -0.025em;margin: 0}.section-ref-subtitle{font-size: 0.96rem;color: var(--text-secondary);margin: 0}.section-ref-link{font-size: 0.9rem;font-weight: 700;color: var(--brand-primary);text-decoration: none;display: inline-flex;align-items: center;gap: 0.4rem;transition: transform 0.15s ease,color 0.15s ease}.section-ref-link:hover{transform: translateX(4px);color: var(--brand-primary-hover)}.popular-ref-grid{display: grid;grid-template-columns: repeat(6,1fr);gap: 1.25rem}.popular-card-3d{border-radius: 18px;padding: 1.6rem 1.35rem;text-decoration: none;display: flex;flex-direction: column;position: relative;overflow: hidden;border: 1px solid rgba(0,0,0,0.05);box-shadow: 0 8px 20px -4px rgba(0,0,0,0.04);transition: transform 0.28s cubic-bezier(0.16,1,0.3,1),box-shadow 0.28s ease,border-color 0.28s ease;will-change: transform}.popular-card-3d:hover{transform: translateY(-8px) scale(1.02);box-shadow: 0 20px 35px -8px var(--card-glow,rgba(79,70,229,0.18))}.popular-card-pdf{background: #fef2f2;--card-glow: rgba(239,68,68,0.25)}[data-theme="dark"] .popular-card-pdf{background: rgba(239,68,68,0.08);border-color: rgba(239,68,68,0.22)}.popular-card-image{background: #f0fdf4;--card-glow: rgba(16,185,129,0.25)}[data-theme="dark"] .popular-card-image{background: rgba(16,185,129,0.08);border-color: rgba(16,185,129,0.22)}.popular-card-calc{background: #faf5ff;--card-glow: rgba(139,92,246,0.25)}[data-theme="dark"] .popular-card-calc{background: rgba(139,92,246,0.08);border-color: rgba(139,92,246,0.22)}.popular-card-youtube{background: #fff7ed;--card-glow: rgba(249,115,22,0.25)}[data-theme="dark"] .popular-card-youtube{background: rgba(249,115,22,0.08);border-color: rgba(249,115,22,0.22)}.popular-card-invoice{background: #eff6ff;--card-glow: rgba(59,130,246,0.25)}[data-theme="dark"] .popular-card-invoice{background: rgba(59,130,246,0.08);border-color: rgba(59,130,246,0.22)}.popular-card-tts{background: #f0fdfa;--card-glow: rgba(6,182,212,0.25)}[data-theme="dark"] .popular-card-tts{background: rgba(6,182,212,0.08);border-color: rgba(6,182,212,0.22)}.popular-card-icon-box{width: 48px;height: 48px;border-radius: 14px;display: flex;align-items: center;justify-content: center;color: #ffffff;margin-bottom: 1.15rem;box-shadow: 0 8px 16px -2px rgba(0,0,0,0.16);transition: transform 0.25s ease;flex-shrink: 0}.popular-card-3d:hover .popular-card-icon-box{transform: scale(1.1) rotate(2deg)}.popular-card-title{font-size: 1.06rem;font-weight: 800;color: var(--text-primary);margin: 0 0 0.45rem 0;line-height: 1.3}.popular-card-desc{font-size: 0.85rem;color: var(--text-secondary);line-height: 1.48;margin: 0 0 1.35rem 0;flex: 1}.popular-card-action{font-size: 0.84rem;font-weight: 700;color: var(--brand-primary);display: inline-flex;align-items: center;gap: 0.35rem;margin-top: auto;transition: transform 0.18s ease}.popular-card-3d:hover .popular-card-action{transform: translateX(4px)}.section-category-ref{padding: 4.2rem 0;background: var(--bg-surface-raised);border-top: 1px solid var(--border-color);border-bottom: 1px solid var(--border-color)}.category-strip-grid{display: grid;grid-template-columns: repeat(10,1fr);gap: 0.85rem}.category-pill-card{background: var(--bg-surface);border: 1px solid var(--border-color);border-radius: 16px;padding: 1.2rem 0.75rem;display: flex;flex-direction: column;align-items: center;text-align: center;text-decoration: none;box-shadow: 0 2px 8px rgba(0,0,0,0.03);transition: transform 0.22s cubic-bezier(0.16,1,0.3,1),box-shadow 0.22s ease,border-color 0.22s ease}.category-pill-card:hover{transform: translateY(-5px);box-shadow: 0 12px 25px -4px rgba(79,70,229,0.14);border-color: rgba(79,70,229,0.35)}.category-pill-icon{width: 44px;height: 44px;border-radius: 13px;display: flex;align-items: center;justify-content: center;margin-bottom: 0.75rem;transition: transform 0.22s ease}.category-pill-card:hover .category-pill-icon{transform: scale(1.12)}.category-pill-label{font-size: 0.82rem;font-weight: 700;color: var(--text-primary);line-height: 1.2}.section-ai-banner{padding: 4.8rem 0;background: var(--bg-body)}.ai-banner-card{background: linear-gradient(135deg,#f5f3ff 0%,#eff6ff 50%,#ecfeff 100%);border: 1px solid rgba(165,180,252,0.4);border-radius: 24px;padding: 2.8rem 3.2rem;display: grid;grid-template-columns: 1.25fr 1fr 1.15fr;align-items: center;gap: 2.8rem;position: relative;overflow: hidden;box-shadow: 0 18px 45px -10px rgba(79,70,229,0.1)}[data-theme="dark"] .ai-banner-card{background: linear-gradient(135deg,rgba(30,27,75,0.45) 0%,rgba(15,23,42,0.85) 50%,rgba(14,116,144,0.25) 100%);border-color: rgba(129,140,248,0.25);box-shadow: 0 20px 50px -10px rgba(0,0,0,0.6)}.ai-banner-badge{display: inline-flex;align-items: center;gap: 0.35rem;background: rgba(79,70,229,0.12);color: var(--brand-primary);border: 1px solid rgba(79,70,229,0.25);padding: 0.25rem 0.75rem;border-radius: 999px;font-size: 0.75rem;font-weight: 800;letter-spacing: 0.04em;margin-bottom: 0.85rem}.ai-banner-title{font-size: 2.15rem;font-weight: 900;color: var(--text-primary);letter-spacing: -0.025em;margin: 0 0 0.65rem 0}.ai-banner-desc{font-size: 0.95rem;color: var(--text-secondary);line-height: 1.55;margin: 0 0 1.6rem 0}.ai-banner-btn{display: inline-flex;align-items: center;gap: 0.5rem;background: linear-gradient(135deg,#6366f1 0%,#4f46e5 100%);color: #ffffff;padding: 0.85rem 1.85rem;border-radius: 12px;font-weight: 700;font-size: 0.95rem;text-decoration: none;box-shadow: 0 8px 22px -4px rgba(79,70,229,0.45);transition: transform 0.2s ease,box-shadow 0.2s ease}.ai-banner-btn:hover{transform: translateY(-2px);box-shadow: 0 12px 28px -4px rgba(79,70,229,0.6)}.ai-banner-checklist{list-style: none;padding: 0;margin: 0;display: flex;flex-direction: column;gap: 0.85rem}.ai-checklist-item{display: flex;align-items: center;gap: 0.7rem;font-size: 0.94rem;font-weight: 600;color: var(--text-primary)}.ai-check-icon{color: #10b981;font-weight: 800;font-size: 1.1rem}.ai-banner-graphic{position: relative;display: flex;align-items: center;justify-content: center}.ai-banner-img,.ai-banner-robot-img{width: 100%;max-width: 290px;height: auto;border-radius: 22px;box-shadow: 0 20px 45px rgba(79,70,229,0.28),0 0 35px rgba(56,189,248,0.22);display: block;animation: robotFloatLively 5.5s ease-in-out infinite;transform-origin: center center;transition: transform 0.3s ease}.ai-banner-robot-img:hover{transform: scale(1.05) rotate(-1.5deg)}@keyframes robotFloatLively{0%{transform: translateY(0px) rotate(0deg) scale(1);box-shadow: 0 16px 35px rgba(79,70,229,0.22),0 0 25px rgba(56,189,248,0.18)}25%{transform: translateY(-10px) rotate(2deg) scale(1.02);box-shadow: 0 24px 48px rgba(79,70,229,0.32),0 0 40px rgba(56,189,248,0.28)}50%{transform: translateY(-4px) rotate(-1.8deg) scale(0.99);box-shadow: 0 18px 38px rgba(79,70,229,0.24),0 0 28px rgba(56,189,248,0.2)}75%{transform: translateY(-13px) rotate(1.2deg) scale(1.015);box-shadow: 0 28px 52px rgba(79,70,229,0.34),0 0 44px rgba(56,189,248,0.3)}100%{transform: translateY(0px) rotate(0deg) scale(1);box-shadow: 0 16px 35px rgba(79,70,229,0.22),0 0 25px rgba(56,189,248,0.18)}}@media (max-width: 1240px){.popular-ref-grid{grid-template-columns: repeat(3,1fr)}.category-strip-grid{grid-template-columns: repeat(5,1fr);gap: 0.75rem}}@media (max-width: 1024px){.hero-ref-container{grid-template-columns: 1fr;gap: 3.5rem;text-align: center}.hero-ref-subtitle{margin-left: auto;margin-right: auto}.hero-ref-search-box{margin-left: auto;margin-right: auto}.hero-ref-benefits{justify-content: center}.hero-ref-right{justify-content: center;min-height: auto}.ai-banner-card{grid-template-columns: 1fr;text-align: center;padding: 2.2rem 1.8rem}.ai-banner-checklist{align-items: center}.ai-banner-btn{justify-content: center}}@media (max-width: 768px){.hero-ref-section{padding: 3rem 0 3.5rem;overflow: hidden}.hero-ref-container{padding: 0 1rem;gap: 2rem;width: 100%;max-width: 100%;box-sizing: border-box}.hero-ref-title{font-size: clamp(1.8rem,6.5vw,2.4rem);line-height: 1.18}.hero-ref-subtitle{font-size: 0.94rem;margin-bottom: 1.5rem}.hero-ref-search-box{width: 100%;max-width: 100%;margin-bottom: 1.6rem}.hero-ref-search-inner{width: 100%;max-width: 100%;box-sizing: border-box;padding: 0.35rem 0.45rem 0.35rem 1.1rem}.popular-ref-grid{grid-template-columns: repeat(2,1fr);gap: 1rem}.hero-mascot-stage{margin-left: 0;margin-top: 1.5rem}.hero-ref-right{flex-direction: column;align-items: center;width: 100%;max-width: 100%;overflow: hidden}}@media (max-width: 520px){.hero-ref-section{padding: 2.2rem 0 2.8rem}.hero-ref-container{padding: 0 0.85rem}.hero-ref-badge{font-size: 0.78rem;padding: 0.32rem 0.85rem;margin-bottom: 1rem}.hero-ref-title{font-size: clamp(1.6rem,7vw,2.1rem)}.hero-ref-search-inner{padding: 0.28rem 0.35rem 0.28rem 0.85rem}.hero-ref-search-input{font-size: 0.86rem}.hero-ref-search-btn{width: 38px;height: 38px;min-width: 38px}.popular-ref-grid{grid-template-columns: 1fr}.category-strip-grid{grid-template-columns: repeat(2,1fr)}.ai-assistant-card{width: 100%;max-width: 100%;box-sizing: border-box;padding: 1rem 0.85rem;border-radius: 18px}.ai-prompt-chips{justify-content: center;gap: 0.35rem}.ai-chip{font-size: 0.74rem;padding: 0.3rem 0.55rem}.hero-ref-benefits{display: grid;grid-template-columns: 1fr 1fr;text-align: left;gap: 0.65rem 0.75rem;width: 100%}.hero-ref-benefit-item{font-size: 0.78rem;min-width: 0;white-space: normal;line-height: 1.25}.hero-mascot-stage{width: 100%;max-width: 260px;height: 250px;margin: 1.25rem auto 0}.mascot-robot-img-wrap{width: 180px;height: 180px}.floating-badge{width: 34px;height: 34px;border-radius: 10px}.badge-green{left: 4px;top: 25px}.badge-orange{left: 4px;bottom: 60px}.badge-purple{right: 8px;bottom: 15px}.mascot-annotation{top: -16px;right: 0;font-size: 0.68rem}}.floating-ai-launcher-wrap{position: fixed;bottom: 28px;right: 28px;z-index: 99980;display: inline-flex;align-items: center;transition: opacity 0.25s ease,transform 0.25s ease}.floating-ai-launcher{position: relative;display: flex;align-items: center;gap: 10px;padding: 10px 18px 10px 12px;background: linear-gradient(135deg,#4f46e5 0%,#7c3aed 100%);color: #ffffff;border: 1px solid rgba(255,255,255,0.25);border-radius: 999px;box-shadow: 0 10px 28px rgba(79,70,229,0.42),0 2px 6px rgba(0,0,0,0.12);font-size: 0.93rem;font-weight: 700;cursor: pointer;transition: all 0.25s cubic-bezier(0.16,1,0.3,1);text-decoration: none}.floating-ai-launcher-close-btn{position: absolute;top: -6px;right: -6px;width: 24px;height: 24px;min-width: 24px;min-height: 24px;border-radius: 50%;background: #1e1b4b;color: #ffffff;border: 1.5px solid rgba(255,255,255,0.7);box-shadow: 0 2px 6px rgba(0,0,0,0.3);display: flex;align-items: center;justify-content: center;font-size: 15px;line-height: 1;cursor: pointer;padding: 0;z-index: 99985;transition: all 0.2s ease;user-select: none;-webkit-tap-highlight-color: transparent}.floating-ai-launcher-close-btn::before{content: '';position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);min-width: 48px;min-height: 48px;width: 48px;height: 48px;pointer-events: auto}.floating-ai-launcher-close-btn:hover{background: #ef4444;color: #ffffff;border-color: #ffffff;transform: scale(1.15)}.floating-ai-launcher:hover{transform: translateY(-3px) scale(1.03);box-shadow: 0 14px 34px rgba(79,70,229,0.55),0 4px 10px rgba(0,0,0,0.15)}.floating-ai-icon-box{position: relative;width: 32px;height: 32px;border-radius: 50%;background: rgba(255,255,255,0.2);display: flex;align-items: center;justify-content: center;flex-shrink: 0}.floating-ai-beacon{position: absolute;top: 1px;right: 1px;width: 9px;height: 9px;border-radius: 50%;background: #10b981;border: 2px solid #ffffff;box-shadow: 0 0 6px #10b981;animation: pulse-beacon 2s infinite}@keyframes pulse-beacon{0%{transform: scale(0.95);box-shadow: 0 0 0 0 rgba(16,185,129,0.7)}70%{transform: scale(1);box-shadow: 0 0 0 6px rgba(16,185,129,0)}100%{transform: scale(0.95);box-shadow: 0 0 0 0 rgba(16,185,129,0)}}.floating-ai-widget{position: fixed;bottom: 86px;right: 28px;z-index: 99990;width: 385px;max-width: calc(100vw - 32px);height: 560px;max-height: calc(100vh - 110px);background: var(--bg-surface);border: 1px solid var(--border-color);border-radius: 20px;box-shadow: 0 24px 60px rgba(0,0,0,0.25),0 8px 24px rgba(0,0,0,0.12);display: flex;flex-direction: column;overflow: hidden;opacity: 0;pointer-events: none;transform: translateY(20px) scale(0.95);transition: opacity 0.25s ease,transform 0.25s cubic-bezier(0.16,1,0.3,1)}.floating-ai-widget.open{opacity: 1;pointer-events: auto;transform: translateY(0) scale(1)}.floating-ai-header{background: linear-gradient(135deg,#4338ca 0%,#6366f1 100%);color: #ffffff;padding: 14px 18px;display: flex;align-items: center;justify-content: space-between;flex-shrink: 0}.floating-ai-header-info{display: flex;align-items: center;gap: 10px}.floating-ai-avatar{width: 36px;height: 36px;border-radius: 10px;background: rgba(255,255,255,0.2);display: flex;align-items: center;justify-content: center;flex-shrink: 0}.floating-ai-title{font-weight: 800;font-size: 1rem;letter-spacing: -0.01em}.floating-ai-status-pill{font-size: 0.65rem;font-weight: 700;background: #10b981;color: #ffffff;padding: 0.15rem 0.45rem;border-radius: 20px;text-transform: uppercase;letter-spacing: 0.04em}.floating-ai-sub{font-size: 0.76rem;opacity: 0.88}.floating-ai-close-btn{width: 32px;height: 32px;border-radius: 50%;background: rgba(255,255,255,0.18);border: none;color: #ffffff;display: flex;align-items: center;justify-content: center;cursor: pointer;transition: all 0.2s ease}.floating-ai-close-btn:hover{background: rgba(255,255,255,0.32);transform: scale(1.08)}.floating-ai-body{flex: 1;padding: 16px;overflow-y: auto;display: flex;flex-direction: column;gap: 12px;background: var(--bg-surface)}.floating-ai-msg{display: flex;align-items: flex-start;gap: 8px}.floating-ai-msg.user{justify-content: flex-end}.floating-ai-bot-avatar{width: 28px;height: 28px;border-radius: 8px;background: rgba(99,102,241,0.15);display: flex;align-items: center;justify-content: center;font-size: 1rem;flex-shrink: 0}.floating-ai-bubble{padding: 10px 14px;font-size: 0.88rem;line-height: 1.45}.floating-ai-bubble.bot{background: var(--bg-surface-raised);border: 1px solid var(--border-color);color: var(--text-primary);border-radius: 14px;border-top-left-radius: 4px;max-width: 88%}.floating-ai-bubble.user{background: linear-gradient(135deg,#6366f1 0%,#4f46e5 100%);color: #ffffff;border-radius: 14px;border-top-right-radius: 4px;max-width: 84%}.floating-ai-chips-wrap{display: flex;gap: 6px;overflow-x: auto;padding: 8px 14px;background: var(--bg-surface);border-top: 1px solid var(--border-color);flex-shrink: 0;scrollbar-width: none}.floating-ai-chips-wrap::-webkit-scrollbar{display: none}.floating-ai-chip{padding: 4px 10px;font-size: 0.76rem;font-weight: 600;border-radius: 20px;background: var(--bg-surface-raised);border: 1px solid var(--border-color);color: var(--text-primary);cursor: pointer;white-space: nowrap;transition: all 0.18s ease}.floating-ai-chip:hover{background: var(--brand-primary);color: #ffffff;border-color: var(--brand-primary)}.floating-ai-input-form{display: flex;gap: 8px;padding: 10px 14px;background: var(--bg-surface);border-top: 1px solid var(--border-color);flex-shrink: 0;align-items: center}.floating-ai-input{flex: 1;padding: 9px 14px;font-size: 0.88rem;border-radius: 10px;border: 1px solid var(--border-color);background: var(--bg-surface-raised);color: var(--text-primary);outline: none;transition: border-color 0.2s ease,box-shadow 0.2s ease}.floating-ai-input:focus{border-color: var(--brand-primary);box-shadow: 0 0 0 3px rgba(79,70,229,0.15)}.floating-ai-send-btn{width: 36px;height: 36px;border-radius: 10px;background: linear-gradient(135deg,#4f46e5,#6366f1);border: none;color: #ffffff;display: flex;align-items: center;justify-content: center;cursor: pointer;flex-shrink: 0;transition: transform 0.18s ease}.floating-ai-send-btn:hover{transform: scale(1.06)}@media (max-width: 768px){.floating-ai-launcher{bottom: calc(var(--mobile-nav-height,60px) + 12px);right: 14px;padding: 7px 12px;font-size: 0.82rem}.floating-ai-widget{bottom: calc(var(--mobile-nav-height,60px) + 8px);right: 12px;left: 12px;width: auto;max-width: none;height: calc(100vh - 130px)}}@media (max-width: 768px){.floating-ai-launcher-wrap{bottom: calc(var(--mobile-nav-height,60px) + 8px);right: 10px}.floating-ai-launcher{padding: 6px 12px 6px 8px;font-size: 0.78rem;gap: 6px}.floating-ai-launcher-close-btn{width: 24px;height: 24px;min-width: 24px;min-height: 24px;top: -6px;right: -6px;font-size: 14px}.sticky-earning-popup.active ~ .floating-ai-launcher-wrap,body:has(.sticky-earning-popup.active) .floating-ai-launcher-wrap{display: none !important}}@media (max-width: 480px){.floating-ai-launcher-wrap{bottom: calc(var(--mobile-nav-height,60px) + 8px);right: 10px}.floating-ai-launcher{padding: 6px 11px 6px 8px;font-size: 0.78rem;gap: 6px}.floating-ai-icon-box{width: 26px;height: 26px}.floating-ai-widget{bottom: calc(var(--mobile-nav-height,60px) + 6px);left: 8px;right: 8px;height: calc(100vh - 120px);max-height: 85vh;border-radius: 16px}.floating-ai-header{padding: 10px 12px}.floating-ai-title{font-size: 0.88rem}.ai-banner-card{padding: 1.5rem 1rem !important;border-radius: 18px !important}.ai-banner-title{font-size: 1.45rem !important}.ai-banner-desc{font-size: 0.9rem !important;line-height: 1.45 !important}.ai-banner-btn{width: 100% !important;justify-content: center !important;padding: 0.85rem 1.25rem !important;font-size: 0.95rem !important}.ai-banner-checklist{font-size: 0.85rem !important;gap: 0.4rem !important}}