:root,[data-theme=dark]{--bg-primary:#0a0a0a;--bg-secondary:#1a1a1a;--bg-tertiary:#252525;--bg-hover:#2a2a2a;--text-primary:#fff;--text-secondary:#b8b8b8;--text-tertiary:gray;--accent-orange:#ff6b35;--accent-orange-hover:#ff8559;--accent-purple:#9370db;--accent-purple-hover:#a685e2;--accent-cyan:#00d4ff;--accent-cyan-hover:#3df;--accent-green:#10b981;--border-color:#9370db33;--border-color-hover:#9370db66;--shadow-md:0 4px 8px #0000004d;--transition-base:all .3s cubic-bezier(.4,0,.2,1);--transition-fast:all .15s ease-out}[data-theme=light]{--bg-primary:#fff;--bg-secondary:#f8f9fa;--bg-tertiary:#e9ecef;--bg-hover:#e0e3e7;--text-primary:#1a1a1a;--text-secondary:#4a5568;--text-tertiary:#718096;--accent-orange:#ff6b35;--accent-orange-hover:#ff5722;--accent-purple:#8854c0;--accent-purple-hover:#7c3aed;--accent-cyan:#09c;--accent-cyan-hover:#07a;--border-color:#6b728033;--border-color-hover:#6b728066;--shadow-md:0 4px 6px #00000012}html{scroll-behavior:smooth}*{box-sizing:border-box;margin:0;padding:0}body{background:var(--bg-primary);color:var(--text-primary);font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,sans-serif;transition:background-color .3s,color .3s}body.menu-open{width:100%;height:100vh;position:fixed;overflow:hidden}.landing-header{z-index:900;background:var(--bg-primary);border-bottom:1px solid var(--border-color);transition:var(--transition-base);-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);position:fixed;top:0;left:0;right:0}.landing-header.landing-header-scrolled{box-shadow:var(--shadow-md);border-bottom-color:var(--border-color-hover)}.header-inner-flex{justify-content:space-between;align-items:center;gap:2rem;max-width:1400px;margin:0 auto;padding:.75rem 2rem;display:flex}.header-logo-group{cursor:pointer;z-index:901;align-items:center;gap:.625rem;text-decoration:none;display:flex}.header-logo-icon{border-radius:8px;flex-shrink:0;width:35px;height:35px;overflow:hidden}.header-logo-text{color:var(--text-primary);font-size:1.125rem;font-weight:700}.header-nav-menu{align-items:center;gap:2rem;display:flex}.header-nav-item{color:var(--text-secondary);transition:var(--transition-base);padding:.5rem 0;font-size:.9375rem;font-weight:500;text-decoration:none;position:relative}.header-nav-item:after{content:"";background:var(--accent-orange);width:0;height:2px;transition:width .3s cubic-bezier(.4,0,.2,1);position:absolute;bottom:0;left:0}.header-nav-item:hover{color:var(--accent-orange);transform:translateY(-1px)}.header-nav-item:hover:after{width:100%}.header-nav-item.active{color:var(--accent-orange);font-weight:600}.header-controls{z-index:901;align-items:center;gap:.75rem;display:flex}.theme-switch-button{background:var(--bg-secondary);border:1px solid var(--border-color);width:40px;height:40px;color:var(--text-primary);cursor:pointer;transition:var(--transition-base);border-radius:10px;justify-content:center;align-items:center;display:flex}.theme-switch-button:hover{background:var(--bg-hover);border-color:var(--accent-orange);box-shadow:0 0 20px #ff6b354d}.header-dashboard-button{background:var(--accent-orange);color:#fff;cursor:pointer;transition:var(--transition-base);border:none;border-radius:8px;padding:.5rem 1.125rem;font-size:.875rem;font-weight:600}.header-dashboard-button:hover{background:var(--accent-orange-hover);transform:translateY(-2px);box-shadow:0 4px 12px #ff6b354d}.burger-menu-button{background:var(--bg-secondary);border:1px solid var(--border-color);width:40px;height:40px;color:var(--text-primary);cursor:pointer;z-index:10001;transition:var(--transition-base);border-radius:10px;justify-content:center;align-items:center;display:none;position:relative}.burger-menu-button:hover{background:var(--bg-hover);border-color:var(--accent-orange);box-shadow:0 0 15px #ff6b3533}.mobile-menu-overlay{z-index:9998;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#000000b3;position:fixed;inset:0}.mobile-menu-panel{background:var(--bg-secondary);z-index:9999;flex-direction:column;width:100%;max-width:100vw;height:100dvh;padding-top:0;display:flex;position:fixed;top:0;right:0;box-shadow:-10px 0 40px #00000080}.mobile-menu-close{background:var(--bg-tertiary);border:1px solid var(--border-color);width:40px;height:40px;color:var(--text-primary);cursor:pointer;transition:var(--transition-base);z-index:10001;border-radius:10px;justify-content:center;align-items:center;display:flex;position:absolute;top:1rem;right:1rem}.mobile-menu-close:hover{background:var(--bg-hover);border-color:var(--accent-orange);transform:rotate(90deg)}.mobile-menu-content{-webkit-overflow-scrolling:touch;flex-direction:column;flex:1;gap:1rem;padding:5rem 1.5rem 2rem;display:flex;overflow:hidden auto}.mobile-menu-nav{flex-direction:column;flex-shrink:0;gap:.5rem;display:flex}.mobile-menu-bottom{flex-direction:column;flex-shrink:0;gap:1rem;margin-top:auto;display:flex}.mobile-menu-item{color:var(--text-primary);transition:var(--transition-base);background:0 0;border-radius:12px;align-items:center;padding:1.25rem 1.5rem;font-size:1.125rem;font-weight:500;text-decoration:none;display:flex;position:relative}.mobile-menu-item:before{content:"";background:var(--accent-orange);border-radius:0 4px 4px 0;width:0;height:60%;transition:width .3s cubic-bezier(.4,0,.2,1);position:absolute;top:50%;left:0;transform:translateY(-50%)}.mobile-menu-item.active:before{width:4px}.mobile-menu-item:active{transform:scale(.98)}.mobile-menu-item:not(.active):hover{background:var(--bg-tertiary);color:var(--accent-orange);padding-left:2rem;transform:translate(4px)}.mobile-menu-item.active{background:var(--bg-tertiary);color:var(--accent-orange);font-weight:600}.mobile-menu-divider{background:var(--border-color);opacity:.5;height:1px;margin:1rem 0}.mobile-menu-bottom{flex-direction:column;gap:1rem;display:flex}.mobile-theme-toggle{background:var(--bg-tertiary);width:100%;color:var(--text-primary);border:1px solid var(--border-color);cursor:pointer;transition:var(--transition-base);border-radius:12px;justify-content:center;align-items:center;gap:.75rem;padding:1.25rem 1.5rem;font-size:1rem;font-weight:600;display:flex}.mobile-theme-toggle:hover{background:var(--bg-hover);border-color:var(--accent-purple);transform:translateY(-2px);box-shadow:0 4px 12px #9370db33}.mobile-dashboard-btn{background:var(--accent-orange);color:#fff;cursor:pointer;width:100%;transition:var(--transition-base);border:none;border-radius:12px;padding:1.25rem 1.5rem;font-size:1rem;font-weight:600;box-shadow:0 4px 12px #ff6b354d}.mobile-dashboard-btn:hover{background:var(--accent-orange-hover);transform:translateY(-2px);box-shadow:0 6px 20px #ff6b3566}.hero-main-area{z-index:1;padding-top:80px;position:relative}.landing-page-root section{z-index:1;position:relative}@media (min-width:769px){.mobile-menu-panel{width:400px;max-width:400px}}@media (max-width:768px){.header-nav-menu{display:none}.burger-menu-button{display:flex}.header-dashboard-button{display:none}.mobile-menu-panel{border-left:none;width:100%}}@media (max-width:480px){.header-inner-flex{padding:.625rem 1rem}.mobile-menu-content{padding:1.5rem 1rem}.header-logo-text{font-size:1rem}.header-logo-icon{width:30px;height:30px}}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}@keyframes fadeIn{0%{opacity:0}to{opacity:1}}:focus-visible{outline:2px solid var(--accent-orange);outline-offset:2px}.landing-page-root{min-height:100vh;padding-top:60px}.hero-main-area{justify-content:center;align-items:center;min-height:90vh;padding:4rem 2rem;display:flex;position:relative;overflow:hidden}.hero-animated-bg{pointer-events:none;position:absolute;inset:0;overflow:hidden}.hero-float-element{opacity:.1;position:absolute}.hero-float-line{background:linear-gradient(90deg,transparent,var(--accent-purple),transparent);opacity:.1;height:2px;position:absolute}.hero-content-box{z-index:1;text-align:center;max-width:900px;position:relative}.hero-badge{background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-secondary);border-radius:50px;align-items:center;gap:.5rem;margin-bottom:2rem;padding:.5rem 1.25rem;font-size:.875rem;font-weight:500;display:inline-flex}.hero-main-heading{color:var(--text-primary);margin-bottom:1.5rem;font-size:clamp(2.5rem,5vw,4rem);font-weight:800;line-height:1.1}.hero-brand-accent{background:linear-gradient(135deg,var(--accent-orange),var(--accent-purple));-webkit-text-fill-color:transparent;-webkit-background-clip:text;background-clip:text}.hero-description{color:var(--text-secondary);max-width:700px;margin-bottom:2.5rem;margin-left:auto;margin-right:auto;font-size:1.125rem;line-height:1.7}.hero-action-buttons{flex-wrap:wrap;justify-content:center;gap:1rem;margin-bottom:3rem;display:flex}.btn{cursor:pointer;transition:var(--transition-base);border:none;border-radius:10px;align-items:center;gap:.5rem;padding:.875rem 1.75rem;font-size:.9375rem;font-weight:600;text-decoration:none;display:inline-flex}.btn-primary{background:var(--accent-orange);color:#fff}.btn-primary:hover{background:var(--accent-orange-hover);box-shadow:var(--shadow-md);transform:translateY(-2px)}.btn-secondary{color:var(--text-primary);border:2px solid var(--border-color);background:0 0}.btn-secondary:hover{background:var(--bg-secondary);border-color:var(--accent-purple);color:var(--accent-purple)}.hero-stats-box{grid-template-columns:repeat(auto-fit,minmax(120px,1fr));gap:2rem;max-width:700px;margin:0 auto;display:grid}.stat-cell{text-align:center}.stat-number{color:var(--accent-orange);margin-bottom:.25rem;font-size:2rem;font-weight:800}.stat-label{color:var(--text-secondary);font-size:.875rem;font-weight:500}.content-cards-section{padding:5rem 2rem}.section-wrapper{max-width:1400px;margin:0 auto}.section-header-group{text-align:center;margin-bottom:3rem}.section-main-title{color:var(--text-primary);margin-bottom:.75rem;font-size:2.5rem;font-weight:800}.section-subtitle{color:var(--text-secondary);margin-bottom:1.5rem;font-size:1.125rem}.section-view-button{background:var(--bg-secondary);border:1px solid var(--border-color);color:var(--text-primary);transition:var(--transition-base);border-radius:8px;align-items:center;gap:.5rem;padding:.75rem 1.5rem;font-size:.875rem;font-weight:600;display:inline-flex}.section-view-button:hover{background:var(--accent-orange);border-color:var(--accent-orange);color:#fff;transform:translateY(-2px)}.no-content-message{text-align:center;color:var(--text-secondary);grid-column:1/-1;padding:3rem;font-size:1.125rem}.about-content-section{background:var(--bg-secondary);padding:5rem 2rem}.about-grid-container{grid-template-columns:1fr 1fr;align-items:center;gap:4rem;max-width:1400px;margin:0 auto;display:grid}.about-main-title{color:var(--text-primary);margin-bottom:1.5rem;font-size:2.5rem;font-weight:800}.about-brand-highlight{color:var(--accent-orange)}.about-paragraphs p{color:var(--text-secondary);margin-bottom:1rem;font-size:1.0625rem;line-height:1.7}.skills-badges-container{flex-wrap:wrap;gap:.75rem;margin-top:2rem;display:flex}.skill-tag{background:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-primary);transition:var(--transition-base);border-radius:8px;padding:.5rem 1rem;font-size:.875rem;font-weight:500}.skill-tag:hover{background:var(--accent-orange);border-color:var(--accent-orange);color:#fff;transform:translateY(-2px)}.stats-cards-grid{grid-template-columns:repeat(2,1fr);gap:1.5rem;display:grid}.about-stat-card{background:var(--bg-tertiary);border:1px solid var(--border-color);text-align:center;transition:var(--transition-base);border-radius:12px;padding:2rem}.about-stat-card:hover{box-shadow:var(--shadow-lg);border-color:var(--accent-orange);transform:translateY(-4px)}.about-stat-value{color:var(--accent-orange);margin-bottom:.5rem;font-size:2.5rem;font-weight:800}.about-stat-text{color:var(--text-secondary);font-size:1rem;font-weight:500}.cta-conversion-section{text-align:center;padding:5rem 2rem}.cta-inner-box{background:var(--bg-secondary);border:1px solid var(--border-color);border-radius:20px;max-width:800px;margin:0 auto;padding:4rem 2rem}.cta-main-heading{color:var(--text-primary);margin-bottom:1rem;font-size:2.5rem;font-weight:800}.cta-description{color:var(--text-secondary);margin-bottom:2rem;font-size:1.125rem}.btn-cta-primary{background:linear-gradient(135deg,var(--accent-orange)0%,var(--accent-purple)100%);color:#fff;padding:1rem 2.5rem;font-size:1.0625rem}.btn-cta-primary:hover{box-shadow:var(--shadow-xl);transform:translateY(-3px)}.footer-main-wrapper{background:var(--bg-secondary);border-top:1px solid var(--border-color);padding:4rem 2rem 2rem}.footer-inner-container{max-width:1400px;margin:0 auto}.footer-upper-grid{grid-template-columns:2fr 1fr 1fr 1fr;gap:3rem;margin-bottom:3rem;display:grid}.footer-brand-box{align-items:center;gap:.75rem;margin-bottom:1rem;display:flex}.footer-logo-glow{position:relative}.footer-logo-circle{border-radius:8px;width:40px;height:40px;overflow:hidden}.footer-brand-name{color:var(--text-primary);font-size:1.25rem;font-weight:700}.footer-brand-description{color:var(--text-secondary);margin-bottom:1.5rem;font-size:.9375rem;line-height:1.6}.footer-social-links-row{gap:.75rem;display:flex}.footer-social-icon-link{background:var(--bg-tertiary);border:1px solid var(--border-color);width:36px;height:36px;color:var(--text-secondary);transition:var(--transition-base);border-radius:8px;justify-content:center;align-items:center;display:flex}.footer-social-icon-link:hover{background:var(--accent-orange);border-color:var(--accent-orange);color:#fff;transform:translateY(-3px)}.footer-column-heading{color:var(--text-primary);margin-bottom:1rem;font-size:1rem;font-weight:700}.footer-link-list{flex-direction:column;gap:.75rem;list-style:none;display:flex}.footer-link-anchor{color:var(--text-secondary);transition:var(--transition-fast);font-size:.9375rem}.footer-link-anchor:hover{color:var(--accent-orange);padding-left:.25rem}.footer-newsletter-wrapper{background:var(--bg-tertiary);border:1px solid var(--border-color);border-radius:12px;margin-bottom:3rem;padding:2rem}.footer-newsletter-inner{text-align:center;max-width:600px;margin:0 auto}.footer-newsletter-icon{margin:0 auto 1rem}.footer-newsletter-title{color:var(--text-primary);margin-bottom:.5rem;font-size:1.5rem;font-weight:700}.footer-newsletter-text{color:var(--text-secondary);margin-bottom:1.5rem;font-size:.9375rem}.footer-newsletter-form{flex-wrap:wrap;justify-content:center;gap:.75rem;display:flex}.footer-newsletter-input{background:var(--bg-secondary);border:1px solid var(--border-color);min-width:250px;color:var(--text-primary);border-radius:8px;flex:1;padding:.75rem 1.25rem;font-size:.9375rem}.footer-newsletter-input:focus{border-color:var(--accent-orange);outline:none}.footer-newsletter-button{background:var(--accent-orange);color:#fff;cursor:pointer;transition:var(--transition-base);border:none;border-radius:8px;align-items:center;gap:.5rem;padding:.75rem 2rem;font-size:.9375rem;font-weight:600;display:flex}.footer-newsletter-button:hover:not(:disabled){background:var(--accent-orange-hover);transform:translateY(-2px)}.footer-newsletter-button:disabled{opacity:.7;cursor:not-allowed}.footer-bottom-section{border-top:1px solid var(--border-color);flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1rem;padding-top:2rem;display:flex}.footer-copyright{color:var(--text-tertiary);font-size:.875rem}.footer-credit-badge{color:var(--text-secondary);align-items:center;gap:.5rem;font-size:.875rem;display:flex}.footer-heart-icon{animation:1.5s ease-in-out infinite heartbeat}@keyframes heartbeat{0%,to{transform:scale(1)}50%{transform:scale(1.1)}}.footer-credit-name{color:var(--accent-orange);font-weight:600}.footer-legal-links{gap:1.5rem;display:flex}.footer-legal-link{color:var(--text-tertiary);transition:var(--transition-fast);font-size:.875rem}.footer-legal-link:hover{color:var(--accent-orange)}.animate-spin{animation:1s linear infinite spin}@media (max-width:1200px){.about-grid-container{grid-template-columns:1fr;gap:3rem}.footer-upper-grid{grid-template-columns:1fr 1fr}}@media (max-width:950px){.header-nav-menu{display:none}.burger-menu-button{display:flex}.header-inner-flex{padding:.75rem 1.5rem}}@media (max-width:768px){.hero-main-area{min-height:80vh;padding:3rem 1rem}.hero-stats-box{grid-template-columns:repeat(2,1fr);gap:1.5rem}.section-main-title{font-size:2rem}.content-cards-section{padding:3rem 1rem}.footer-upper-grid{grid-template-columns:1fr;gap:2rem}.footer-bottom-section{text-align:center;flex-direction:column}.stats-cards-grid{grid-template-columns:1fr}.header-inner-flex{padding:.75rem 1rem}.header-dashboard-button{display:none}}@media (max-width:480px){.hero-main-heading{font-size:2rem}.hero-description{font-size:1rem}.hero-stats-box{grid-template-columns:1fr}.hero-action-buttons{flex-direction:column;width:100%}.btn{justify-content:center;width:100%}.footer-newsletter-form{flex-direction:column}.footer-newsletter-input,.footer-newsletter-button{width:100%}}.header-nav-item.active{color:var(--accent-orange)}.header-nav-item.active:after{width:100%}.mobile-menu-item.active{background:var(--bg-tertiary);color:var(--accent-orange)}.videos-grid{grid-template-columns:repeat(3,1fr);gap:2rem;max-width:100%;display:grid}@media (max-width:1200px){.videos-grid{grid-template-columns:repeat(2,1fr)}}@media (max-width:768px){.videos-grid{grid-template-columns:1fr}}:root{--lightningcss-light:initial;--lightningcss-dark: ;color-scheme:light dark;--bg-primary:#0a0a0a;--bg-secondary:#1a1a1a;--bg-tertiary:#2d2d2d;--bg-hover:#3a3a3a;--border-color:#333;--border-light:#404040;--text-primary:#fff;--text-secondary:#b0b0b0;--text-tertiary:gray;--accent-orange:#ff6b35;--accent-orange-hover:#ff8c2e;--accent-purple:#9370db;--accent-purple-hover:#a88edb;--accent-cyan:#00d4ff;--accent-cyan-hover:#00e6ff;--accent-red:#f44;--accent-green:#4d4;--accent-yellow:gold;--overlay-dark:#00000080;--overlay-light:#ffffff0d;--shadow-sm:0 2px 8px #0000004d;--shadow-md:0 4px 16px #0006;--shadow-lg:0 8px 32px #00000080;--shadow-xl:0 16px 48px #0009;--space-xs:.5rem;--space-sm:.75rem;--space-md:1rem;--space-lg:1.5rem;--space-xl:2rem;--space-2xl:2.5rem;--transition-fast:.15s ease;--transition-base:.2s ease;--transition-slow:.3s ease}@media (prefers-color-scheme:dark){:root{--lightningcss-light: ;--lightningcss-dark:initial}}[data-theme=light]{--bg-primary:#f8f9fa;--bg-secondary:#fff;--bg-tertiary:#f0f1f3;--bg-hover:#e8e9eb;--border-color:#e0e0e0;--border-light:#d0d0d0;--text-primary:#1a1a1a;--text-secondary:#666;--text-tertiary:#999;--overlay-dark:#fffc;--overlay-light:#0000000d;--shadow-sm:0 2px 8px #00000014;--shadow-md:0 4px 16px #0000001f;--shadow-lg:0 8px 32px #00000026;--shadow-xl:0 16px 48px #0003}[data-theme=dark]{--bg-primary:#0a0a0a;--bg-secondary:#1a1a1a;--bg-tertiary:#2d2d2d;--bg-hover:#3a3a3a;--border-color:#333;--border-light:#404040;--text-primary:#fff;--text-secondary:#b0b0b0;--text-tertiary:gray;--overlay-dark:#00000080;--overlay-light:#ffffff0d;--shadow-sm:0 2px 8px #0000004d;--shadow-md:0 4px 16px #0006;--shadow-lg:0 8px 32px #00000080;--shadow-xl:0 16px 48px #0009}.stats-grid{gap:var(--space-lg);margin-bottom:var(--space-2xl);grid-template-columns:repeat(auto-fit,minmax(280px,1fr));display:grid}.stat-card{align-items:center;gap:var(--space-lg);padding:var(--space-lg);background-color:var(--bg-secondary);border:1px solid var(--border-color);transition:all var(--transition-slow);cursor:default;border-radius:12px;display:flex;position:relative;overflow:hidden}.stat-card:before{content:"";background:linear-gradient(135deg,transparent,var(--overlay-light));opacity:0;transition:opacity var(--transition-slow);position:absolute;inset:0}.stat-card:hover{border-color:var(--accent-orange);box-shadow:var(--shadow-md)}.stat-card:hover:before{opacity:1}.stat-icon{z-index:1;width:60px;height:60px;transition:transform var(--transition-base);border-radius:12px;flex-shrink:0;justify-content:center;align-items:center;display:flex;position:relative}.stat-card:hover .stat-icon{transform:scale(1.1)}.stat-orange .stat-icon{color:var(--accent-orange);background:linear-gradient(135deg,#ff6b3533,#ff6b351a)}.stat-purple .stat-icon{color:var(--accent-purple);background:linear-gradient(135deg,#9370db33,#9370db1a)}.stat-cyan .stat-icon{color:var(--accent-cyan);background:linear-gradient(135deg,#00d4ff33,#00d4ff1a)}.stat-icon svg{pointer-events:none;width:28px;height:28px}.stat-info{z-index:1;flex:1;position:relative}.stat-value{color:var(--text-primary);margin-bottom:var(--space-xs);transition:color var(--transition-base);font-size:1.75rem;font-weight:700;line-height:1}.stat-label{color:var(--text-secondary);transition:color var(--transition-base);font-size:.875rem;font-weight:500}.videos-grid,.sourcecodes-grid{gap:var(--space-lg);margin-bottom:var(--space-2xl);grid-template-columns:repeat(auto-fill,minmax(280px,1fr));display:grid}.video-card,.sourcecode-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);transition:all var(--transition-slow);border-radius:12px;flex-direction:column;display:flex;position:relative;overflow:hidden}.video-card:hover,.sourcecode-card:hover{border-color:var(--accent-orange);box-shadow:var(--shadow-lg)}.video-thumbnail{background-color:var(--bg-tertiary);width:100%;padding-bottom:56.25%;position:relative;overflow:hidden}.video-thumbnail img{object-fit:cover;width:100%;height:100%;transition:transform var(--transition-slow);position:absolute;top:0;left:0}.video-thumbnail-link:hover img{transform:scale(1.08)}.video-overlay{background:var(--overlay-dark);opacity:0;transition:opacity var(--transition-slow);-webkit-backdrop-filter:blur(2px);backdrop-filter:blur(2px);justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.play-button{background-color:var(--accent-orange);color:#fff;width:56px;height:56px;transition:all var(--transition-base);cursor:pointer;border-radius:50%;justify-content:center;align-items:center;font-size:1.5rem;display:flex;box-shadow:0 4px 16px #ff6b354d}.play-button:active{box-shadow:0 6px 24px #ff6b3566}.video-info,.sourcecode-info{padding:var(--space-lg);flex-direction:column;flex:1;display:flex}.video-title,.sourcecode-title{color:var(--text-primary);margin-bottom:var(--space-md);-webkit-line-clamp:2;transition:color var(--transition-base);-webkit-box-orient:vertical;flex:1;font-size:1rem;font-weight:600;line-height:1.4;display:-webkit-box;overflow:hidden}.video-title-link,.sourcecode-title-link{transition:color var(--transition-base);display:block}.video-title-link:hover .video-title,.sourcecode-title-link:hover .sourcecode-title{color:var(--accent-orange)}.sourcecode-description{color:var(--text-secondary);margin-bottom:var(--space-md);-webkit-line-clamp:2;-webkit-box-orient:vertical;font-size:.875rem;line-height:1.5;display:-webkit-box;overflow:hidden}.video-meta{gap:var(--space-lg);color:var(--text-secondary);margin-bottom:var(--space-md);flex-wrap:wrap;font-size:.8125rem;display:flex}.sourcecode-tech{gap:var(--space-sm);margin-bottom:var(--space-md);flex-wrap:wrap;display:flex}.tech-tag{background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-secondary);transition:all var(--transition-base);cursor:default;border-radius:6px;padding:4px 10px;font-size:.75rem;font-weight:500}.tech-tag:hover{border-color:var(--accent-orange);color:var(--accent-orange);background-color:var(--overlay-light)}.video-card-actions{gap:var(--space-sm);flex-wrap:wrap;display:flex}.action-btn{justify-content:center;align-items:center;gap:var(--space-xs);background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-primary);transition:all var(--transition-base);white-space:nowrap;cursor:pointer;border-radius:6px;flex:1;min-width:fit-content;padding:8px 12px;font-size:.8125rem;font-weight:500;text-decoration:none;display:inline-flex}.action-btn svg{pointer-events:none;flex-shrink:0;width:14px;height:14px}.view-details-btn{background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-primary)}.view-details-btn:hover{background-color:var(--accent-orange);border-color:var(--accent-orange);color:#fff;transform:translateY(-2px)}.view-details-btn:active{background-color:var(--accent-orange);border-color:var(--accent-orange);color:#fff;transform:translateY(0)}.source-code-btn{background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-primary);text-decoration:none}.source-code-btn:hover{background-color:var(--bg-hover);border-color:var(--accent-purple);color:var(--accent-purple);transform:translateY(-2px)}.source-code-btn:active{background-color:var(--bg-tertiary);border:2px solid var(--accent-purple);color:#fff;background-color:var(--accent-orange);border-color:var(--accent-orange);transform:translateY(0)}.sourcecode-meta{gap:var(--space-lg);color:var(--text-secondary);margin-bottom:var(--space-md);padding-top:var(--space-md);border-top:1px solid var(--border-color);flex-wrap:wrap;font-size:.8125rem;display:flex}.sourcecode-actions{gap:var(--space-sm);flex-wrap:wrap;display:flex}.view-btn,.download-btn,.github-btn{flex:1;min-width:80px}.download-btn{background-color:var(--bg-tertiary);border:1px solid var(--accent-cyan);color:var(--accent-cyan)}.download-btn:hover{border-color:var(--accent-cyan);background-color:#00d4ff1a;transform:translateY(-2px)}.github-btn{border:1px solid var(--border-color);color:var(--text-secondary);background-color:#0000}@media (max-width:1024px){.stats-grid,.videos-grid,.sourcecodes-grid{grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}}@media (max-width:768px){.stats-grid{gap:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.stat-card{padding:var(--space-md);gap:var(--space-md)}.stat-icon{width:50px;height:50px}.stat-icon svg{width:24px;height:24px}.stat-value{font-size:1.5rem}.stat-label{font-size:.75rem}.videos-grid,.sourcecodes-grid{gap:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(200px,1fr))}.video-card{border-radius:8px}.video-info,.sourcecode-info{padding:var(--space-md)}.video-title,.sourcecode-title{font-size:.9375rem}.video-meta{gap:var(--space-md);font-size:.75rem}.source-code-btn,.action-btn{padding:6px 10px;font-size:.75rem}.play-button{width:48px;height:48px;font-size:1.25rem}.video-card-actions{flex-direction:column}.action-btn{flex:1}}@media (max-width:480px){.stats-grid{gap:var(--space-md);grid-template-columns:1fr}.stat-card{padding:var(--space-md);gap:var(--space-md)}.stat-icon{width:48px;height:48px}.stat-icon svg{width:20px;height:20px}.stat-value{font-size:1.375rem}.videos-grid,.sourcecodes-grid{grid-template-columns:1fr}.video-meta{gap:var(--space-sm);flex-direction:column}}.sourcecodes-grid{gap:var(--space-lg);margin-bottom:var(--space-2xl);grid-template-columns:repeat(auto-fill,minmax(320px,1fr));display:grid}.sourcecode-card{background-color:var(--bg-secondary);border:1px solid var(--border-color);transition:all var(--transition-slow);padding:var(--space-lg);border-radius:12px;flex-direction:column;display:flex;position:relative;overflow:hidden}.sourcecode-card:hover{border-color:var(--accent-orange);box-shadow:var(--shadow-lg)}.sourcecode-card:before{content:"";background:linear-gradient(135deg,transparent,var(--overlay-light));opacity:0;transition:opacity var(--transition-slow);pointer-events:none;position:absolute;inset:0}.sourcecode-card:hover:before{opacity:1}.sourcecode-header{z-index:1;margin-bottom:var(--space-lg);position:relative}.sourcecode-title-link{transition:color var(--transition-base);display:block}.sourcecode-title{color:var(--text-primary);margin-bottom:var(--space-sm);-webkit-line-clamp:2;transition:color var(--transition-base);-webkit-box-orient:vertical;font-size:1.125rem;font-weight:700;line-height:1.4;display:-webkit-box;overflow:hidden}.sourcecode-title-link:hover .sourcecode-title{color:var(--accent-orange)}.sourcecode-description{color:var(--text-secondary);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:.875rem;line-height:1.5;display:-webkit-box;overflow:hidden}.sourcecode-tech{gap:var(--space-sm);margin-bottom:var(--space-lg);z-index:1;flex-wrap:wrap;display:flex;position:relative}.tech-tag{background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-secondary);transition:all var(--transition-base);cursor:default;white-space:nowrap;border-radius:6px;padding:6px 12px;font-size:.75rem;font-weight:500;display:inline-block}.tech-tag:hover{border-color:var(--accent-orange);color:var(--accent-orange);background-color:var(--overlay-light);transform:translateY(-2px)}.sourcecode-meta{gap:var(--space-lg);color:var(--text-secondary);margin-bottom:var(--space-lg);padding-bottom:var(--space-lg);border-bottom:1px solid var(--border-color);z-index:1;flex-wrap:wrap;min-height:20px;font-size:.8125rem;display:flex;position:relative}.meta-item{align-items:center;gap:var(--space-xs);transition:color var(--transition-base);display:flex}.meta-item svg{pointer-events:none;flex-shrink:0;width:14px;height:14px}.sourcecode-actions{gap:var(--space-sm);z-index:1;flex-wrap:wrap;align-items:center;margin-top:auto;display:flex;position:relative}.action-btn{justify-content:center;align-items:center;gap:var(--space-xs);background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-primary);transition:all var(--transition-base);white-space:nowrap;cursor:pointer;border-radius:6px;flex:1;padding:10px 16px;font-size:.8125rem;font-weight:500;text-decoration:none;display:inline-flex}.action-btn:hover{background-color:var(--bg-hover);border-color:var(--accent-orange);color:var(--accent-orange);transform:translateY(-2px)}.action-btn svg{pointer-events:none;width:16px;height:16px}.view-btn{background-color:var(--bg-tertiary);border:1px solid var(--border-color);color:var(--text-primary)}.view-btn:hover{background-color:var(--accent-orange);border-color:var(--accent-orange);color:#fff}.github-btn{border:1px solid var(--border-color);color:var(--text-secondary);background-color:#0000;flex:none;min-width:auto;padding:10px 14px}.result-count{color:var(--text-secondary);font-size:.875rem;font-weight:500}@media (max-width:1024px){.sourcecodes-grid{grid-template-columns:repeat(auto-fill,minmax(280px,1fr))}}@media (max-width:768px){.sourcecodes-grid{gap:var(--space-md);grid-template-columns:repeat(auto-fill,minmax(240px,1fr))}.sourcecode-card{padding:var(--space-md)}.sourcecode-title{font-size:1rem}.sourcecode-description{font-size:.8125rem}.sourcecode-tech{margin-bottom:var(--space-md)}.tech-tag{padding:4px 10px;font-size:.7rem}.sourcecode-meta{margin-bottom:var(--space-md);padding-bottom:var(--space-md);gap:var(--space-md);min-height:auto}.meta-item{font-size:.75rem}.sourcecode-actions{gap:var(--space-xs)}.action-btn{padding:8px 12px;font-size:.75rem}.view-btn{flex:1}.github-btn{flex:none;padding:8px 10px}.action-btn svg{width:14px;height:14px}}@media (max-width:480px){.sourcecodes-grid{grid-template-columns:1fr}.sourcecode-card{padding:var(--space-md)}.sourcecode-title{font-size:.95rem}.sourcecode-description{font-size:.75rem}.tech-tag{padding:3px 8px;font-size:.65rem}.sourcecode-meta{gap:var(--space-sm);margin-bottom:var(--space-md);flex-direction:column}.sourcecode-actions{gap:var(--space-xs);width:100%}.action-btn{flex:1;padding:8px 10px;font-size:.7rem}.action-btn span{display:none}.action-btn svg{width:16px;height:16px}.github-btn{padding:8px;display:flex}.view-btn{flex:1}}.github-btn{border:1px solid var(--border-color);color:var(--text-secondary);background-color:#0000;flex:none;justify-content:center;align-items:center;min-width:auto;padding:10px 12px;display:inline-flex}.github-btn:hover{background-color:var(--bg-tertiary);border-color:var(--accent-purple);color:var(--accent-purple)}.github-btn svg{pointer-events:none;width:16px;height:16px;display:block}@media (max-width:768px){.github-btn{padding:8px 10px}.github-btn svg{width:14px;height:14px}}@media (max-width:480px){.github-btn{justify-content:center;align-items:center;padding:8px;display:inline-flex}.github-btn svg{width:16px;height:16px}}.project-card{background:var(--bg-secondary);border:1px solid var(--border-color);will-change:transform,box-shadow;border-radius:12px;flex-direction:column;gap:0;height:100%;padding:0;transition:all .3s cubic-bezier(.4,0,.2,1);display:flex;position:relative;overflow:hidden}.project-card:hover{border-color:var(--accent-cyan)}.project-card .project-preview{border-bottom:1px solid var(--border-color);background:linear-gradient(135deg,#00d4ff0d 0%,#9370db0d 100%);justify-content:center;align-items:center;width:100%;height:180px;display:flex;position:relative;overflow:hidden}.project-card .project-preview.clickable{cursor:pointer;transition:all .3s cubic-bezier(.4,0,.2,1)}.project-card .project-preview.clickable:hover,.project-card .project-preview.clickable:focus{outline:none}.project-card .preview-grid{opacity:.3;pointer-events:none;grid-template-columns:repeat(3,1fr);gap:12px;padding:12px;display:grid;position:absolute;inset:0}.project-card .grid-item{background:linear-gradient(135deg,var(--accent-cyan)0%,var(--accent-purple)100%);aspect-ratio:1;border-radius:6px;animation:3s cubic-bezier(.4,0,.6,1) infinite project-pulse}.project-card .grid-item:first-child{animation-delay:0s}.project-card .grid-item:nth-child(2){animation-delay:.2s}.project-card .grid-item:nth-child(3){animation-delay:.4s}.project-card .grid-item:nth-child(4){animation-delay:.6s}.project-card .grid-item:nth-child(5){animation-delay:.8s}.project-card .grid-item:nth-child(6){animation-delay:1s}.project-card .grid-item:nth-child(7){animation-delay:1.2s}.project-card .grid-item:nth-child(8){animation-delay:1.4s}.project-card .grid-item:nth-child(9){animation-delay:1.6s}@keyframes project-pulse{0%,to{opacity:.2}50%{opacity:.4}}.project-card .preview-lines{z-index:2;pointer-events:none;flex-direction:column;gap:10px;width:80%;display:flex;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)}.project-card .line{background:linear-gradient(90deg,transparent,var(--accent-cyan),transparent);origin:center;transform-origin:0;border-radius:2px;height:3px}.project-card .line-1{width:100%}.project-card .line-2{width:85%}.project-card .line-3{width:70%}.project-card .preview-overlay{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);z-index:3;cursor:pointer;background:#000000b3;flex-direction:column;justify-content:center;align-items:center;gap:12px;transition:all .2s;display:flex;position:absolute;inset:0}.project-card .preview-overlay:hover{-webkit-backdrop-filter:blur(6px);backdrop-filter:blur(6px);background:#000c}.project-card .preview-icon{background:var(--accent-cyan);width:56px;height:56px;color:var(--bg-primary);will-change:transform;border-radius:12px;justify-content:center;align-items:center;transition:all .2s;display:flex}.project-card .preview-overlay:hover .preview-icon{transform:scale(1.15);box-shadow:0 0 20px #00d4ff80}.project-card .preview-overlay p{color:#fff;text-transform:uppercase;letter-spacing:1px;margin:0;font-size:.85rem;font-weight:600;transition:all .2s}.project-card .preview-overlay:hover p{letter-spacing:1.5px}.project-card .project-content{will-change:transform;flex-direction:column;flex:1;gap:1rem;padding:1.5rem;display:flex}.project-card .project-header{justify-content:space-between;align-items:flex-start;gap:1rem;display:flex}.project-card .project-title-section{flex:1;align-items:center;gap:.75rem;display:flex}.project-card .project-title{color:var(--text-primary);word-break:break-word;margin:0;font-size:1.125rem;font-weight:700}.project-card .project-badge{color:var(--accent-yellow);will-change:transform;background:linear-gradient(135deg,#ffd70033 0%,#ffd7001a 100%);border:1px solid #ffd7004d;border-radius:6px;flex-shrink:0;justify-content:center;align-items:center;padding:.4rem;display:inline-flex}.project-card .project-year{color:var(--text-tertiary);white-space:nowrap;will-change:color;background:#00d4ff0d;border:1px solid #00d4ff26;border-radius:6px;align-items:center;gap:.35rem;padding:.4rem .8rem;font-size:.8rem;font-weight:600;transition:all .2s;display:inline-flex}.project-card .project-description{color:var(--text-secondary);-webkit-line-clamp:2;-webkit-box-orient:vertical;margin:0;font-size:.875rem;line-height:1.5;display:-webkit-box;overflow:hidden}.project-card .project-techs{flex-wrap:wrap;gap:.5rem;display:flex}.project-card .tech-badge{color:var(--text-secondary);text-transform:capitalize;will-change:color,transform;background:linear-gradient(135deg,#00d4ff14 0%,#9370db0d 100%);border:1px solid #00d4ff26;border-radius:6px;margin:0;padding:.35rem .8rem;font-size:.7rem;font-weight:500;transition:all .3s;display:inline-block}.project-card .tech-badge:hover{color:var(--accent-cyan);border-color:#00d4ff4d}.project-card .tech-more{color:var(--text-tertiary);background:linear-gradient(135deg,#9370db1a 0%,#ff6b350d 100%);border-color:#9370db33}.project-card .tech-more:hover{color:var(--accent-purple);border-color:#9370db66}.project-card .project-actions{border-top:1px solid #00d4ff1a;flex-wrap:wrap;gap:.6rem;margin-top:auto;padding-top:1rem;display:flex}.project-card .project-actions-1 .project-btn,.project-card .project-actions-2 .project-btn,.project-card .project-actions-3 .project-btn{flex:1}.project-card .project-btn{cursor:pointer;text-transform:uppercase;letter-spacing:.7px;will-change:transform,box-shadow;background-clip:padding-box;border:1px solid;border-radius:6px;flex:1;justify-content:center;align-items:center;gap:.5rem;min-width:90px;margin:0;padding:.65rem 1.1rem;font-size:.75rem;font-weight:700;text-decoration:none;transition:all .2s cubic-bezier(.4,0,.2,1);display:inline-flex;position:relative;overflow:hidden}.project-card .project-btn span{transition:color .2s}.project-card .project-btn:before{content:"";opacity:0;pointer-events:none;background:linear-gradient(135deg,#fff3 0%,#0000 100%);transition:opacity .3s;position:absolute;inset:0}.project-card .project-btn:hover:before{opacity:1}.project-card .project-btn-primary{background:var(--accent-cyan);border-color:var(--accent-cyan);color:var(--bg-primary)}[data-theme=light] .project-card .project-btn-primary,.theme-light .project-card .project-btn-primary{color:#fff}.project-card .project-btn-primary:hover{transform:translateY(-2px);box-shadow:0 8px 20px #00d4ff4d}.project-card .project-btn-secondary{background:var(--accent-purple);border-color:var(--accent-purple);color:#fff}.project-card .project-btn-secondary:hover{transform:translateY(-2px);box-shadow:0 8px 20px #9370db4d}.project-card .project-btn-code{background:var(--accent-orange);border-color:var(--accent-orange);color:#fff}.project-card .project-btn-code:hover{transform:translateY(-2px);box-shadow:0 8px 20px #ff6b354d}@media (max-width:768px){.project-card .project-content{gap:.75rem;padding:1.25rem}.project-card .project-preview{height:150px}.project-card .project-title{font-size:1rem}.project-card .project-btn{min-width:80px;padding:.55rem .9rem;font-size:.7rem}.project-card .preview-lines{width:70%}.project-card .preview-grid{gap:8px}}@media (max-width:480px){.project-card .project-content{padding:1rem}.project-card .project-preview{height:130px}.project-card .project-actions{gap:.4rem}.project-card .project-btn{padding:.5rem .8rem;font-size:.65rem}}