@import "https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:wght@300;400;500;600;700;800&family=JetBrains+Mono:wght@400;500;600&display=swap";:root{--bg-primary:#090a0f;--bg-secondary:#121520;--bg-card:#161b2cb3;--bg-card-hover:#1e253cd9;--accent-purple:#8b5cf6;--accent-blue:#3b82f6;--accent-pink:#ec4899;--accent-cyan:#06b6d4;--accent-emerald:#10b981;--accent-amber:#f59e0b;--gradient-brand:linear-gradient(135deg, #8b5cf6 0%, #3b82f6 50%, #ec4899 100%);--gradient-glow:radial-gradient(circle at 50% 0%, #8b5cf640 0%, #3b82f61a 50%, transparent 80%);--text-primary:#f3f4f6;--text-secondary:#9ca3af;--text-muted:#6b7280;--border-light:#ffffff14;--border-glow:#8b5cf666;--font-sans:"Plus Jakarta Sans", system-ui, -apple-system, BlinkMacSystemFont, sans-serif;--font-mono:"JetBrains Mono", monospace;--radius-sm:8px;--radius-md:14px;--radius-lg:20px;--radius-xl:28px}*{box-sizing:border-box;margin:0;padding:0}body{font-family:var(--font-sans);background-color:var(--bg-primary);color:var(--text-primary);background-image:var(--gradient-glow);background-attachment:fixed;min-height:100vh;line-height:1.6;overflow-x:hidden}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg-primary)}::-webkit-scrollbar-thumb{background:#ffffff26;border-radius:4px}::-webkit-scrollbar-thumb:hover{background:#8b5cf680}a{color:inherit;text-decoration:none}button{cursor:pointer;background:0 0;border:none;font-family:inherit}.app-container{max-width:1280px;margin:0 auto;padding:0 1.25rem 4rem}.site-header{z-index:100;-webkit-backdrop-filter:blur(16px);border-bottom:1px solid var(--border-light);background:#090a0fcc;margin-bottom:2rem;padding:1rem 0;position:sticky;top:0}.header-inner{justify-content:space-between;align-items:center;max-width:1280px;margin:0 auto;padding:0 1.25rem;display:flex}.brand-badge{align-items:center;gap:.75rem;display:flex}.subdomain-tag{color:#c4b5fd;letter-spacing:.5px;background:#8b5cf626;border:1px solid #8b5cf64d;border-radius:50px;align-items:center;gap:.5rem;padding:.35rem .85rem;font-size:.85rem;font-weight:700;display:flex}.pulse-dot{background-color:var(--accent-emerald);width:8px;height:8px;box-shadow:0 0 10px var(--accent-emerald);border-radius:50%;animation:2s infinite pulse}@keyframes pulse{0%{opacity:.8;transform:scale(.95)}50%{opacity:1;transform:scale(1.2)}to{opacity:.8;transform:scale(.95)}}.brand-logo-text{background:var(--gradient-brand);-webkit-text-fill-color:transparent;-webkit-background-clip:text;font-size:1.35rem;font-weight:800}.header-actions{align-items:center;gap:1rem;display:flex}.social-pill-btn{border:1px solid var(--border-light);color:var(--text-primary);background:#ffffff0d;border-radius:50px;align-items:center;gap:.5rem;padding:.5rem 1rem;font-size:.85rem;font-weight:600;transition:all .25s;display:flex}.social-pill-btn:hover{background:#ffffff1f;border-color:#fff3;transform:translateY(-2px)}.cta-glow-btn{background:var(--gradient-brand);color:#fff;border-radius:50px;align-items:center;gap:.5rem;padding:.55rem 1.25rem;font-size:.85rem;font-weight:700;transition:all .3s;display:flex;box-shadow:0 4px 20px #8b5cf666}.cta-glow-btn:hover{transform:translateY(-2px)scale(1.02);box-shadow:0 6px 25px #8b5cf699}.hero-layout{grid-template-columns:340px 1fr;align-items:start;gap:2.5rem;margin-bottom:3.5rem;display:grid}@media (width<=900px){.hero-layout{grid-template-columns:1fr}}.reel-frame-wrapper{border:1px solid var(--border-light);background:linear-gradient(145deg,#ffffff1f,#ffffff08);border-radius:36px;width:100%;max-width:340px;margin:0 auto;padding:10px;position:relative;box-shadow:0 20px 50px #000000b3,0 0 30px #8b5cf633}.reel-screen{aspect-ratio:9/16;background-color:#000;border-radius:28px;width:100%;position:relative;overflow:hidden}.reel-cover-img{object-fit:cover;width:100%;height:100%}.reel-overlay{color:#fff;background:linear-gradient(#00000080 0%,#0003 60%,#000000e6 100%);flex-direction:column;justify-content:space-between;padding:1.25rem;display:flex;position:absolute;inset:0}.reel-top-bar{justify-content:space-between;align-items:center;display:flex}.reel-badge{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#0009;border:1px solid #fff3;border-radius:50px;align-items:center;gap:.4rem;padding:.3rem .7rem;font-size:.75rem;font-weight:700;display:flex}.reel-bottom-info{flex-direction:column;gap:.75rem;display:flex}.creator-row{align-items:center;gap:.6rem;display:flex}.creator-avatar-sm{object-fit:cover;border:2px solid var(--accent-purple);border-radius:50%;width:38px;height:38px}.creator-name-tag{font-size:.9rem;font-weight:700}.creator-handle{color:#d1d5db;font-size:.75rem}.reel-caption{color:#f3f4f6;font-size:.82rem;font-weight:500;line-height:1.35}.reel-actions-column{flex-direction:column;align-items:center;gap:1.2rem;display:flex;position:absolute;bottom:4rem;right:.85rem}.reel-action-btn{color:#fff;flex-direction:column;align-items:center;gap:.2rem;font-size:.72rem;font-weight:600;transition:transform .2s;display:flex}.reel-action-btn:hover{transform:scale(1.15)}.reel-icon-circle{-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);background:#00000080;border:1px solid #fff3;border-radius:50%;justify-content:center;align-items:center;width:42px;height:42px;display:flex}.reel-play-trigger{justify-content:center;align-items:center;display:flex;position:absolute;inset:0}.play-center-btn{-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);color:#fff;background:#8b5cf6d9;border-radius:50%;justify-content:center;align-items:center;width:64px;height:64px;transition:transform .25s;display:flex;box-shadow:0 0 30px #8b5cf6cc}.play-center-btn:hover{transform:scale(1.1)}.hero-content{flex-direction:column;justify-content:center;gap:1.5rem;display:flex}.hero-tag-chip{color:#c4b5fd;background:#8b5cf626;border:1px solid #8b5cf64d;border-radius:50px;align-self:flex-start;padding:.4rem 1rem;font-size:.85rem;font-weight:700}.hero-title{letter-spacing:-.5px;font-size:2.8rem;font-weight:800;line-height:1.15}.hero-title-highlight{background:var(--gradient-brand);-webkit-text-fill-color:transparent;-webkit-background-clip:text}.hero-desc{color:var(--text-secondary);max-width:680px;font-size:1.1rem}.comment-automation-box{border:1px solid var(--border-glow);border-radius:var(--radius-lg);background:#161b2ccc;flex-direction:column;gap:1rem;padding:1.5rem;display:flex;box-shadow:0 10px 30px #8b5cf626}.comment-box-header{justify-content:space-between;align-items:center;display:flex}.comment-title-group{align-items:center;gap:.75rem;display:flex}.comment-input-row{gap:.75rem;display:flex}.comment-input{border:1px solid var(--border-light);color:#fff;background:#090a0fe6;border-radius:50px;outline:none;flex:1;padding:.8rem 1.25rem;font-family:inherit;font-size:.95rem;transition:border-color .25s}.comment-input:focus{border-color:var(--accent-purple);box-shadow:0 0 15px #8b5cf64d}.comment-submit-btn{background:var(--gradient-brand);color:#fff;border-radius:50px;align-items:center;gap:.5rem;padding:.8rem 1.5rem;font-size:.9rem;font-weight:700;transition:all .25s;display:flex;box-shadow:0 4px 15px #8b5cf666}.comment-submit-btn:hover{transform:translateY(-2px);box-shadow:0 6px 20px #8b5cf699}.quick-keyword-pills{flex-wrap:wrap;align-items:center;gap:.5rem;display:flex}.keyword-pill{border:1px solid var(--border-light);color:#d1d5db;background:#ffffff0d;border-radius:50px;padding:.3rem .75rem;font-size:.8rem;font-weight:600;transition:all .2s}.keyword-pill:hover{border-color:var(--accent-purple);color:#fff;background:#8b5cf633}.filter-search-container{flex-direction:column;gap:1.5rem;margin-bottom:2.5rem;display:flex}.search-bar-wrapper{width:100%;position:relative}.search-icon{color:var(--text-muted);position:absolute;top:50%;left:1.25rem;transform:translateY(-50%)}.search-input{border:1px solid var(--border-light);color:#fff;background:#121520cc;border-radius:50px;outline:none;width:100%;padding:1rem 1.25rem 1rem 3.2rem;font-size:1rem;transition:all .25s}.search-input:focus{border-color:var(--accent-purple);background:#161b2cf2;box-shadow:0 0 20px #8b5cf640}.category-tabs{gap:.75rem;padding-bottom:.5rem;display:flex;overflow-x:auto}.category-tab-btn{border:1px solid var(--border-light);color:var(--text-secondary);white-space:nowrap;background:#ffffff0a;border-radius:50px;padding:.6rem 1.25rem;font-size:.9rem;font-weight:600;transition:all .25s}.category-tab-btn:hover{color:#fff;background:#ffffff14}.category-tab-btn.active{background:var(--gradient-brand);color:#fff;border-color:#0000;box-shadow:0 4px 15px #8b5cf659}.cheatsheets-grid{grid-template-columns:repeat(auto-fill,minmax(350px,1fr));gap:1.75rem;margin-bottom:4rem;display:grid}@media (width<=480px){.cheatsheets-grid{grid-template-columns:1fr}}.cheatsheet-card{background:var(--bg-card);border:1px solid var(--border-light);border-radius:var(--radius-lg);-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);flex-direction:column;justify-content:space-between;gap:1.25rem;padding:1.5rem;transition:all .3s;display:flex;position:relative;overflow:hidden}.cheatsheet-card:hover{background:var(--bg-card-hover);border-color:var(--border-glow);transform:translateY(-4px);box-shadow:0 12px 35px #8b5cf633}.card-top-row{justify-content:space-between;align-items:flex-start;display:flex}.card-category-badge{text-transform:uppercase;letter-spacing:.5px;color:var(--accent-cyan);background:#06b6d41f;border:1px solid #06b6d440;border-radius:50px;padding:.3rem .7rem;font-size:.75rem;font-weight:700}.card-badge-tag{color:#fff;border-radius:50px;padding:.25rem .6rem;font-size:.7rem;font-weight:800}.card-badge-tag.HOT{background:linear-gradient(135deg,#ef4444,#f97316)}.card-badge-tag.VIP{background:linear-gradient(135deg,#8b5cf6,#ec4899)}.card-badge-tag.POPULAR{background:linear-gradient(135deg,#3b82f6,#06b6d4)}.card-badge-tag.NEW{background:linear-gradient(135deg,#10b981,#059669)}.card-title{color:#fff;font-size:1.25rem;font-weight:700;line-height:1.35}.card-description{color:var(--text-secondary);font-size:.9rem;line-height:1.5}.code-preview-box{border-radius:var(--radius-md);font-family:var(--font-mono);color:#e5e7eb;background:#090a0fd9;border:1px solid #ffffff0f;max-height:140px;padding:.85rem;font-size:.78rem;position:relative;overflow:hidden}.code-header-bar{color:var(--text-muted);border-bottom:1px solid #ffffff0f;justify-content:space-between;align-items:center;margin-bottom:.5rem;padding-bottom:.35rem;font-size:.7rem;display:flex}.code-snippet-text{white-space:pre-wrap;word-break:break-all;-webkit-line-clamp:4;-webkit-box-orient:vertical;display:-webkit-box;overflow:hidden}.copy-mini-btn{color:var(--text-secondary);background:#ffffff0d;border-radius:4px;align-items:center;gap:.3rem;padding:.2rem .5rem;font-size:.7rem;transition:all .2s;display:flex}.copy-mini-btn:hover{color:#fff;background:#8b5cf64d}.card-stats-row{color:var(--text-muted);align-items:center;gap:1rem;font-size:.8rem;display:flex}.stat-item{align-items:center;gap:.35rem;display:flex}.card-footer-actions{gap:.75rem;display:flex}.btn-open-modal{border:1px solid var(--border-light);color:#fff;background:#ffffff0f;border-radius:50px;flex:1;justify-content:center;align-items:center;gap:.5rem;padding:.65rem 1rem;font-size:.85rem;font-weight:700;transition:all .25s;display:flex}.btn-open-modal:hover{background:var(--gradient-brand);border-color:#0000;box-shadow:0 4px 15px #8b5cf666}.modal-overlay{z-index:1000;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);background:#000000d9;justify-content:center;align-items:center;padding:1.5rem;display:flex;position:fixed;inset:0}.modal-content-box{border:1px solid var(--border-glow);border-radius:var(--radius-xl);background:#0f121d;flex-direction:column;gap:1.5rem;width:100%;max-width:760px;max-height:88vh;padding:2rem;animation:.3s ease-out modalIn;display:flex;position:relative;overflow-y:auto;box-shadow:0 25px 60px #000000e6,0 0 40px #8b5cf64d}@keyframes modalIn{0%{opacity:0;transform:scale(.95)translateY(10px)}to{opacity:1;transform:scale(1)translateY(0)}}.modal-close-btn{color:#fff;background:#ffffff14;border-radius:50%;justify-content:center;align-items:center;width:36px;height:36px;transition:all .2s;display:flex;position:absolute;top:1.25rem;right:1.25rem}.modal-close-btn:hover{background:#ef44444d}.modal-header-meta{align-items:center;gap:.75rem;display:flex}.modal-title{color:#fff;font-size:1.75rem;font-weight:800;line-height:1.25}.modal-markdown-body{border:1px solid var(--border-light);border-radius:var(--radius-md);color:#d1d5db;background:#12152099;padding:1.5rem;font-size:.95rem;line-height:1.7}.modal-markdown-body h1,.modal-markdown-body h2,.modal-markdown-body h3{color:#fff;margin-top:1.25rem;margin-bottom:.5rem}.modal-markdown-body code{font-family:var(--font-mono);color:#c4b5fd;background:#00000080;border-radius:4px;padding:.2rem .4rem}.modal-download-bar{justify-content:flex-end;gap:1rem;display:flex}.toast-notification{z-index:2000;-webkit-backdrop-filter:blur(10px);backdrop-filter:blur(10px);color:#fff;background:#10b981f2;border-radius:50px;align-items:center;gap:.6rem;padding:.85rem 1.5rem;font-size:.9rem;font-weight:700;animation:.3s ease-out toastIn;display:flex;position:fixed;bottom:2rem;right:2rem;box-shadow:0 10px 30px #10b98166}@keyframes toastIn{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.site-footer{border-top:1px solid var(--border-light);color:var(--text-secondary);margin-top:5rem;padding:3rem 0;font-size:.9rem}.footer-content{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:1.5rem;display:flex}