diff --git a/docs/index.html b/docs/index.html index ba41ca7..56f81ad 100644 --- a/docs/index.html +++ b/docs/index.html @@ -1,280 +1,109 @@ - - + + + + + + + + + + + CodeSnip — Next-Gen Code & Prompt Manager - + + - - +
+
+
+ NEXT-GENERATION CODE & PROMPT MANAGER +

Your code.
Organized.

+

A modern, fast and completely offline desktop app for code snippets, terminal commands and AI prompts.

+ +
ElectronMIT LicenseOffline-first
+
+ +
+
BUILT FOR PEOPLE WHO BUILD
DevelopersAI UsersDesignersPower Users
+
+
FEATURES

Everything you need.
Nothing you don't.

CodeSnip keeps your frequently used code and prompts close, searchable and available even without an internet connection.

+
+

Spotlight Search

Find snippets instantly with global Spotlight search. Use Ctrl + Shift + S from anywhere.

+

Liquid Glass UI

A clean, modern interface designed around fast navigation and a focused workspace.

+

Share with Base64

Create compact Base64-based sharing links for snippets without sending your data to a server.

+

Offline by Design

Your snippets stay local. CodeSnip works without requiring an internet connection.

+

TR / EN

Switch between Turkish and English and keep the workspace comfortable for your workflow.

+

Categories

Organize snippets into categories and filter your collection quickly as it grows.

+

Backup & Restore

Export and import your snippet library as JSON so your local data is easy to back up and move.

+

Customization

Personalize the workspace with appearance, blur, transparency, accent and background options.

+
+
+
+
THE WORKSPACE

Made to stay out of your way.

+
+
CodeSnip application interface
+
CodeSnip workspace screenshot
+
CodeSnip interface screenshot
+
+
+
+

ROADMAP

Built in releases.
Always moving forward.

+
+
v1.0
Completed

Initial Release

CodeSnip starts its journey.

+
v1.1
Completed

Hotfixes & Favorites

Hotfixes, favorites and early improvements.

+
26Q2
Completed

26Q2 — v2.0

Spotlight, sharing and redesigned Liquid Glass UI.

26Q2.5JSON Export/Import, improved Spotlight and version naming update.
+
26Q3
Current

Linux Support & Customization

Linux support for Debian, Arch and Red Hat, improved appearance, customization and category management.

26Q3.1Critical hotfixes.
26Q3.5Important hotfixes, Spanish language support and light theme improvements.
+
26Q4
Planned

macOS Support & Performance

Application optimization and macOS expansion, while continuing platform-specific Linux improvements.

+
27Q1
Planned

Plugins & Code Preview

A plugin system and built-in code preview capabilities.

+
+
+
READY?

Keep your best code one shortcut away.

Download CodeSnip or explore the source on GitHub.

+
+ + - - + \ No newline at end of file diff --git a/docs/script.js b/docs/script.js index c44044e..e747603 100644 --- a/docs/script.js +++ b/docs/script.js @@ -1,456 +1,95 @@ const menu = document.getElementById('menu'); -const navLinks = document.querySelector('.nav-links'); +const navLinks = document.getElementById('site-navigation'); + +function setMenu(open) { + navLinks?.classList.toggle('mobile-open', open); + menu?.setAttribute('aria-expanded', String(open)); + menu?.setAttribute('aria-label', open ? 'Close menu' : 'Open menu'); +} menu?.addEventListener('click', () => { - navLinks.classList.toggle('mobile-open'); + setMenu(!navLinks?.classList.contains('mobile-open')); +}); + +navLinks?.querySelectorAll('a').forEach(link => { + link.addEventListener('click', () => setMenu(false)); }); const translations = { en: { - // Navigation - features: 'Features', - screenshots: 'Screenshots', - roadmap: 'Roadmap', - github: 'GitHub', - - // Hero - eyebrow: 'NEXT-GENERATION CODE & PROMPT MANAGER', - heroTitle: 'Your code.
Organized.', - heroText: 'A modern, fast and completely offline desktop app for code snippets, terminal commands and AI prompts.', - download: 'Download CodeSnip ↗', - source: 'View source', - offline: 'Offline-first', - - // Features - builtFor: 'BUILT FOR PEOPLE WHO BUILD', - featureEyebrow: 'FEATURES', - featureTitle: "Everything you need.
Nothing you don't.", - featureIntro: 'CodeSnip keeps your frequently used code and prompts close, searchable and available even without an internet connection.', - - f1t: 'Spotlight Search', - f1p: 'Find snippets instantly with global Spotlight search. Use Ctrl + Shift + S from anywhere.', - - f2t: 'Liquid Glass UI', - f2p: 'A clean, modern interface designed around fast navigation and a focused workspace.', - - f3t: 'Share with Base64', - f3p: 'Create compact Base64-based sharing links for snippets without sending your data to a server.', - - f4t: 'Offline by Design', - f4p: 'Your snippets stay local. CodeSnip works without requiring an internet connection.', - - f5t: 'TR / EN', - f5p: 'Switch between Turkish and English and keep the workspace comfortable for your workflow.', - - f6t: 'Categories', - f6p: 'Organize snippets into categories and filter your collection quickly as it grows.', - - // Workspace - workspace: 'THE WORKSPACE', - workspaceTitle: 'Made to stay out of your way.', - - // Roadmap - roadmapEyebrow: 'ROADMAP', - roadmapTitle: 'Built in releases.
Always moving forward.', - - completed: 'Completed', - current: 'Current', - planned: 'Planned', - - // v1.0 - r1t: 'Initial Release', - r1p: 'CodeSnip starts its journey.', - - // v1.1 - r2t: 'Hotfixes & Favorites', - r2p: 'Hotfixes, favorites and early improvements.', - - // 26Q2 - r3t: '26Q2 — v2.0', - r3p: 'Spotlight, sharing and redesigned Liquid Glass UI.', - - r25t: '26Q2.5', - r25p: 'JSON Export/Import, improved Spotlight and version naming update.', - - // 26Q3 - r3qTitle: 'Linux Support & Customization', - r3q: 'Linux support for Debian, Arch and Red Hat, improved appearance, customization and category management.', - - // 26Q3.1 - r31t: '26Q3.1', - r31p: 'Critical hotfixes.', - - // 26Q3.5 - r35t: '26Q3.5', - r35p: 'Important hotfixes, Spanish language support and light theme improvements.', - - // 26Q4 - r4qTitle: 'Optimization & Platform Expansion', - r4q: 'Application optimization and full macOS and Linux support, including Slackware and Gentoo.', - - // 27Q1 - r5qTitle: 'Plugins & Code Preview', - r5q: 'A plugin system and built-in code preview capabilities.', - - // CTA - ready: 'READY?', - ctaTitle: 'Keep your best code one shortcut away.', - ctaText: 'Download CodeSnip or explore the source on GitHub.', - get: 'Get CodeSnip ↗', - - // Footer - tagline: 'Next-Gen Code & Prompt Manager' + features:'Features', screenshots:'Screenshots', roadmap:'Roadmap', github:'GitHub', + eyebrow:'NEXT-GENERATION CODE & PROMPT MANAGER', heroTitle:'Your code.
Organized.', + heroText:'A modern, fast and completely offline desktop app for code snippets, terminal commands and AI prompts.', + download:'Download CodeSnip ↗', source:'View source', offline:'Offline-first', + builtFor:'BUILT FOR PEOPLE WHO BUILD', featureEyebrow:'FEATURES', featureTitle:"Everything you need.
Nothing you don't.", + featureIntro:'CodeSnip keeps your frequently used code and prompts close, searchable and available even without an internet connection.', + f1t:'Spotlight Search', f1p:'Find snippets instantly with global Spotlight search. Use Ctrl + Shift + S from anywhere.', + f2t:'Liquid Glass UI', f2p:'A clean, modern interface designed around fast navigation and a focused workspace.', + f3t:'Share with Base64', f3p:'Create compact Base64-based sharing links for snippets without sending your data to a server.', + f4t:'Offline by Design', f4p:'Your snippets stay local. CodeSnip works without requiring an internet connection.', + f5t:'TR / EN', f5p:'Switch between Turkish and English and keep the workspace comfortable for your workflow.', + f6t:'Categories', f6p:'Organize snippets into categories and filter your collection quickly as it grows.', + f7t:'Backup & Restore', f7p:'Export and import your snippet library as JSON so your local data is easy to back up and move.', + f8t:'Customization', f8p:'Personalize the workspace with appearance, blur, transparency, accent and background options.', + workspace:'THE WORKSPACE', workspaceTitle:'Made to stay out of your way.', roadmapEyebrow:'ROADMAP', roadmapTitle:'Built in releases.
Always moving forward.', + completed:'Completed', current:'Current', planned:'Planned', r1t:'Initial Release', r1p:'CodeSnip starts its journey.', + r2t:'Hotfixes & Favorites', r2p:'Hotfixes, favorites and early improvements.', r3t:'26Q2 — v2.0', r3p:'Spotlight, sharing and redesigned Liquid Glass UI.', + r25p:'JSON Export/Import, improved Spotlight and version naming update.', + r3qTitle:'Linux Support & Customization', r3q:'Linux support for Debian, Arch and Red Hat, improved appearance, customization and category management.', + r31p:'Critical hotfixes.', r35p:'Important hotfixes, Spanish language support and light theme improvements.', + r4qTitle:'macOS Support & Performance', r4q:'Application optimization and macOS expansion, while continuing platform-specific Linux improvements.', + r5qTitle:'Plugins & Code Preview', r5q:'A plugin system and built-in code preview capabilities.', ready:'READY?', + ctaTitle:'Keep your best code one shortcut away.', ctaText:'Download CodeSnip or explore the source on GitHub.', get:'Get CodeSnip ↗', tagline:'Next-Gen Code & Prompt Manager' }, - tr: { - // Navigation - features: 'Özellikler', - screenshots: 'Ekran Görüntüleri', - roadmap: 'Yol Haritası', - github: 'GitHub', - - // Hero - eyebrow: 'YENİ NESİL KOD VE PROMPT YÖNETİCİSİ', - heroTitle: 'Kodların.
Düzenli.', - heroText: 'Kod parçacıkları, terminal komutları ve yapay zekâ promptları için modern, hızlı ve tamamen çevrimdışı masaüstü uygulaması.', - download: "CodeSnip'i İndir ↗", - source: 'Kaynak kodu', - offline: 'Çevrimdışı', - - // Features - builtFor: 'ÜRETEN İNSANLAR İÇİN', - featureEyebrow: 'ÖZELLİKLER', - featureTitle: 'İhtiyacın olan her şey.
Gereksiz hiçbir şey yok.', - featureIntro: 'CodeSnip, sık kullandığın kodları ve promptları internet bağlantısı olmadan erişilebilir, aranabilir ve düzenli tutar.', - - f1t: 'Spotlight Arama', - f1p: 'Global Spotlight aramasıyla kodlarını anında bul. Her yerden Ctrl + Shift + S kullan.', - - f2t: 'Liquid Glass Arayüz', - f2p: 'Hızlı gezinme ve odaklanmış çalışma alanı için tasarlanmış temiz ve modern arayüz.', - - f3t: 'Base64 ile Paylaş', - f3p: 'Verilerini bir sunucuya göndermeden kod parçacıkları için kompakt Base64 paylaşım bağlantıları oluştur.', - - f4t: 'Çevrimdışı Tasarım', - f4p: 'Kodların yerel olarak kalır. CodeSnip internet bağlantısı gerektirmeden çalışır.', - - f5t: 'TR / EN', - f5p: 'Çalışma alanını Türkçe veya İngilizce kullan.', - - f6t: 'Kategoriler', - f6p: 'Kod parçacıklarını kategorilere ayır ve koleksiyonun büyüdükçe hızlıca filtrele.', - - // Workspace - workspace: 'ÇALIŞMA ALANI', - workspaceTitle: 'İşinin önüne geçmemek için tasarlandı.', - - // Roadmap - roadmapEyebrow: 'YOL HARİTASI', - roadmapTitle: 'Sürümlerle gelişiyor.
Her zaman ileriye.', - - completed: 'Tamamlandı', - current: 'Mevcut Sürüm', - planned: 'Planlanıyor', - - // v1.0 - r1t: 'İlk Sürüm', - r1p: 'CodeSnip yolculuğuna başladı.', - - // v1.1 - r2t: 'Hotfixler ve Favoriler', - r2p: 'Hotfixler, favoriler ve ilk geliştirmeler.', - - // 26Q2 - r3t: '26Q2 — v2.0', - r3p: 'Spotlight, paylaşım ve yenilenen Liquid Glass arayüzü.', - - r25t: '26Q2.5', - r25p: 'JSON içe/dışa aktarma, geliştirilmiş Spotlight ve yeni sürüm adlandırması.', - - // 26Q3 - r3qTitle: 'Linux Desteği ve Özelleştirme', - r3q: 'Debian, Arch ve Red Hat için Linux desteği, geliştirilmiş görünüm, özelleştirme ve kategori yönetimi.', - - // 26Q3.1 - r31t: '26Q3.1', - r31p: 'Kritik düzeltmeler.', - - // 26Q3.5 - r35t: '26Q3.5', - r35p: 'Önemli düzeltmeler, İspanyolca dil desteği ve açık tema geliştirmeleri.', - - // 26Q4 - r4qTitle: 'Optimizasyon ve Platform Genişletme', - r4q: 'Uygulama optimizasyonu ve Slackware ile Gentoo dahil tam macOS ve Linux desteği.', - - // 27Q1 - r5qTitle: 'Eklentiler ve Kod Önizleme', - r5q: 'Eklenti sistemi ve yerleşik kod önizleme özellikleri.', - - // CTA - ready: 'HAZIR MISIN?', - ctaTitle: 'En iyi kodların tek bir kısayol uzağında.', - ctaText: "CodeSnip'i indir veya kaynak kodunu GitHub'da incele.", - get: "CodeSnip'i Al ↗", - - // Footer - tagline: 'Yeni Nesil Kod ve Prompt Yöneticisi' + features:'Özellikler', screenshots:'Ekran Görüntüleri', roadmap:'Yol Haritası', github:'GitHub', + eyebrow:'YENİ NESİL KOD VE PROMPT YÖNETİCİSİ', heroTitle:'Kodların.
Düzenli.', + heroText:'Kod parçacıkları, terminal komutları ve yapay zekâ promptları için modern, hızlı ve tamamen çevrimdışı masaüstü uygulaması.', + download:"CodeSnip'i İndir ↗", source:'Kaynak kodu', offline:'Çevrimdışı', builtFor:'ÜRETEN İNSANLAR İÇİN', featureEyebrow:'ÖZELLİKLER', + featureTitle:'İhtiyacın olan her şey.
Gereksiz hiçbir şey yok.', featureIntro:'CodeSnip, sık kullandığın kodları ve promptları internet bağlantısı olmadan erişilebilir, aranabilir ve düzenli tutar.', + f1t:'Spotlight Arama', f1p:'Global Spotlight aramasıyla kodlarını anında bul. Her yerden Ctrl + Shift + S kullan.', f2t:'Liquid Glass Arayüz', f2p:'Hızlı gezinme ve odaklanmış çalışma alanı için tasarlanmış temiz ve modern arayüz.', + f3t:'Base64 ile Paylaş', f3p:'Verilerini bir sunucuya göndermeden kod parçacıkları için kompakt Base64 paylaşım bağlantıları oluştur.', f4t:'Çevrimdışı Tasarım', f4p:'Kodların yerel olarak kalır. CodeSnip internet bağlantısı gerektirmeden çalışır.', + f5t:'TR / EN', f5p:'Çalışma alanını Türkçe veya İngilizce kullan.', f6t:'Kategoriler', f6p:'Kod parçacıklarını kategorilere ayır ve koleksiyonun büyüdükçe hızlıca filtrele.', + f7t:'Yedekle ve Geri Yükle', f7p:'Snippet koleksiyonunu JSON olarak dışa aktar ve gerektiğinde kolayca geri yükle.', f8t:'Özelleştirme', f8p:'Görünüm, blur, şeffaflık, vurgu rengi ve arka plan seçenekleriyle çalışma alanını kişiselleştir.', + workspace:'ÇALIŞMA ALANI', workspaceTitle:'İşinin önüne geçmemek için tasarlandı.', roadmapEyebrow:'YOL HARİTASI', roadmapTitle:'Sürümlerle gelişiyor.
Her zaman ileriye.', + completed:'Tamamlandı', current:'Mevcut Sürüm', planned:'Planlanıyor', r1t:'İlk Sürüm', r1p:'CodeSnip yolculuğuna başladı.', r2t:'Hotfixler ve Favoriler', r2p:'Hotfixler, favoriler ve ilk geliştirmeler.', + r3t:'26Q2 — v2.0', r3p:'Spotlight, paylaşım ve yenilenen Liquid Glass arayüzü.', r25p:'JSON içe/dışa aktarma, geliştirilmiş Spotlight ve yeni sürüm adlandırması.', + r3qTitle:'Linux Desteği ve Özelleştirme', r3q:'Debian, Arch ve Red Hat için Linux desteği, geliştirilmiş görünüm, özelleştirme ve kategori yönetimi.', r31p:'Kritik düzeltmeler.', + r35p:'Önemli düzeltmeler, İspanyolca dil desteği ve açık tema geliştirmeleri.', r4qTitle:'macOS Desteği ve Performans', r4q:'Uygulama optimizasyonu ve macOS genişlemesi; Linux için platforma özel geliştirmeler devam ediyor.', + r5qTitle:'Eklentiler ve Kod Önizleme', r5q:'Eklenti sistemi ve yerleşik kod önizleme özellikleri.', ready:'HAZIR MISIN?', ctaTitle:'En iyi kodların tek bir kısayol uzağında.', ctaText:"CodeSnip'i indir veya kaynak kodunu GitHub'da incele.", get:"CodeSnip'i Al ↗", tagline:'Yeni Nesil Kod ve Prompt Yöneticisi' } }; - function setLanguage(lang) { - if (!translations[lang]) { - lang = 'en'; - } - + if (!translations[lang]) lang = 'en'; document.documentElement.lang = lang; - document.querySelectorAll('[data-i18n]').forEach(el => { - const key = el.dataset.i18n; - - if (translations[lang][key] !== undefined) { - el.innerHTML = translations[lang][key]; - } - }); - - document.querySelectorAll('.lang').forEach(btn => { - btn.classList.toggle( - 'active', - btn.id === `lang-${lang}` - ); + const value = translations[lang][el.dataset.i18n]; + if (value !== undefined) el.innerHTML = value; }); - + document.querySelectorAll('.lang').forEach(btn => btn.classList.toggle('active', btn.id === `lang-${lang}`)); localStorage.setItem('codesnip-lang', lang); } - -document - .getElementById('lang-en') - ?.addEventListener('click', () => { - setLanguage('en'); - }); - - -document - .getElementById('lang-tr') - ?.addEventListener('click', () => { - setLanguage('tr'); - }); - +document.getElementById('lang-en')?.addEventListener('click', () => setLanguage('en')); +document.getElementById('lang-tr')?.addEventListener('click', () => setLanguage('tr')); const saved = localStorage.getItem('codesnip-lang'); +const browserLang = navigator.language?.toLowerCase().startsWith('tr') ? 'tr' : 'en'; +setLanguage(saved || browserLang); -const browser = - navigator.language?.toLowerCase().startsWith('tr') - ? 'tr' - : 'en'; - -setLanguage(saved || browser); - - -// Scroll reveal animations -const reveal = new IntersectionObserver( - entries => { +const revealElements = document.querySelectorAll('.feature,.shot,.release,.cta'); +if ('IntersectionObserver' in window) { + const reveal = new IntersectionObserver(entries => { entries.forEach(entry => { if (entry.isIntersecting) { entry.target.classList.add('visible'); reveal.unobserve(entry.target); } }); - }, - { - threshold: 0.08 - } -); - - -document - .querySelectorAll('.feature,.shot,.release,.cta') - .forEach(el => reveal.observe(el)); - - -// Final visual polish for the existing CodeSnip Pages layout. -const polish = document.createElement('style'); - -polish.textContent = ` - .brand { - gap: 9px; - } - - .brand img { - width: 32px; - height: 32px; - flex: 0 0 32px; - display: block; - object-fit: contain; - border-radius: 8px; - } - - .mock-sidebar img { - width: 30px; - height: 30px; - display: block; - object-fit: contain; - margin: 0 0 30px 0; - border-radius: 7px; - } - - .nav-actions { - display: flex; - align-items: center; - gap: 14px; - } - - .language { - display: inline-flex; - align-items: center; - gap: 4px; - padding: 4px; - border: 1px solid rgba(255,255,255,.10); - border-radius: 11px; - background: rgba(255,255,255,.045); - box-shadow: - inset 0 1px 0 rgba(255,255,255,.04), - 0 6px 20px rgba(0,0,0,.08); - backdrop-filter: blur(14px); - -webkit-backdrop-filter: blur(14px); - } - - .language > span { - color: rgba(255,255,255,.25); - font-size: 11px; - user-select: none; - } - - .lang { - appearance: none; - border: 0; - background: transparent; - color: #8f96a3; - font: 700 11px/1 Inter, system-ui, sans-serif; - letter-spacing: .04em; - min-width: 31px; - height: 26px; - padding: 0 7px; - border-radius: 8px; - cursor: pointer; - transition: - color .18s ease, - background .18s ease, - transform .18s ease, - box-shadow .18s ease; - } - - .lang:hover { - color: #dceff0; - background: rgba(0,173,181,.10); - } - - .lang:active { - transform: scale(.94); - } - - .lang.active { - color: #041316; - background: #00adb5; - box-shadow: - 0 4px 14px rgba(0,173,181,.18); - } - - .lang.active:hover { - background: #12bbc3; - } - - /* Roadmap */ - .current-release { - position: relative; - } - - .release-status { - display: inline-flex; - align-items: center; - width: fit-content; - padding: 5px 10px; - margin-bottom: 10px; - border: 1px solid rgba(255,255,255,.08); - border-radius: 999px; - background: rgba(255,255,255,.04); - font-size: .72rem; - font-weight: 700; - letter-spacing: .08em; - text-transform: uppercase; - } - - .release-status.current { - color: #00adb5; - border-color: rgba(0,173,181,.35); - background: rgba(0,173,181,.10); - } - - .release-status.completed { - opacity: .65; - } - - .release-status.planned { - opacity: .5; - } - - .release-sub { - display: flex; - gap: 10px; - margin-top: 14px; - padding: 10px 12px; - border-left: 2px solid rgba(255,255,255,.08); - font-size: .9rem; - line-height: 1.5; - } - - .release-sub strong { - flex-shrink: 0; - color: #00adb5; - } - - .release-sub.upcoming { - border-left-color: rgba(0,173,181,.35); - } - - @media (max-width: 850px) { - .brand img { - width: 30px; - height: 30px; - flex-basis: 30px; - } - - .nav-actions { - gap: 8px; - } - } - - @media (max-width: 560px) { - .brand img { - width: 28px; - height: 28px; - flex-basis: 28px; - border-radius: 7px; - } - - .language { - padding: 3px; - } - - .lang { - min-width: 29px; - height: 24px; - font-size: 10px; - } - - .release-sub { - flex-direction: column; - gap: 4px; - } - } -`; - -document.head.appendChild(polish); + }, { threshold: 0.08 }); + document.documentElement.classList.add('reveal-ready'); + revealElements.forEach(el => reveal.observe(el)); +} else { + revealElements.forEach(el => el.classList.add('visible')); +} diff --git a/docs/style.css b/docs/style.css index 08d4f8b..d1e4c28 100644 --- a/docs/style.css +++ b/docs/style.css @@ -1 +1 @@ -:root{--bg:#080a0f;--border:rgba(255,255,255,.11);--text:#f5f7fb;--muted:#a4a9b6;--accent:#00adb5;--accent2:#6ee7f0;--max:1120px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 75% 5%,rgba(0,173,181,.13),transparent 30%),radial-gradient(circle at 15% 35%,rgba(110,231,240,.06),transparent 25%),var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}.container{width:min(calc(100% - 40px),var(--max));margin:auto}.nav-wrap{position:sticky;top:0;z-index:10;background:rgba(8,10,15,.72);backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.06)}.nav{height:72px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:10px;align-items:center;font-weight:800;font-size:18px}.brand img{width:34px;height:34px;border-radius:9px;object-fit:cover;box-shadow:0 0 24px rgba(0,173,181,.18)}.nav-links{display:flex;gap:28px;color:#b8bdc9;font-size:14px}.nav-links a:hover{color:#fff}.nav-actions{display:flex;align-items:center;gap:18px}.language{display:flex;align-items:center;gap:7px;font-size:12px;font-weight:800;color:#68717e}.lang{border:0;background:none;padding:3px;color:#68717e;font:inherit;cursor:pointer}.lang.active{color:var(--accent2)}.menu{display:none;background:none;border:0;color:#fff;font-size:24px}.hero{min-height:720px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding:90px 0}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.18em;color:var(--accent2)}h1{font-size:clamp(54px,7vw,88px);line-height:.96;letter-spacing:-.055em;margin:18px 0 26px}h1 span{background:linear-gradient(90deg,#fff,var(--accent2));-webkit-background-clip:text;color:transparent}.lead{max-width:570px;color:var(--muted);font-size:18px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0}.btn{padding:12px 18px;border-radius:12px;border:1px solid var(--border);font-weight:700;font-size:14px;transition:.2s}.btn:hover{transform:translateY(-2px);border-color:rgba(255,255,255,.22)}.primary{background:var(--accent);color:#031114;border-color:var(--accent)}.secondary{background:rgba(255,255,255,.04)}.meta{display:flex;align-items:center;gap:12px;color:#777e8b;font-size:12px}.meta i{width:3px;height:3px;border-radius:50%;background:#59606c}.glass{background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025));border:1px solid var(--border);box-shadow:0 25px 80px rgba(0,0,0,.32);backdrop-filter:blur(20px)}.hero-card{height:480px;border-radius:24px;overflow:hidden;display:flex;position:relative;transform:rotate(1deg)}.window-bar{height:48px;position:absolute;left:0;right:0;top:0;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:7px;padding:0 16px}.window-bar span{width:8px;height:8px;border-radius:50%;background:#59606c}.window-bar b{font-size:11px;color:#7f8692;margin-left:8px}.mock-sidebar{width:25%;padding:75px 14px 20px;border-right:1px solid var(--border)}.mock-logo{color:var(--accent2);font-weight:800;margin-bottom:30px}.mock-sidebar>img{width:30px;height:30px;border-radius:8px;display:block;margin-bottom:25px}.mock-line{height:10px;border-radius:4px;background:rgba(255,255,255,.08);margin:16px 0}.mock-line.active{background:rgba(0,173,181,.35)}.mock-line.short{width:55%}.mock-main{flex:1;padding:78px 28px}.mock-search{border:1px solid var(--border);border-radius:10px;padding:10px;color:#707887;font-size:11px}.mock-title{font-weight:700;margin:24px 0 14px}.snippet{border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:13px;margin:10px 0;background:rgba(0,0,0,.12)}.snippet small{display:block;color:var(--accent2);font-size:9px}.snippet strong{display:block;font-size:12px}.snippet span{display:block;color:#727987;font-size:9px}.trusted{padding:0 0 90px;text-align:center;color:#666d79;font-size:10px;letter-spacing:.15em}.trusted div{display:flex;justify-content:center;gap:55px;margin-top:20px;color:#a0a5af;letter-spacing:0;font-size:14px}.section{padding:100px 0}.section-head{max-width:650px;margin-bottom:48px}.section-head h2{font-size:clamp(36px,5vw,58px);line-height:1.02;letter-spacing:-.04em;margin:15px 0}.section-head p{color:var(--muted);font-size:16px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature{padding:28px;border-radius:18px;min-height:220px}.feature .icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:rgba(0,173,181,.1);border:1px solid rgba(0,173,181,.2);color:var(--accent2);margin-bottom:25px}.feature h3{margin:0 0 8px;font-size:18px}.feature p{margin:0;color:var(--muted);font-size:14px}kbd{border:1px solid #444b57;border-radius:5px;padding:2px 5px;font-size:10px;background:#11151c}.shots{display:grid;grid-template-columns:1.35fr 1fr;gap:16px}.shot{margin:0;border-radius:18px;overflow:hidden;border:1px solid var(--border);background:#10131a}.shot.large{grid-row:span 2}.shot img{display:block;width:100%;height:100%;object-fit:cover}.timeline{border-left:1px solid rgba(255,255,255,.13);margin-left:15px}.release{display:grid;grid-template-columns:110px 1fr;gap:20px;padding:0 0 38px 35px;position:relative}.release:before{content:"";position:absolute;left:-5px;top:6px;width:9px;height:9px;border-radius:50%;background:#303641;border:2px solid var(--bg)}.release.done:before,.release.next:before{background:var(--accent)}.release span{font-weight:800;color:var(--accent2);font-size:13px}.release h3{margin:0 0 5px}.release p{margin:0;color:var(--muted);font-size:14px}.cta{margin-bottom:80px;border-radius:24px;padding:55px;display:flex;align-items:center;justify-content:space-between;gap:30px}.cta h2{font-size:clamp(30px,4vw,48px);line-height:1.05;margin:12px 0}.cta p{color:var(--muted);margin:0}.cta .actions{margin:0}.footer{padding:30px 0 45px;border-top:1px solid rgba(255,255,255,.07);display:flex;justify-content:space-between;color:#777e8b;font-size:12px}.footer div{display:flex;gap:14px}.footer b{color:#fff}.footer a{color:#aeb4c0}.footer a:hover{color:var(--accent2)}.feature,.shot,.release,.cta{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease}.feature.visible,.shot.visible,.release.visible,.cta.visible{opacity:1;transform:translateY(0)}@media(max-width:850px){.hero{grid-template-columns:1fr;gap:30px;padding-top:60px}.hero-card{height:390px}.feature-grid{grid-template-columns:1fr 1fr}.nav-links{display:none}.nav-links.mobile-open{display:flex;position:absolute;top:62px;left:14px;right:14px;padding:18px;flex-direction:column;gap:16px;background:rgba(10,12,18,.96);border:1px solid rgba(255,255,255,.1);border-radius:14px;backdrop-filter:blur(18px)}.menu{display:block}.shots{grid-template-columns:1fr}.shot.large{grid-row:auto}.cta{flex-direction:column;align-items:flex-start}.trusted div{gap:18px;flex-wrap:wrap}}@media(max-width:560px){.container{width:min(calc(100% - 28px),var(--max))}.feature-grid{grid-template-columns:1fr}.hero-card{height:330px}.mock-sidebar{width:20%;padding-left:8px;padding-right:8px}.mock-main{padding:65px 14px}.nav{height:62px}.section{padding:70px 0}.cta{padding:30px}.release{grid-template-columns:75px 1fr}.language{font-size:11px}} +:root{--bg:#080a0f;--border:rgba(255,255,255,.11);--text:#f5f7fb;--muted:#a4a9b6;--accent:#00adb5;--accent2:#6ee7f0;--max:1120px}*{box-sizing:border-box}html{scroll-behavior:smooth}body{margin:0;background:radial-gradient(circle at 75% 5%,rgba(0,173,181,.13),transparent 30%),radial-gradient(circle at 15% 35%,rgba(110,231,240,.06),transparent 25%),var(--bg);color:var(--text);font-family:Inter,system-ui,sans-serif;line-height:1.6}a{color:inherit;text-decoration:none}.container{width:min(calc(100% - 40px),var(--max));margin:auto}.nav-wrap{position:sticky;top:0;z-index:10;background:rgba(8,10,15,.72);backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px);border-bottom:1px solid rgba(255,255,255,.06)}.nav{height:72px;display:flex;align-items:center;justify-content:space-between}.brand{display:flex;gap:9px;align-items:center;font-weight:800;font-size:18px}.brand img{width:32px;height:32px;flex:0 0 32px;border-radius:8px;object-fit:contain}.nav-links{display:flex;gap:28px;color:#b8bdc9;font-size:14px}.nav-links a:hover,.nav-links a:focus-visible{color:#fff}.nav-actions{display:flex;align-items:center;gap:14px}.language{display:inline-flex;align-items:center;gap:4px;padding:4px;border:1px solid rgba(255,255,255,.1);border-radius:11px;background:rgba(255,255,255,.045);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.language>span{color:rgba(255,255,255,.25);font-size:11px;user-select:none}.lang{appearance:none;border:0;background:transparent;color:#8f96a3;font:700 11px/1 Inter,system-ui,sans-serif;letter-spacing:.04em;min-width:31px;height:26px;padding:0 7px;border-radius:8px;cursor:pointer;transition:color .18s ease,background .18s ease,transform .18s ease}.lang:hover,.lang:focus-visible{color:#dceff0;background:rgba(0,173,181,.1)}.lang:active{transform:scale(.94)}.lang.active{color:#041316;background:var(--accent);box-shadow:0 4px 14px rgba(0,173,181,.18)}.menu{display:none;background:none;border:0;color:#fff;font-size:24px;cursor:pointer}.hero{min-height:720px;display:grid;grid-template-columns:1fr 1fr;gap:70px;align-items:center;padding:90px 0}.eyebrow{font-size:11px;font-weight:800;letter-spacing:.18em;color:var(--accent2)}h1{font-size:clamp(54px,7vw,88px);line-height:.96;letter-spacing:-.055em;margin:18px 0 26px}h1 span{background:linear-gradient(90deg,#fff,var(--accent2));-webkit-background-clip:text;background-clip:text;color:transparent}.lead{max-width:570px;color:var(--muted);font-size:18px}.actions{display:flex;gap:12px;flex-wrap:wrap;margin:30px 0}.btn{display:inline-flex;align-items:center;justify-content:center;padding:12px 18px;border-radius:12px;border:1px solid var(--border);font-weight:700;font-size:14px;transition:.2s}.btn:hover,.btn:focus-visible{transform:translateY(-2px);border-color:rgba(255,255,255,.22)}.primary{background:var(--accent);color:#031114;border-color:var(--accent)}.secondary{background:rgba(255,255,255,.04)}.meta{display:flex;align-items:center;gap:12px;color:#777e8b;font-size:12px}.meta i{width:3px;height:3px;border-radius:50%;background:#59606c}.glass{background:linear-gradient(145deg,rgba(255,255,255,.08),rgba(255,255,255,.025));border:1px solid var(--border);box-shadow:0 25px 80px rgba(0,0,0,.32);backdrop-filter:blur(20px);-webkit-backdrop-filter:blur(20px)}.hero-card{height:480px;border-radius:24px;overflow:hidden;display:flex;position:relative;transform:rotate(1deg)}.window-bar{height:48px;position:absolute;left:0;right:0;top:0;border-bottom:1px solid var(--border);display:flex;align-items:center;gap:7px;padding:0 16px}.window-bar span{width:8px;height:8px;border-radius:50%;background:#59606c}.window-bar b{font-size:11px;color:#7f8692;margin-left:8px}.mock-sidebar{width:25%;padding:75px 14px 20px;border-right:1px solid var(--border)}.mock-sidebar>img{width:30px;height:30px;display:block;object-fit:contain;margin:0 0 30px;border-radius:7px}.mock-line{height:10px;border-radius:4px;background:rgba(255,255,255,.08);margin:16px 0}.mock-line.active{background:rgba(0,173,181,.35)}.mock-line.short{width:55%}.mock-main{flex:1;padding:78px 28px}.mock-search{border:1px solid var(--border);border-radius:10px;padding:10px;color:#707887;font-size:11px}.mock-title{font-weight:700;margin:24px 0 14px}.snippet{border:1px solid rgba(255,255,255,.07);border-radius:12px;padding:13px;margin:10px 0;background:rgba(0,0,0,.12)}.snippet small{display:block;color:var(--accent2);font-size:9px}.snippet strong{display:block;font-size:12px}.snippet span{display:block;color:#727987;font-size:9px}.trusted{padding:0 0 90px;text-align:center;color:#666d79;font-size:10px;letter-spacing:.15em}.trusted div{display:flex;justify-content:center;gap:55px;margin-top:20px;color:#a0a5af;letter-spacing:0;font-size:14px}.section{padding:100px 0}.section-head,.section-heading{max-width:650px;margin-bottom:48px}.section-head h2,.section-heading h2{font-size:clamp(36px,5vw,58px);line-height:1.02;letter-spacing:-.04em;margin:15px 0}.section-head p{color:var(--muted);font-size:16px}.feature-grid{display:grid;grid-template-columns:repeat(3,1fr);gap:16px}.feature{padding:28px;border-radius:18px;min-height:220px}.feature .icon{width:42px;height:42px;display:grid;place-items:center;border-radius:12px;background:rgba(0,173,181,.1);border:1px solid rgba(0,173,181,.2);color:var(--accent2);margin-bottom:25px}.feature h3{margin:0 0 8px;font-size:18px}.feature p{margin:0;color:var(--muted);font-size:14px}.shots{display:grid;grid-template-columns:1.35fr 1fr;gap:16px}.shot{margin:0;border-radius:18px;overflow:hidden;border:1px solid var(--border);background:#10131a;min-height:220px}.shot.large{grid-row:span 2}.shot img{display:block;width:100%;height:100%;object-fit:cover}.roadmap{width:min(calc(100% - 40px),var(--max));margin:auto}.roadmap-list{border-left:1px solid rgba(255,255,255,.13);margin-left:15px}.release{display:grid;grid-template-columns:110px 1fr;gap:20px;padding:0 0 38px 35px;position:relative}.release:before{content:"";position:absolute;left:-5px;top:6px;width:9px;height:9px;border-radius:50%;background:#303641;border:2px solid var(--bg)}.release.current-release:before{background:var(--accent)}.release-version{font-weight:800;color:var(--accent2);font-size:13px}.release-status{display:inline-flex;align-items:center;width:fit-content;padding:5px 10px;margin-bottom:10px;border:1px solid rgba(255,255,255,.08);border-radius:999px;background:rgba(255,255,255,.04);font-size:.72rem;font-weight:700;letter-spacing:.08em;text-transform:uppercase}.release-status.current{color:var(--accent);border-color:rgba(0,173,181,.35);background:rgba(0,173,181,.1)}.release-status.completed{opacity:.65}.release-status.planned{opacity:.5}.release h3{margin:0 0 5px}.release p{margin:0;color:var(--muted);font-size:14px}.release-sub{display:flex;gap:10px;margin-top:14px;padding:10px 12px;border-left:2px solid rgba(255,255,255,.08);font-size:.9rem;line-height:1.5}.release-sub strong{flex-shrink:0;color:var(--accent)}.release-sub.upcoming{border-left-color:rgba(0,173,181,.35)}.cta{margin:20px auto 80px;border-radius:24px;padding:55px;display:flex;align-items:center;justify-content:space-between;gap:30px}.cta h2{font-size:clamp(30px,4vw,48px);line-height:1.05;margin:12px 0}.cta p{color:var(--muted);margin:0}.cta .actions{margin:0}.footer{padding:30px 0 45px;border-top:1px solid rgba(255,255,255,.07);display:flex;justify-content:space-between;color:#777e8b;font-size:12px}.footer div{display:flex;gap:14px}.footer b{color:#fff}.footer a{color:#aeb4c0}.footer a:hover,.footer a:focus-visible{color:var(--accent2)}.reveal-ready .feature,.reveal-ready .shot,.reveal-ready .release,.reveal-ready .cta{opacity:0;transform:translateY(16px);transition:opacity .55s ease,transform .55s ease}.reveal-ready .feature.visible,.reveal-ready .shot.visible,.reveal-ready .release.visible,.reveal-ready .cta.visible{opacity:1;transform:translateY(0)}:focus-visible{outline:2px solid var(--accent2);outline-offset:3px}@media(max-width:850px){.hero{grid-template-columns:1fr;gap:30px;padding-top:60px}.hero-card{height:390px}.feature-grid{grid-template-columns:1fr 1fr}.nav-links{display:none}.nav-links.mobile-open{display:flex;position:absolute;top:72px;left:14px;right:14px;padding:18px;flex-direction:column;gap:16px;background:rgba(10,12,18,.96);border:1px solid rgba(255,255,255,.1);border-radius:14px;backdrop-filter:blur(18px);-webkit-backdrop-filter:blur(18px)}.menu{display:block}.shots{grid-template-columns:1fr}.shot.large{grid-row:auto}.cta{flex-direction:column;align-items:flex-start}.trusted div{gap:18px;flex-wrap:wrap}}@media(max-width:560px){.container{width:min(calc(100% - 28px),var(--max))}.feature-grid{grid-template-columns:1fr}.hero-card{height:330px}.mock-sidebar{width:20%;padding-left:8px;padding-right:8px}.mock-main{padding:65px 14px}.nav{height:62px}.nav-links.mobile-open{top:62px}.section{padding:70px 0}.roadmap{width:min(calc(100% - 28px),var(--max))}.cta{padding:30px}.release{grid-template-columns:75px 1fr}.language{padding:3px}.lang{min-width:29px;height:24px;font-size:10px}}@media(max-width:400px){.hero-card{height:300px}.mock-search{font-size:9px}.mock-title{margin:16px 0 10px}.snippet{padding:9px}.snippet strong{font-size:10px}.snippet span{font-size:8px}.release{grid-template-columns:1fr;gap:6px}.release-version{margin-bottom:2px}}@media(prefers-reduced-motion:reduce){html{scroll-behavior:auto}.reveal-ready .feature,.reveal-ready .shot,.reveal-ready .release,.reveal-ready .cta{opacity:1;transform:none;transition:none}.btn,.lang{transition:none}}