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