body{padding-top:64px}main{min-height:calc(100vh - 64px)}.genre-tooltip{visibility:hidden;width:200px;background-color:#555;color:#fff;text-align:center;border-radius:6px;padding:5px;position:absolute;z-index:1;bottom:125%;left:50%;margin-left:-100px;opacity:0;transition:opacity .3s}.genre-option:hover .genre-tooltip{visibility:visible;opacity:1}.card-hover:hover{transform:translateY(-5px);box-shadow:0 10px 25px #0000001a}.fade-in{animation:fadeIn .5s ease-in}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}.summary-section{transition:all .3s ease}.summary-section:hover{background-color:#f8fafc}#video-url::-moz-placeholder{color:#9ca3af;font-style:italic}#video-url::placeholder{color:#9ca3af;font-style:italic}#submit-btn{height:auto;display:flex;align-items:center;white-space:nowrap;border-left:1px solid #d1d5db}#submit-btn:focus{border-color:#f59e0b;box-shadow:0 0 0 3px #f59e0b1a}.feature-icon{width:70px;height:70px;display:flex;align-items:center;justify-content:center;border-radius:12px;margin-bottom:0}.feature-icon i{font-size:2rem}.how-it-works-icon{width:70px;height:70px;display:flex;align-items:center;justify-content:center;border-radius:12px;font-size:2rem;font-weight:700}.how-it-works-card{transition:all .3s cubic-bezier(.4,0,.2,1);background-color:#fafafa}.how-it-works-card:hover{transform:translateY(-2px);background-color:#fff;box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.accordion-content{max-height:0;overflow:hidden;transition:max-height .4s ease-out,opacity .3s ease-out;opacity:0}.accordion.active .accordion-content{max-height:200px;opacity:1}.faq-arrow{flex-shrink:0;display:flex;align-items:center;justify-content:center;width:32px;height:32px;border-radius:6px;background-color:#f3f4f6;transition:all .3s ease}.accordion button:hover .faq-arrow{background-color:#e5e7eb;transform:scale(1.05)}.accordion.active .faq-arrow{background-color:#fef3c7}.faq-arrow i{transition:transform .3s ease}.rotate-180{transform:rotate(180deg)}.accordion{transition:all .3s ease}.accordion:hover{transform:translateY(-1px);box-shadow:0 4px 6px -1px #0000001a,0 2px 4px -1px #0000000f}.accordion button{transition:all .2s ease}.accordion button:hover{background-color:#fafafa}.feature-card{transition:all .3s cubic-bezier(.4,0,.2,1)}.feature-card:hover{transform:translateY(-2px)}.loading{opacity:.6;pointer-events:none}.spinner{display:inline-block;width:20px;height:20px;border:3px solid #f3f3f3;border-top:3px solid #3498db;border-radius:50%;animation:spin 1s linear infinite}*{transition:all .2s ease}@media (max-width: 640px){.summary-page .flex.items-center.gap-2 span.hidden.sm\:inline{display:inline!important}.summary-page .flex.items-center.gap-2{flex-direction:row;align-items:center;justify-content:center}.summary-page .flex.flex-wrap.gap-3{gap:.5rem}.summary-page .flex.flex-wrap.gap-3 button{min-width:auto;padding:.5rem .75rem;font-size:.875rem}}html{scroll-behavior:smooth}:target{scroll-margin-top:80px}.summary-page{min-height:100vh;transition:opacity .3s ease-in-out}.summary-page main{opacity:1;transition:opacity .2s ease-in-out}.summary-page.loading main{opacity:.7}.copy-btn{transition:all .2s ease}.copy-btn:hover{transform:translateY(-1px);box-shadow:0 2px 4px #0000001a}.clipboard-toast{font-weight:500;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 10px 25px #00000026}.progress-bar-animated{transition:width .5s ease-out;animation:progress-pulse 2s ease-in-out infinite}@keyframes progress-pulse{0%,to{opacity:1}50%{opacity:.8}}.progress-bar-gradient{background:linear-gradient(90deg,#f59e0b,#fbbf24,#f59e0b);background-size:200% 100%;animation:progress-shimmer 2s linear infinite}@keyframes progress-shimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.loading-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);transition:all .3s ease-in-out}.loading-overlay.show{opacity:1;visibility:visible}.loading-overlay.hide{opacity:0;visibility:hidden}.loading-message{transition:opacity .3s ease-in-out}.loading-message.fade-out{opacity:0}.loading-message.fade-in{opacity:1}.spinner{display:inline-block;width:20px;height:20px;border:3px solid #f3f3f3;border-top:3px solid #f59e0b;border-radius:50%;animation:spin 1s linear infinite}.summary-page .skeleton-loader{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:skeleton-loading 1.5s infinite;border-radius:4px}@keyframes skeleton-loading{0%{background-position:200% 0}to{background-position:-200% 0}}.summary-page{transition:opacity .3s ease-in-out}.summary-page .recent-summaries-card{transition:all .3s cubic-bezier(.4,0,.2,1);background-color:#fff;overflow:hidden}.summary-page .recent-summaries-card:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 10px 25px #00000026}.summary-page button:disabled{cursor:not-allowed}.summary-page button .fa-spinner{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@media (max-width: 768px){.summary-page main{padding:1rem}.summary-page .bg-white{border-radius:.5rem;margin-bottom:1rem}.summary-page #video-details-section .flex.flex-col.md\:flex-row{flex-direction:column;gap:1rem}.summary-page #video-details-section .w-full.md\:w-2\/5,.summary-page #video-details-section .w-full.md\:w-3\/5{width:100%}.summary-page h1{font-size:1.5rem;line-height:1.4}.summary-page h2{font-size:1.25rem;line-height:1.4}.summary-page .flex.flex-wrap.gap-3{display:grid;grid-template-columns:repeat(2,1fr);gap:.5rem}.summary-page .flex.flex-wrap.gap-3 button{width:100%;justify-content:center}}@media (min-width: 1024px){.summary-page .flex.flex-wrap.gap-3{gap:1rem}.summary-page .flex.flex-wrap.gap-3 button{min-width:120px}}@media (max-width: 1024px){.flex.flex-col.lg\:flex-row{flex-direction:column}#submit-btn{border-left:none;border-top:1px solid #d1d5db;border-radius:0 0 .375rem .375rem;justify-content:center;padding:.75rem 1.5rem}#video-url{border-radius:.375rem .375rem 0 0}.nav-links{display:none}.hero-title{font-size:2.5rem}.feature-grid{grid-template-columns:1fr}.feature-card{min-height:120px!important}.feature-icon{width:60px;height:60px}.feature-icon i{font-size:1.75rem}.how-it-works-card{min-height:120px!important}.how-it-works-icon{width:60px;height:60px;font-size:1.75rem}.faq-arrow{width:28px;height:28px}.faq-arrow i{font-size:1rem}.accordion h3{font-size:1.125rem}}@media (min-width: 768px) and (max-width: 1023px){.feature-card{min-height:140px}.feature-icon{width:70px;height:70px}.feature-icon i{font-size:2rem}.how-it-works-card{min-height:140px}.how-it-works-icon{width:70px;height:70px;font-size:2rem}}@media (min-width: 1024px){.feature-card{min-height:150px}.feature-icon{width:75px;height:75px}.feature-icon i{font-size:2.25rem}.how-it-works-card{min-height:150px}.how-it-works-icon{width:75px;height:75px;font-size:2.25rem}}@media (min-width: 1280px){.feature-card{min-height:160px}.feature-icon{width:80px;height:80px}.feature-icon i{font-size:2.5rem}.how-it-works-card{min-height:160px}.how-it-works-icon{width:80px;height:80px;font-size:2.5rem}}.feature-content{flex:1;min-width:0}.feature-icon-container{flex-shrink:0}.feature-card .flex,.how-it-works-card .flex{align-items:center;height:100%}.recent-summaries-card{transition:all .3s cubic-bezier(.4,0,.2,1);background-color:#fff;overflow:hidden;border:1px solid transparent}.recent-summaries-card:hover{transform:translateY(-2px) scale(1.02);box-shadow:0 20px 40px #00000026,0 0 0 1px #3b82f633;border-color:#3b82f64d}.recent-summaries-card .group-hover\:opacity-100{transition:opacity .3s ease}.recent-summaries-card:hover .group-hover\:opacity-100{opacity:1!important}.genre-badge-fixed{min-width:80px;width:80px;text-align:center;justify-content:center;font-weight:600;letter-spacing:.025em;text-transform:capitalize;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.date-badge-fixed{min-width:80px;width:80px;text-align:center;justify-content:center;font-weight:500;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px)}.recent-summaries-card:hover .genre-badge-fixed{box-shadow:0 4px 12px #00000026;transform:scale(1.05) translateY(-1px)}.recent-summaries-card h3{word-wrap:break-word;overflow-wrap:break-word;-webkit-hyphens:auto;hyphens:auto;line-height:1.4}.recent-summaries-card .bg-white.bg-opacity-90{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);box-shadow:0 8px 32px #0000001f}.recent-summaries-card:hover .bg-white.bg-opacity-90{background-color:#fffffff2;box-shadow:0 12px 40px #0003}.recent-summaries-card{position:relative}.recent-summaries-card:before{content:"";position:absolute;top:0;left:0;right:0;bottom:0;border-radius:.5rem;padding:1px;background:linear-gradient(45deg,transparent,rgba(59,130,246,.3),transparent);-webkit-mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);mask:linear-gradient(#fff 0 0) content-box,linear-gradient(#fff 0 0);-webkit-mask-composite:xor;mask-composite:xor;opacity:0;transition:opacity .3s ease;pointer-events:none}.recent-summaries-card:hover:before{opacity:1}@media (max-width: 768px){.genre-badge-fixed,.date-badge-fixed{min-width:70px;width:70px;font-size:.625rem;padding:.25rem .5rem}.recent-summaries-card h3{font-size:.8125rem;line-height:1.3}.recent-summaries-card:hover{transform:translateY(-1px) scale(1.01)}}@media (max-width: 480px){.genre-badge-fixed,.date-badge-fixed{min-width:60px;width:60px;font-size:.5625rem;padding:.125rem .375rem}.recent-summaries-card .p-4{padding:.75rem}.recent-summaries-card h3{font-size:.75rem}}.bg-blue-100:hover{background-color:#dbeafe!important;color:#1e40af!important}.bg-green-100:hover{background-color:#dcfce7!important;color:#166534!important}.bg-red-100:hover{background-color:#fee2e2!important;color:#991b1b!important}.bg-purple-100:hover{background-color:#f3e8ff!important;color:#7c3aed!important}.bg-yellow-100:hover{background-color:#fef3c7!important;color:#d97706!important}.bg-orange-100:hover{background-color:#fed7aa!important;color:#ea580c!important}.bg-teal-100:hover{background-color:#ccfdf7!important;color:#0f766e!important}.bg-pink-100:hover{background-color:#fce7f3!important;color:#be185d!important}@keyframes cardShimmer{0%{background-position:200% 0}to{background-position:-200% 0}}.recent-summaries-card.loading{background:linear-gradient(90deg,#f0f0f0 25%,#e0e0e0,#f0f0f0 75%);background-size:200% 100%;animation:cardShimmer 1.5s infinite}.animate-pulse{animation:pulse 2s cubic-bezier(.4,0,.6,1) infinite}@keyframes pulse{0%,to{opacity:1}50%{opacity:.5}}.line-clamp-2{overflow:hidden;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;line-height:1.5;max-height:3em}.genre-badge{font-weight:500;font-size:.875rem;border-radius:9999px;padding:.375rem .75rem;text-transform:capitalize;display:inline-block}@media (max-width: 768px){#recent-summaries .grid{grid-template-columns:1fr;gap:1rem}}@media (min-width: 768px) and (max-width: 1024px){#recent-summaries .grid{grid-template-columns:repeat(2,1fr);gap:1.5rem}}@media (min-width: 1024px){#recent-summaries .grid{grid-template-columns:repeat(3,1fr);gap:1.5rem}}.play-overlay{transition:all .3s ease;-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px)}.play-overlay:hover{-webkit-backdrop-filter:blur(0px);backdrop-filter:blur(0px)}.thumbnail-image{transition:transform .3s ease}.recent-summaries-card:hover .thumbnail-image{transform:scale(1.05)}.badge-container{display:flex;flex-direction:column;gap:.375rem;align-items:flex-end}.genre-badge-fixed,.date-badge-fixed,.summary-length-badge-fixed{min-width:90px;width:90px;text-align:center;justify-content:center;font-weight:500;-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);font-size:.75rem;padding:.375rem .75rem}.genre-badge-fixed{font-weight:600;letter-spacing:.025em;text-transform:capitalize}.recent-summaries-card:hover .genre-badge-fixed,.recent-summaries-card:hover .summary-length-badge-fixed{box-shadow:0 4px 12px #00000026;transform:scale(1.05) translateY(-1px)}.recent-summaries-card:hover .date-badge-fixed{background-color:#e5e7eb!important;transform:scale(1.05) translateY(-1px);box-shadow:0 2px 8px #0000001a}.bg-emerald-100{background-color:#dcfce7;color:#065f46}.bg-emerald-100:hover{background-color:#bbf7d0!important;color:#047857!important}.bg-amber-100{background-color:#fef3c7;color:#92400e}.bg-amber-100:hover{background-color:#fde68a!important;color:#b45309!important}.bg-violet-100{background-color:#ede9fe;color:#5b21b6}.bg-violet-100:hover{background-color:#ddd6fe!important;color:#6d28d9!important}@media (max-width: 768px){.genre-badge-fixed,.date-badge-fixed,.summary-length-badge-fixed{min-width:75px;width:75px;font-size:.625rem;padding:.25rem .5rem}.badge-container{gap:.25rem}}@media (max-width: 480px){.genre-badge-fixed,.date-badge-fixed,.summary-length-badge-fixed{min-width:65px;width:65px;font-size:.5625rem;padding:.125rem .375rem}.badge-container{gap:.25rem}}.summary-page #video-details-section .flex.flex-col.sm\\:flex-row{align-items:flex-start}@media (min-width: 640px){.summary-page #video-details-section .flex.flex-col.sm\\:flex-row{align-items:center}}.summary-page #badge-container .inline-flex{font-weight:500;transition:all .2s ease}.summary-page #badge-container .inline-flex:hover{transform:translateY(-1px);box-shadow:0 4px 8px #00000026}@media (max-width: 639px){.summary-page #badge-container{align-self:flex-start;margin-top:.25rem}.summary-page #badge-container .inline-flex{font-size:.75rem;padding:.25rem .75rem}}.summary-page .flex.flex-col.sm\\:flex-row.sm\\:items-center.sm\\:justify-between{min-height:1.75rem}@media (max-width: 640px){.summary-page .flex.flex-wrap.gap-3{display:grid;grid-template-columns:repeat(2,1fr);gap:.75rem}.summary-page .flex.flex-wrap.gap-3 button{justify-content:center;padding:.625rem 1rem;font-size:.875rem}}@media (max-width: 480px){.summary-page .flex.flex-wrap.gap-3{grid-template-columns:1fr;gap:.5rem}.summary-page .flex.flex-wrap.gap-3 button{width:100%;padding:.75rem 1rem}}
