{"id":8,"date":"2026-04-22T06:05:17","date_gmt":"2026-04-22T06:05:17","guid":{"rendered":"https:\/\/firesol.fun\/?page_id=8"},"modified":"2026-04-22T06:33:57","modified_gmt":"2026-04-22T06:33:57","slug":"elementor-8","status":"publish","type":"page","link":"https:\/\/firesol.fun\/","title":{"rendered":"Elementor #8"},"content":{"rendered":"\t\t<div data-elementor-type=\"wp-post\" data-elementor-id=\"8\" class=\"elementor elementor-8\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-d6fd897 e-con-full e-flex e-con e-parent\" data-id=\"d6fd897\" data-element_type=\"container\" data-settings=\"{&quot;background_background&quot;:&quot;classic&quot;}\">\n\t\t\t\t<div class=\"elementor-element elementor-element-566e583 elementor-widget elementor-widget-html\" data-id=\"566e583\" data-element_type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t<div class=\"elementor-widget-container\">\n\t\t\t<link href=\"https:\/\/fonts.googleapis.com\/css2?family=Jersey+25&family=Press+Start+2P&display=swap\" rel=\"stylesheet\">\r\n\r\n<div id=\"fire-site-container\">\r\n    \r\n    <div class=\"crt-overlay\"><\/div>\r\n\r\n    <nav class=\"pixel-nav\">\r\n        <div class=\"nav-content\">\r\n            <img decoding=\"async\" src=\"https:\/\/firesol.fun\/wp-content\/uploads\/2026\/04\/Asset-7.png\" alt=\"FIRE Logo\" class=\"nav-logo\">\r\n            <div class=\"nav-status\"><span class=\"blink\">\u25cf<\/span> SYSTEM ONLINE<\/div>\r\n        <\/div>\r\n    <\/nav>\r\n\r\n    <section class=\"hero-section\">\r\n        <video autoplay muted loop playsinline class=\"hero-bg-video\">\r\n            <source src=\"https:\/\/firesol.fun\/wp-content\/uploads\/2026\/04\/FIRE-BG1.mp4\" type=\"video\/mp4\">\r\n        <\/video>\r\n        \r\n        <canvas id=\"ember-canvas\"><\/canvas>\r\n        \r\n        <div class=\"hero-overlay\"><\/div>\r\n        \r\n        <div class=\"hero-content\">\r\n            <div class=\"title-wrapper\">\r\n                <h1 class=\"pixel-title glitch\" data-text=\"IGNITE THE MOMENTUM\">IGNITE THE MOMENTUM<\/h1>\r\n            <\/div>\r\n            \r\n            <div class=\"hero-buttons\">\r\n                <a href=\"#\" class=\"pixel-btn cyber-hover\">TWITTER<\/a>\r\n                <a href=\"#\" class=\"pixel-btn cyber-hover\">TELEGRAM<\/a>\r\n                <a href=\"#\" class=\"pixel-btn cyber-hover\">CHART<\/a>\r\n                <a href=\"#\" class=\"pixel-btn swap-btn glow-hover\">SWAP NOW<\/a>\r\n            <\/div>\r\n            \r\n            <div class=\"ca-container\">\r\n                <button class=\"terminal-btn ca-btn\" onclick=\"copyCA()\">\r\n                    <span class=\"prompt\">CA:\\><\/span> <span id=\"ca-text\">null<\/span> <span class=\"cursor blink\">_<\/span>\r\n                <\/button>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <section class=\"mixed-section\">\r\n        <div class=\"dashboard-wrapper\">\r\n            <div class=\"dashboard-header\">\r\n                <span class=\"dot\"><\/span><span class=\"dot\"><\/span><span class=\"dot\"><\/span>\r\n                <span class=\"header-title\">FIRE_OS \/\/ V.1.0.0<\/span>\r\n            <\/div>\r\n            <div class=\"dashboard-container\">\r\n                \r\n                <div class=\"dashboard-sidebar\">\r\n                    <button class=\"sidebar-link active\" onclick=\"showTab('about')\">[01] ABOUT<\/button>\r\n                    <button class=\"sidebar-link\" onclick=\"showTab('pillars')\">[02] CORE PILLARS<\/button>\r\n                    <button class=\"sidebar-link\" onclick=\"showTab('dynamics')\">[03] DYNAMICS<\/button>\r\n                    <button class=\"sidebar-link\" onclick=\"showTab('ignite')\">[04] HOW TO IGNITE<\/button>\r\n                <\/div>\r\n\r\n                <div class=\"dashboard-content\">\r\n                    \r\n                    <div id=\"tab-about\" class=\"tab-pane active\">\r\n                        <div class=\"about-grid\">\r\n                            <div class=\"visual-frame\">\r\n                                <div class=\"corner-tl\"><\/div><div class=\"corner-tr\"><\/div>\r\n                                <div class=\"corner-bl\"><\/div><div class=\"corner-br\"><\/div>\r\n                                <img decoding=\"async\" src=\"https:\/\/firesol.fun\/wp-content\/uploads\/2026\/04\/FIREICONDEX-ezgif.com-video-to-gif-converter.gif\" alt=\"Fire Anim\" class=\"pixel-img\">\r\n                            <\/div>\r\n                            <div class=\"about-text\">\r\n                                <h2 class=\"section-heading\"><span class=\"highlight\">THE CATALYST<\/span><\/h2>\r\n                                <div class=\"text-block\">\r\n                                    <p class=\"pixel-desc\">A single spark is all it takes to change everything. $FIRE is more than just a project; it is a movement built for those who refuse to stand still.<\/p>\r\n                                    <p class=\"pixel-desc mt-10\">We are the energy that powers the next generation of digital innovation.<\/p>\r\n                                <\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <div id=\"tab-pillars\" class=\"tab-pane\">\r\n                        <h2 class=\"section-heading\"><span class=\"highlight\">FUEL THE FLAME<\/span><\/h2>\r\n                        <div class=\"pillar-grid\">\r\n                            <div class=\"pillar-card\">\r\n                                <div class=\"pillar-num\">01<\/div>\r\n                                <h3>UNSTOPPABLE MOMENTUM<\/h3>\r\n                                <p>Designed to move fast and break boundaries.<\/p>\r\n                            <\/div>\r\n                            <div class=\"pillar-card\">\r\n                                <div class=\"pillar-num\">02<\/div>\r\n                                <h3>BOUNDLESS ENERGY<\/h3>\r\n                                <p>A self-sustaining ecosystem built to scale infinitely.<\/p>\r\n                            <\/div>\r\n                            <div class=\"pillar-card\">\r\n                                <div class=\"pillar-num\">03<\/div>\r\n                                <h3>ABSOLUTE CLARITY<\/h3>\r\n                                <p>Focused on high-end performance and results.<\/p>\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <div id=\"tab-dynamics\" class=\"tab-pane\">\r\n                        <h2 class=\"section-heading\"><span class=\"highlight\">THERMAL DYNAMICS<\/span><\/h2>\r\n                        <div class=\"stats-grid\">\r\n                            <div class=\"stat-card\">\r\n                                <h3>TOTAL REACH<\/h3>\r\n                                <div class=\"stat-value flicker-text\">1,000,000,000<\/div>\r\n                                <div class=\"progress-bar\"><div class=\"progress-fill\" style=\"width: 100%;\"><\/div><\/div>\r\n                            <\/div>\r\n                            <div class=\"stat-card\">\r\n                                <h3>THERMAL TAX<\/h3>\r\n                                <div class=\"stat-value\">0% \/ 0%<\/div>\r\n                                <div class=\"progress-bar\"><div class=\"progress-fill\" style=\"width: 5%;\"><\/div><\/div>\r\n                            <\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n\r\n                    <div id=\"tab-ignite\" class=\"tab-pane\">\r\n                        <h2 class=\"section-heading\"><span class=\"highlight\">HOW TO IGNITE<\/span><\/h2>\r\n                        <div class=\"steps-container\">\r\n                            <div class=\"step-row\"><span class=\"step-num\">STEP.01<\/span> <p>Prepare your digital vault.<\/p><\/div>\r\n                            <div class=\"step-row\"><span class=\"step-num\">STEP.02<\/span> <p>Acquire the fuel (SOL).<\/p><\/div>\r\n                            <div class=\"step-row\"><span class=\"step-num\">STEP.03<\/span> <p>Spark the transaction on the portal.<\/p><\/div>\r\n                            <div class=\"step-row\"><span class=\"step-num\">STEP.04<\/span> <p>Join the movement.<\/p><\/div>\r\n                        <\/div>\r\n                    <\/div>\r\n                <\/div>\r\n            <\/div>\r\n        <\/div>\r\n    <\/section>\r\n\r\n    <footer class=\"pixel-footer\">\r\n        <div class=\"footer-content\">\r\n            <div class=\"footer-logo-area\">\r\n                <p class=\"footer-tag\">$FIRE \u2014 PURE MOMENTUM<\/p>\r\n            <\/div>\r\n            <div class=\"sys-info\">\r\n                <p>STATUS: <span class=\"green\">OPTIMAL<\/span><\/p>\r\n                <p>NETWORK: <span class=\"orange\">SOLANA<\/span><\/p>\r\n            <\/div>\r\n            <div class=\"copyright\">\u00a9 2026 FIRE. ALL RIGHTS RESERVED. \/\/ SYSTEM HALTED.<\/div>\r\n        <\/div>\r\n    <\/footer>\r\n\r\n<\/div>\r\n\r\n<style>\r\n    \/* CSS RESET & VARIABLES *\/\r\n    :root {\r\n        --fire-orange: #ff4d00;\r\n        --fire-yellow: #ffae00;\r\n        --fire-red: #cc0000;\r\n        --black: #050505;\r\n        --pure-black: #000000;\r\n        --white: #f0f0f0;\r\n        --gray: #333333;\r\n        --green: #00ff00;\r\n        \r\n        --pixel-border-white: inset 0 0 0 2px var(--white), 4px 4px 0 0 var(--gray);\r\n        --pixel-border-orange: inset 0 0 0 2px var(--fire-orange), 4px 4px 0 0 var(--fire-red);\r\n    }\r\n\r\n    #fire-site-container {\r\n        background-color: var(--pure-black);\r\n        color: var(--white);\r\n        font-family: 'Press Start 2P', cursive;\r\n        overflow-x: hidden;\r\n        position: relative;\r\n    }\r\n\r\n    \/* CRT SCANLINE & GRAIN EFFECT *\/\r\n    .crt-overlay {\r\n        position: fixed;\r\n        top: 0; left: 0; width: 100vw; height: 100vh;\r\n        background: linear-gradient(rgba(18, 16, 16, 0) 50%, rgba(0, 0, 0, 0.25) 50%), \r\n                    linear-gradient(90deg, rgba(255, 0, 0, 0.06), rgba(0, 255, 0, 0.02), rgba(0, 0, 255, 0.06));\r\n        background-size: 100% 4px, 6px 100%;\r\n        z-index: 999;\r\n        pointer-events: none;\r\n        opacity: 0.8;\r\n    }\r\n    \r\n    .blink { animation: blinker 1s linear infinite; }\r\n    @keyframes blinker { 50% { opacity: 0; } }\r\n\r\n    \/* FONTS & TYPOGRAPHY *\/\r\n    .pixel-title, .section-heading, .sidebar-link, .pixel-btn, .header-title, .stat-value {\r\n        font-family: 'Jersey 25', sans-serif;\r\n        text-transform: uppercase;\r\n        letter-spacing: 2px;\r\n    }\r\n\r\n    \/* NAVIGATION *\/\r\n    .pixel-nav {\r\n        position: absolute; top: 0; width: 100%; z-index: 100;\r\n        background: rgba(0,0,0,0.8);\r\n        border-bottom: 2px solid var(--gray);\r\n        backdrop-filter: blur(4px);\r\n    }\r\n    .nav-content {\r\n        display: flex; justify-content: space-between; align-items: center;\r\n        max-width: 1200px; margin: 0 auto; padding: 15px 20px;\r\n    }\r\n    .nav-logo { height: 45px; image-rendering: pixelated; }\r\n    .nav-status { font-size: 10px; color: var(--fire-orange); }\r\n\r\n    \/* HERO SECTION *\/\r\n    .hero-section {\r\n        position: relative; height: 100vh; width: 100%;\r\n        display: flex; align-items: center; justify-content: center;\r\n        overflow: hidden;\r\n    }\r\n    .hero-bg-video {\r\n        position: absolute; top: 0; left: 0; width: 100%; height: 100%;\r\n        object-fit: cover; z-index: 0; opacity: 0.8;\r\n    }\r\n    #ember-canvas {\r\n        position: absolute; top: 0; left: 0; width: 100%; height: 100%; z-index: 1; pointer-events: none;\r\n    }\r\n    .hero-overlay {\r\n        position: absolute; top: 0; left: 0; width: 100%; height: 100%;\r\n        \/* Overlay gradien: transparan di atas (0%), hitam solid di bawah (100%) *\/\r\n        background: linear-gradient(to bottom, rgba(0,0,0,0) 0%, rgba(0,0,0,1) 100%);\r\n        z-index: 2;\r\n        pointer-events: none; \/* Agar klik tembus jika ada elemen di bawahnya *\/\r\n    }\r\n    .hero-content {\r\n        position: relative; \r\n        z-index: 10; \/* Z-INDEX TINGGI agar konten berada di atas video dan overlay *\/\r\n        width: 100%; text-align: center; padding: 0 20px;\r\n        transform: translateY(40px);\r\n    }\r\n\r\n    \/* GLITCH TITLE *\/\r\n    .title-wrapper { position: relative; display: inline-block; margin-bottom: 30px; }\r\n    .pixel-title {\r\n        font-size: 100px; color: var(--white); margin: 0;\r\n        text-shadow: 4px 4px 0px var(--fire-red), -2px -2px 0px var(--fire-yellow);\r\n        position: relative;\r\n    }\r\n    .glitch::before, .glitch::after {\r\n        content: attr(data-text); position: absolute; top: 0; left: 0; width: 100%; height: 100%;\r\n        background: transparent;\r\n    }\r\n    .glitch::before {\r\n        left: 2px; text-shadow: -2px 0 red; clip: rect(24px, 550px, 90px, 0);\r\n        animation: glitch-anim-2 3s infinite linear alternate-reverse;\r\n    }\r\n    .glitch::after {\r\n        left: -2px; text-shadow: -2px 0 blue; clip: rect(85px, 550px, 140px, 0);\r\n        animation: glitch-anim 2.5s infinite linear alternate-reverse;\r\n    }\r\n    @keyframes glitch-anim {\r\n        0% { clip: rect(10px, 9999px, 86px, 0); }\r\n        20% { clip: rect(61px, 9999px, 14px, 0); }\r\n        40% { clip: rect(98px, 9999px, 52px, 0); }\r\n        60% { clip: rect(27px, 9999px, 7px, 0); }\r\n        80% { clip: rect(50px, 9999px, 81px, 0); }\r\n        100% { clip: rect(92px, 9999px, 20px, 0); }\r\n    }\r\n\r\n    \/* PREMIUM PIXEL BUTTONS *\/\r\n    .hero-buttons { display: flex; justify-content: center; gap: 15px; flex-wrap: wrap; margin-bottom: 30px; }\r\n    .pixel-btn {\r\n        display: inline-block; padding: 12px 24px; font-size: 26px;\r\n        background: var(--pure-black); color: var(--white);\r\n        text-decoration: none; position: relative; cursor: pointer;\r\n        box-shadow: var(--pixel-border-white);\r\n        transition: transform 0.1s, box-shadow 0.1s, color 0.3s;\r\n    }\r\n    .pixel-btn:active { transform: translate(4px, 4px); box-shadow: inset 0 0 0 2px var(--white); }\r\n    \r\n    .cyber-hover:hover { color: var(--fire-yellow); box-shadow: var(--pixel-border-orange); }\r\n    \r\n    .swap-btn { background: var(--fire-orange); color: var(--pure-black); box-shadow: inset 0 0 0 2px var(--pure-black), 4px 4px 0 0 var(--fire-yellow); }\r\n    .swap-btn:hover { background: var(--fire-yellow); }\r\n\r\n    \/* TERMINAL CA BUTTON *\/\r\n    .terminal-btn {\r\n        background: rgba(10,10,10,0.8); border: 2px solid var(--gray);\r\n        padding: 15px 25px; font-family: 'Press Start 2P', cursive;\r\n        color: var(--green); font-size: 12px; cursor: pointer;\r\n        transition: all 0.2s; box-shadow: inset 0 0 20px rgba(0, 255, 0, 0.1);\r\n        display: flex; align-items: center; justify-content: center; gap: 10px; margin: 0 auto;\r\n    }\r\n    .terminal-btn:hover { border-color: var(--green); background: rgba(0,255,0,0.05); }\r\n    .prompt { color: var(--white); opacity: 0.5; }\r\n\r\n    \/* DASHBOARD SECTION (SWISS\/GRID X PIXEL) *\/\r\n    .mixed-section { padding: 100px 20px; background-color: var(--pure-black); position: relative; z-index: 2; }\r\n    .dashboard-wrapper { max-width: 1100px; margin: 0 auto; border: 2px solid var(--gray); background: #0a0a0a; box-shadow: 10px 10px 0 0 #111; }\r\n    .dashboard-header { background: var(--gray); padding: 10px 15px; display: flex; align-items: center; gap: 8px; border-bottom: 2px solid var(--gray); }\r\n    .dot { width: 10px; height: 10px; background: #555; display: inline-block; }\r\n    .dot:nth-child(1) { background: var(--fire-red); }\r\n    .dot:nth-child(2) { background: var(--fire-yellow); }\r\n    .dot:nth-child(3) { background: var(--green); }\r\n    .header-title { margin-left: auto; font-size: 20px; color: var(--white); }\r\n\r\n    .dashboard-container { display: grid; grid-template-columns: 280px 1fr; min-height: 550px; }\r\n    \r\n    \/* SIDEBAR *\/\r\n    .dashboard-sidebar { border-right: 2px solid var(--gray); background: rgba(0,0,0,0.5); display: flex; flex-direction: column; }\r\n    .sidebar-link {\r\n        background: transparent; border: none; border-bottom: 2px solid #1a1a1a;\r\n        color: #888; padding: 25px 20px; text-align: left; font-size: 26px; cursor: pointer; transition: 0.2s;\r\n        font-family: 'Jersey 25', sans-serif;\r\n    }\r\n    .sidebar-link:hover { color: var(--white); background: rgba(255, 77, 0, 0.1); padding-left: 30px; }\r\n    .sidebar-link.active {\r\n        background: var(--fire-orange); color: var(--pure-black);\r\n        border-left: 8px solid var(--fire-yellow); padding-left: 20px;\r\n    }\r\n\r\n    \/* CONTENT AREA *\/\r\n    .dashboard-content { padding: 50px; position: relative; background: radial-gradient(circle at top right, #111 0%, #050505 100%); }\r\n    .tab-pane { display: none; animation: scanlineReveal 0.4s cubic-bezier(0.1, 0.8, 0.1, 1); }\r\n    .tab-pane.active { display: block; }\r\n    \r\n    @keyframes scanlineReveal {\r\n        0% { opacity: 0; clip-path: polygon(0 0, 100% 0, 100% 0, 0 0); transform: translateY(10px); }\r\n        100% { opacity: 1; clip-path: polygon(0 0, 100% 0, 100% 100%, 0 100%); transform: translateY(0); }\r\n    }\r\n\r\n    .section-heading { font-size: 45px; color: var(--white); margin-bottom: 40px; border-bottom: 2px solid var(--gray); padding-bottom: 10px; }\r\n    .highlight { color: var(--fire-orange); text-shadow: 2px 2px 0px var(--fire-red); }\r\n\r\n    \/* ABOUT TAB *\/\r\n    .about-grid { display: grid; grid-template-columns: 1fr 1.5fr; gap: 40px; align-items: center; }\r\n    .visual-frame { position: relative; padding: 10px; border: 1px solid #333; background: #000; }\r\n    .corner-tl, .corner-tr, .corner-bl, .corner-br { position: absolute; width: 10px; height: 10px; border: 2px solid var(--fire-orange); }\r\n    .corner-tl { top: -2px; left: -2px; border-right: none; border-bottom: none; }\r\n    .corner-tr { top: -2px; right: -2px; border-left: none; border-bottom: none; }\r\n    .corner-bl { bottom: -2px; left: -2px; border-right: none; border-top: none; }\r\n    .corner-br { bottom: -2px; right: -2px; border-left: none; border-top: none; }\r\n    \r\n    .pixel-img { width: 100%; image-rendering: pixelated; filter: grayscale(20%) contrast(120%); }\r\n    .text-block { background: rgba(255, 77, 0, 0.05); padding: 25px; border-left: 4px solid var(--fire-orange); }\r\n    .pixel-desc { font-size: 11px; line-height: 2; color: #ccc; }\r\n    .mt-10 { margin-top: 15px; }\r\n\r\n    \/* PILLARS TAB *\/\r\n    .pillar-grid { display: flex; flex-direction: column; gap: 20px; }\r\n    .pillar-card {\r\n        background: #0f0f0f; border: 2px solid #222; padding: 25px;\r\n        display: flex; align-items: center; gap: 25px; transition: 0.2s;\r\n    }\r\n    .pillar-card:hover { border-color: var(--fire-orange); transform: translateX(10px); }\r\n    .pillar-num { font-size: 30px; font-family: 'Jersey 25'; color: var(--gray); }\r\n    .pillar-card:hover .pillar-num { color: var(--fire-orange); }\r\n    .pillar-card h3 { font-family: 'Jersey 25'; font-size: 28px; margin: 0 0 5px 0; color: var(--white); }\r\n    .pillar-card p { font-size: 10px; color: #888; margin: 0; line-height: 1.5; }\r\n\r\n    \/* DYNAMICS TAB *\/\r\n    .stats-grid { display: grid; grid-template-columns: 1fr 1fr; gap: 30px; }\r\n    .stat-card { background: #000; border: 2px dashed #333; padding: 30px; text-align: center; }\r\n    .stat-card h3 { font-family: 'Jersey 25'; font-size: 24px; color: #666; margin-bottom: 15px; }\r\n    .stat-value { font-size: 50px; color: var(--fire-orange); text-shadow: 0 0 10px rgba(255,77,0,0.5); margin-bottom: 20px; }\r\n    .progress-bar { width: 100%; height: 8px; background: #222; }\r\n    .progress-fill { height: 100%; background: var(--fire-orange); box-shadow: 0 0 10px var(--fire-red); }\r\n\r\n    \/* IGNITE TAB *\/\r\n    .steps-container { border-left: 2px solid #333; padding-left: 30px; margin-left: 10px; }\r\n    .step-row { position: relative; margin-bottom: 35px; }\r\n    .step-row::before {\r\n        content: ''; position: absolute; left: -36px; top: 0;\r\n        width: 10px; height: 10px; background: var(--pure-black); border: 2px solid var(--fire-orange);\r\n    }\r\n    .step-row:hover::before { background: var(--fire-orange); box-shadow: 0 0 10px var(--fire-yellow); }\r\n    .step-num { font-family: 'Jersey 25'; font-size: 20px; color: var(--fire-orange); display: block; margin-bottom: 5px; }\r\n    .step-row p { font-size: 11px; color: #aaa; margin: 0; line-height: 1.6; }\r\n\r\n    \/* FOOTER *\/\r\n    .pixel-footer {\r\n        padding: 40px 20px; background: #000; border-top: 2px solid #222;\r\n        position: relative; z-index: 2;\r\n    }\r\n    .footer-content { max-width: 1100px; margin: 0 auto; display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap; gap: 20px; }\r\n    .footer-tag { font-family: 'Jersey 25'; font-size: 30px; color: var(--gray); margin: 0; }\r\n    .sys-info { font-size: 10px; line-height: 1.8; text-align: right; }\r\n    .green { color: var(--green); }\r\n    .orange { color: var(--fire-orange); }\r\n    .copyright { width: 100%; text-align: center; font-size: 9px; color: #444; margin-top: 20px; border-top: 1px dashed #222; padding-top: 20px; }\r\n\r\n    \/* RESPONSIVE *\/\r\n    @media (max-width: 900px) {\r\n        .pixel-title { font-size: 60px; }\r\n        .dashboard-container { grid-template-columns: 1fr; }\r\n        .dashboard-sidebar { flex-direction: row; flex-wrap: nowrap; overflow-x: auto; border-right: none; border-bottom: 2px solid var(--gray); }\r\n        .sidebar-link { font-size: 20px; padding: 15px; white-space: nowrap; border-bottom: none; }\r\n        .sidebar-link.active { border-left: none; border-bottom: 4px solid var(--fire-yellow); padding-left: 15px; }\r\n        .about-grid, .stats-grid { grid-template-columns: 1fr; }\r\n        .dashboard-content { padding: 30px 20px; }\r\n        .footer-content { flex-direction: column; text-align: center; }\r\n        .sys-info { text-align: center; }\r\n    }\r\n<\/style>\r\n\r\n<script>\r\n    \/\/ TABS LOGIC\r\n    function showTab(tabId) {\r\n        const panes = document.querySelectorAll('.tab-pane');\r\n        panes.forEach(p => p.classList.remove('active'));\r\n        \r\n        const buttons = document.querySelectorAll('.sidebar-link');\r\n        buttons.forEach(b => b.classList.remove('active'));\r\n        \r\n        document.getElementById('tab-' + tabId).classList.add('active');\r\n        event.currentTarget.classList.add('active');\r\n        \r\n        document.querySelector('.dashboard-content').style.opacity = '0.8';\r\n        setTimeout(() => { document.querySelector('.dashboard-content').style.opacity = '1'; }, 50);\r\n    }\r\n\r\n    \/\/ COPY CA TERMINAL LOGIC\r\n    function copyCA() {\r\n        const caText = \"0xFIRE_IGNITE_THE_FUTURE_MOMENTUM_2026\";\r\n        navigator.clipboard.writeText(caText);\r\n        \r\n        const displaySpan = document.getElementById('ca-text');\r\n        const promptSpan = document.querySelector('.prompt');\r\n        \r\n        displaySpan.innerText = \"DATA_COPIED_TO_CLIPBOARD\";\r\n        displaySpan.style.color = \"var(--green)\";\r\n        promptSpan.innerText = \"SYS:\\\\>\";\r\n        \r\n        setTimeout(() => {\r\n            displaySpan.innerText = caText;\r\n            displaySpan.style.color = \"inherit\";\r\n            promptSpan.innerText = \"C:\\\\>\";\r\n        }, 2500);\r\n    }\r\n\r\n    \/\/ PIXEL FIRE PARTICLES LOGIC (CANVAS)\r\n    const canvas = document.getElementById('ember-canvas');\r\n    const ctx = canvas.getContext('2d');\r\n    \r\n    let particlesArray = [];\r\n    \r\n    function resizeCanvas() {\r\n        canvas.width = window.innerWidth;\r\n        canvas.height = window.innerHeight;\r\n    }\r\n    window.addEventListener('resize', resizeCanvas);\r\n    resizeCanvas();\r\n\r\n    class Particle {\r\n        constructor() {\r\n            this.x = Math.random() * canvas.width;\r\n            this.y = canvas.height + Math.random() * 100;\r\n            this.size = Math.random() * 4 + 2; \r\n            this.speedY = Math.random() * -3 - 1; \r\n            this.speedX = Math.random() * 2 - 1; \r\n            this.color = Math.random() > 0.5 ? '#ff4d00' : '#ffae00';\r\n            this.opacity = Math.random() * 0.8 + 0.2;\r\n        }\r\n        update() {\r\n            this.y += this.speedY;\r\n            this.x += this.speedX;\r\n            if (this.y < 0) {\r\n                this.y = canvas.height;\r\n                this.x = Math.random() * canvas.width;\r\n            }\r\n        }\r\n        draw() {\r\n            ctx.fillStyle = this.color;\r\n            ctx.globalAlpha = this.opacity;\r\n            ctx.fillRect(this.x, this.y, this.size, this.size);\r\n        }\r\n    }\r\n\r\n    function initParticles() {\r\n        particlesArray = [];\r\n        let numParticles = window.innerWidth < 768 ? 30 : 70;\r\n        for (let i = 0; i < numParticles; i++) {\r\n            particlesArray.push(new Particle());\r\n        }\r\n    }\r\n\r\n    function animateParticles() {\r\n        ctx.clearRect(0, 0, canvas.width, canvas.height);\r\n        for (let i = 0; i < particlesArray.length; i++) {\r\n            particlesArray[i].update();\r\n            particlesArray[i].draw();\r\n        }\r\n        requestAnimationFrame(animateParticles);\r\n    }\r\n\r\n    initParticles();\r\n    animateParticles();\r\n<\/script>\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t","protected":false},"excerpt":{"rendered":"<p>\u25cf SYSTEM ONLINE IGNITE THE MOMENTUM TWITTER TELEGRAM CHART SWAP NOW CA:> null _ FIRE_OS \/\/ V.1.0.0 [01] ABOUT [02] CORE PILLARS [03] DYNAMICS [04] HOW TO IGNITE THE CATALYST A single spark is all it takes to change everything. $FIRE is more than just a project; it is a movement built for those who [&hellip;]<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"elementor_canvas","meta":{"footnotes":""},"class_list":["post-8","page","type-page","status-publish","hentry"],"_links":{"self":[{"href":"https:\/\/firesol.fun\/index.php\/wp-json\/wp\/v2\/pages\/8","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/firesol.fun\/index.php\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/firesol.fun\/index.php\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/firesol.fun\/index.php\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/firesol.fun\/index.php\/wp-json\/wp\/v2\/comments?post=8"}],"version-history":[{"count":7,"href":"https:\/\/firesol.fun\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions"}],"predecessor-version":[{"id":25,"href":"https:\/\/firesol.fun\/index.php\/wp-json\/wp\/v2\/pages\/8\/revisions\/25"}],"wp:attachment":[{"href":"https:\/\/firesol.fun\/index.php\/wp-json\/wp\/v2\/media?parent=8"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}