*{margin:0;padding:0;box-sizing:border-box}:root{--primary: #00d4ff;--secondary: #ff00ff;--accent: #00ff88;--danger: #ff0055;--warning: #ffa500;--bg: #0a0e1a;--bg2: #0f1520;--surface: #151b2d;--surface2: #1a2238;--surface3: #1e2943;--text: #ffffff;--text2: #8892b0;--text3: #4a5578;--border: #1e2943;--grad: linear-gradient(135deg, var(--primary), var(--secondary));--grad-text: linear-gradient(135deg, #00d4ff, #ff00ff, #00ff88);--shadow-sm: 0 2px 8px rgba(0, 0, 0, .1);--shadow-md: 0 4px 16px rgba(0, 0, 0, .15);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .2);--shadow-glow: 0 0 24px rgba(0, 212, 255, .3)}html[data-theme=light]{--bg: #f8fafc;--bg2: #ffffff;--surface: #ffffff;--surface2: #f1f5f9;--surface3: #e2e8f0;--text: #0f172a;--text2: #64748b;--text3: #94a3b8;--border: #e2e8f0;--shadow-sm: 0 2px 8px rgba(0, 0, 0, .05);--shadow-md: 0 4px 16px rgba(0, 0, 0, .08);--shadow-lg: 0 8px 32px rgba(0, 0, 0, .12)}body{font-family:Inter,system-ui,-apple-system,Segoe UI,Roboto,Arial,sans-serif;background:var(--bg);color:var(--text);line-height:1.6;min-height:100vh;-webkit-font-smoothing:antialiased;-moz-osx-font-smoothing:grayscale}a{text-decoration:none;color:inherit}button{border:none;background:none;cursor:pointer;font-family:inherit}.app{position:relative}.desktop-only{display:block}.mobile-only{display:none}@media (max-width: 820px){.desktop-only{display:none!important}.mobile-only{display:block}}.topbar{position:fixed;top:0;left:0;right:0;height:36px;z-index:120;background:#0a0e1ae6;-webkit-backdrop-filter:blur(12px);backdrop-filter:blur(12px);border-bottom:1px solid var(--border)}html[data-theme=light] .topbar{background:#ffffffe6}.topbar-inner{max-width:1400px;margin:0 auto;height:100%;display:flex;align-items:center;gap:12px;padding:0 16px}.announcement-icon{font-size:16px;flex-shrink:0}.ticker{position:relative;flex:1;overflow:hidden;height:20px}.ticker-track{position:absolute;white-space:nowrap;animation:marquee 25s linear infinite;color:var(--text2);font-size:14px}@keyframes marquee{0%{transform:translate(100%)}to{transform:translate(-100%)}}.views-counter{display:flex;align-items:center;gap:6px;background:var(--surface);color:var(--text);border:1px solid var(--border);border-radius:999px;padding:4px 12px;font-weight:700;font-size:13px;transition:all .2s}.views-counter:hover{border-color:var(--primary);color:var(--primary)}.views-counter .refresh{opacity:.7;transition:all .2s}.spin{animation:spin 1s linear infinite}@keyframes spin{0%{transform:rotate(0)}to{transform:rotate(360deg)}}.navbar{position:fixed;top:36px;left:0;right:0;z-index:110;background:#0a0e1af2;-webkit-backdrop-filter:blur(20px);backdrop-filter:blur(20px);border-bottom:1px solid var(--border)}html[data-theme=light] .navbar{background:#fffffff2}.nav-container{max-width:1400px;margin:0 auto;padding:12px 20px;display:flex;align-items:center;justify-content:space-between}.nav-brand{display:flex;align-items:center;gap:12px}.logo-img{width:50px;height:50px;border-radius:8px;object-fit:cover;border:1px solid var(--border);box-shadow:var(--shadow-glow)}.brand-texts .brand-name{font-weight:900;letter-spacing:-.02em;font-size:16px}.brand-texts .brand-tag{display:block;font-size:12px;color:var(--text2);margin-top:-2px}.nav-tabs{display:flex;gap:8px}.nav-tab{display:inline-flex;align-items:center;gap:6px;padding:8px 14px;border:1px solid transparent;border-radius:12px;color:var(--text2);background:transparent;transition:all .2s;font-weight:700;font-size:14px}.nav-tab:hover{background:var(--surface);border-color:var(--border);color:var(--text)}.nav-tab.active{background:var(--surface);color:var(--primary);border-color:var(--primary);box-shadow:0 0 16px #00d4ff33}.nav-actions{display:flex;align-items:center;gap:10px}.channel-link{display:flex;align-items:center;gap:6px;padding:6px 12px;background:var(--surface);color:var(--accent);border:1px solid var(--accent);border-radius:10px;font-size:14px;font-weight:600;transition:all .2s}.channel-link:hover{background:var(--accent);color:var(--bg)}.nav-cta{display:flex;align-items:center;gap:6px;padding:8px 16px;background:var(--grad);color:#fff;border-radius:12px;font-weight:700;box-shadow:var(--shadow-glow);transition:all .2s}.nav-cta:hover{transform:translateY(-1px);box-shadow:0 0 32px #00d4ff66}.theme-toggle-nav{display:flex;align-items:center;justify-content:center;width:30px;height:30px;border-radius:15px;background:var(--surface);color:var(--text);border:1px solid var(--border);transition:all .2s}.theme-toggle-nav:hover{border-color:var(--primary);color:var(--primary)}.mobile-menu-btn{display:flex;align-items:center;justify-content:center;width:40px;height:40px;border:1px solid var(--border);border-radius:10px;background:var(--surface);color:var(--text);transition:all .2s}.mobile-menu-btn:hover{border-color:var(--primary);color:var(--primary)}.mobile-menu-overlay{position:fixed;top:100px;left:0;right:0;bottom:0;z-index:200;isolation:isolate}.overlay-backdrop{position:absolute;top:0;right:0;bottom:0;left:0;z-index:0;background:#0009;backdrop-filter:blur(12px);-webkit-backdrop-filter:blur(12px)}.mobile-menu-panel{position:relative;z-index:1;background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;margin:20px 16px;box-shadow:var(--shadow-lg);-webkit-font-smoothing:antialiased;text-rendering:optimizeLegibility;filter:none!important;-webkit-backdrop-filter:none!important;backdrop-filter:none!important}.mobile-menu-list{display:flex;flex-direction:column;gap:4px}.menu-item-vertical{display:flex;align-items:center;gap:12px;padding:16px 20px;background:transparent;border:none;border-radius:12px;font-weight:700;color:var(--text);text-align:left;transition:all .2s;cursor:pointer}.menu-item-vertical:hover{background:var(--surface2);color:var(--primary)}.menu-divider{height:1px;background:var(--border);margin:12px 0}.hero{min-height:50px;display:flex;align-items:center;justify-content:center;position:relative;margin-top:100px;padding:50px 2rem 0}.cyber-grid{position:absolute;top:0;right:0;bottom:0;left:0;background-image:linear-gradient(var(--primary) 1px,transparent 1px),linear-gradient(90deg,var(--primary) 1px,transparent 1px);background-size:50px 50px;opacity:.03;animation:grid-move 15s linear infinite}@keyframes grid-move{0%{transform:translate(0)}to{transform:translate(50px,50px)}}.hero-content{position:relative;z-index:1}.features,.dev-services,.pricing{padding:2rem 2rem 4rem;background:var(--bg2)}.section-container{max-width:1400px;margin:0 auto}.section-title{font-size:2.2rem;font-weight:900;text-align:center;margin-bottom:2rem;display:flex;align-items:center;justify-content:center;gap:12px;color:var(--text)}.title-icon{color:var(--primary)}.feature-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;margin-bottom:2rem}.feature-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;transition:all .3s;position:relative;overflow:hidden}.feature-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad);opacity:0;transition:opacity .3s}.feature-card:hover{transform:translateY(-5px);border-color:var(--primary);box-shadow:var(--shadow-lg)}.feature-card:hover:before{opacity:1}.feature-card.blue{border-left:4px solid #00d4ff}.feature-card.green{border-left:4px solid #00ff88}.feature-card.purple{border-left:4px solid #ff00ff}.feature-card.orange{border-left:4px solid #ff9500}.feature-header{display:flex;align-items:center;gap:12px;margin-bottom:16px}.feature-header h3{font-size:1.2rem;font-weight:800;color:var(--text)}.command-list{display:flex;flex-direction:column;gap:10px}.command-item{display:flex;justify-content:space-between;gap:10px;align-items:center;padding:10px 12px;background:var(--bg);border-radius:10px;font-size:14px;transition:all .2s}.command-item:hover{background:var(--surface2)}.command-item code{color:var(--primary);font-family:Courier New,monospace;font-weight:800;font-size:13px;background:var(--surface2);padding:2px 6px;border-radius:4px;min-width:fit-content}.command-item span{color:var(--text2);flex:1}.basic-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(350px,1fr));gap:20px}.basic-card.mac-style{background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden;transition:all .3s;box-shadow:var(--shadow-sm)}.basic-card.mac-style:hover{transform:translateY(-3px);box-shadow:var(--shadow-md);border-color:var(--primary)}.mac-card-header{background:var(--surface2);border-bottom:1px solid var(--border);padding:12px 16px;display:flex;align-items:center;gap:12px}.mac-dots{display:flex;gap:6px}.mac-dot{width:12px;height:12px;border-radius:50%;display:block}.mac-dot.red{background:#ff5f57}.mac-dot.yellow{background:#ffbd2e}.mac-dot.green{background:#28c840}.mac-card-title{font-size:1rem;font-weight:700;color:var(--text)}.mac-card-content{padding:16px}.mac-card-content ul{list-style:none}.clickable-item{display:flex;align-items:center;gap:10px;padding:10px 12px;margin:4px 0;border-radius:8px;color:var(--text2);cursor:pointer;transition:all .2s;position:relative}.clickable-item:hover{background:var(--surface2);color:var(--primary);padding-left:16px}.zoom-icon{opacity:0;transition:all .2s;margin-left:auto}.clickable-item:hover .zoom-icon{opacity:.7}.service-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(320px,1fr));gap:20px;margin-bottom:2rem}.service-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px;text-align:center;transition:all .3s}.service-card:hover{transform:translateY(-8px);border-color:var(--primary);box-shadow:var(--shadow-lg)}.service-icon{width:80px;height:80px;margin:0 auto 16px;background:var(--grad);border-radius:20px;color:#fff;display:flex;align-items:center;justify-content:center;box-shadow:var(--shadow-glow)}.service-card h3{font-size:1.3rem;font-weight:800;margin-bottom:8px;color:var(--text)}.service-card p{color:var(--text2);margin-bottom:16px}.tech-tags{display:flex;flex-wrap:wrap;gap:8px;justify-content:center}.tech-tag{padding:4px 12px;background:var(--bg);border:1px solid var(--border);border-radius:999px;font-size:12px;color:var(--text2);transition:all .2s}.tech-tag:hover{border-color:var(--primary);color:var(--primary)}.price-sections{display:flex;flex-direction:column;gap:3rem}.price-section h3{text-align:center;font-size:1.6rem;font-weight:800;margin-bottom:1.5rem;color:var(--text)}.price-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(280px,1fr));gap:20px;max-width:1200px;margin:0 auto}.price-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:20px;text-align:center;transition:all .3s;position:relative;overflow:hidden}.price-card:before{content:"";position:absolute;top:0;left:0;right:0;height:4px;background:var(--grad);opacity:0;transition:opacity .3s}.price-card:hover{transform:translateY(-8px);border-color:var(--primary);box-shadow:var(--shadow-lg)}.price-card:hover:before{opacity:1}.price-card.free{border-color:var(--accent);box-shadow:0 0 20px #0f83}.price-card.dev{border-left:4px solid var(--secondary)}.price-header{margin-bottom:16px}.price-header h4{font-size:1.2rem;font-weight:800;margin-bottom:4px;color:var(--text)}.time{font-size:.9rem;color:var(--text2)}.price-amount{margin:20px 0}.free-text{font-size:2.2rem;font-weight:900;color:var(--accent)}.num{font-size:2.2rem;font-weight:900;color:var(--primary)}.unit{font-size:1rem;color:var(--text2);margin-left:4px}.price-features{list-style:none;text-align:left}.price-features li{display:flex;align-items:center;gap:10px;padding:8px 0;color:var(--text2)}.price-features li svg{color:var(--accent);flex-shrink:0}.contact{padding:4rem 2rem;background:var(--bg2)}.contact-container{max-width:1200px;margin:0 auto}.contact-container h2{text-align:center;font-size:2.2rem;font-weight:900;margin-bottom:2rem;color:var(--text)}.contact-grid{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:20px;margin-bottom:2rem}.contact-card{background:var(--surface);border:1px solid var(--border);border-radius:16px;padding:24px;text-align:center;color:var(--text);transition:all .3s}.contact-card:hover{transform:translateY(-5px);border-color:var(--primary);box-shadow:var(--shadow-lg)}.contact-card svg{color:var(--primary);margin-bottom:12px}.contact-card h3{margin:12px 0 8px;color:var(--text);font-weight:700}.contact-card p{color:var(--text2)}.footer{padding:2rem 1rem;text-align:center;border-top:1px solid var(--border);background:var(--bg)}.footer p{color:var(--text2);margin:8px 0}.mac-overlay{position:fixed;top:0;right:0;bottom:0;left:0;background:#0009;-webkit-backdrop-filter:blur(8px);backdrop-filter:blur(8px);display:flex;align-items:center;justify-content:center;z-index:999;padding:20px}.mac-window{width:min(600px,90vw);background:var(--surface);border:1px solid var(--border);border-radius:12px;overflow:hidden;box-shadow:0 20px 80px #0006}.mac-titlebar{background:var(--surface2);border-bottom:1px solid var(--border);padding:12px 16px;display:flex;align-items:center;position:relative}.mac-buttons{display:flex;gap:8px}.mac-btn{width:12px;height:12px;border-radius:50%;border:none;cursor:pointer;transition:all .2s}.mac-btn.close{background:#ff5f57}.mac-btn.minimize{background:#ffbd2e}.mac-btn.maximize{background:#28c840}.mac-btn:hover{transform:scale(1.1)}.mac-title{position:absolute;left:50%;transform:translate(-50%);font-weight:700;font-size:14px;color:var(--text2)}.mac-content{padding:24px;max-height:400px;overflow-y:auto}.mac-detail-content{color:var(--text);line-height:1.6;font-size:15px}.doc-note{text-align:center;margin-top:1.5rem;color:var(--text3);font-style:italic}::-webkit-scrollbar{width:8px}::-webkit-scrollbar-track{background:var(--bg2)}::-webkit-scrollbar-thumb{background:var(--border);border-radius:4px}::-webkit-scrollbar-thumb:hover{background:var(--primary)}@media (max-width: 768px){.topbar-inner{padding:0 12px}.nav-container{padding:8px 12px}.logo-img{width:40px;height:40px}.brand-texts .brand-name{font-size:14px}.brand-texts .brand-tag{font-size:11px}.section-title{font-size:1.8rem}.hero{min-height:50px;padding:50px 1rem 0}.features,.dev-services,.pricing,.contact{padding:2rem 1rem 3rem}.feature-grid,.basic-grid,.service-grid{grid-template-columns:1fr}.mobile-menu-panel{margin:20px 12px}.menu-item-vertical{padding:14px 16px}.mac-window{width:min(500px,80vw)}}@media (max-width: 480px){.ticker-track{font-size:12px}.views-counter{font-size:11px;width:40px;padding:3px 8px}.menu-item-vertical{padding:12px 14px;font-size:14px}.mac-content{padding:16px}.announcement-icon{font-size:14px}}@keyframes fadeInUp{0%{opacity:0;transform:translateY(20px)}to{opacity:1;transform:translateY(0)}}.feature-card,.service-card,.price-card{animation:fadeInUp .6s ease-out}*:focus-visible{outline:2px solid var(--primary);outline-offset:2px;border-radius:4px}
