{
    "id": 571,
    "date": "2025-06-15T03:00:42",
    "date_gmt": "2025-06-15T03:00:42",
    "guid": {
        "rendered": "https:\/\/firerant.com.au\/?page_id=571"
    },
    "modified": "2026-06-28T12:24:24",
    "modified_gmt": "2026-06-28T12:24:24",
    "slug": "app",
    "status": "publish",
    "type": "page",
    "link": "https:\/\/firerant.com.au\/zh\/?page_id=571",
    "title": {
        "rendered": "APP"
    },
    "content": {
        "rendered": "<div data-elementor-type=\"wp-page\" data-elementor-id=\"571\" class=\"elementor elementor-571\" data-elementor-post-type=\"page\">\n\t\t\t\t<div class=\"elementor-element elementor-element-6ce724d e-con-full e-flex e-con e-parent\" data-id=\"6ce724d\" data-element_type=\"container\" data-e-type=\"container\">\n\t\t\t\t<div class=\"elementor-element elementor-element-3131929 elementor-widget elementor-widget-html\" data-id=\"3131929\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!-- ============================================\r\n     FIRE RANT \u2014 APP PAGE HERO\r\n     Desktop: Original layout (unchanged)\r\n     Mobile: Curated layout \u2014 scroll strip fixed\r\n     Paste into Elementor HTML widget\r\n============================================ -->\r\n<style>\r\n.fr-apphero-wrapper {\r\n  font-family: Inter, -apple-system, sans-serif;\r\n  position: relative;\r\n  min-height: 100vh;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  overflow: hidden;\r\n}\r\n.fr-apphero-image {\r\n  position: absolute;\r\n  inset: 0;\r\n  background-image: url('https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Untitled-design-2026-06-24T013817.446-scaled.png');\r\n  background-size: cover;\r\n  background-position: center center;\r\n  background-repeat: no-repeat;\r\n  z-index: 0;\r\n}\r\n.fr-apphero-wrapper::before {\r\n  content: '';\r\n  position: absolute;\r\n  inset: 0;\r\n  background:\r\n    linear-gradient(180deg, rgba(0,0,0,0.18) 0%, rgba(0,0,0,0.35) 45%, rgba(20,0,0,0.65) 100%);\r\n  z-index: 1;\r\n}\r\n\r\n\/* NAV *\/\r\n.fr-apphero-nav {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  z-index: 10;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: space-between;\r\n  padding: 18px 40px;\r\n  background: transparent;\r\n}\r\n.fr-apphero-nav-logo img {\r\n  height: 45px;\r\n  width: auto;\r\n}\r\n.fr-apphero-nav-links {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 2rem;\r\n  list-style: none;\r\n  margin: 0;\r\n  padding: 0;\r\n}\r\n.fr-apphero-nav-links li a {\r\n  color: rgba(255,255,255,0.8);\r\n  text-decoration: none;\r\n  font-size: 0.85rem;\r\n  font-weight: 600;\r\n  letter-spacing: 2px;\r\n  text-transform: uppercase;\r\n  transition: color 0.3s;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 0.4rem;\r\n}\r\n.fr-apphero-nav-links li a:hover { color: #ff3b3b; }\r\n.fr-apphero-nav-links li.active a { color: #ff3b3b; }\r\n.fr-apphero-nav-links li a i { font-size: 0.9rem; }\r\n.fr-apphero-nav-links li.fr-apphero-cta a {\r\n  background: #ff3b3b;\r\n  color: #fff;\r\n  padding: 10px 26px;\r\n  border-radius: 980px;\r\n  letter-spacing: 0.5px;\r\n  font-weight: 500;\r\n  font-size: 0.82rem;\r\n  transition: background 0.3s, transform 0.2s, box-shadow 0.3s;\r\n  box-shadow: 0 2px 10px rgba(255,59,59,0.25);\r\n}\r\n.fr-apphero-nav-links li.fr-apphero-cta a:hover {\r\n  background: #e62e2e;\r\n  transform: scale(1.04);\r\n  box-shadow: 0 4px 16px rgba(255,59,59,0.4);\r\n  color: #fff;\r\n}\r\n\r\n\/* Mobile toggle *\/\r\n.fr-apphero-toggle {\r\n  display: none;\r\n  flex-direction: column;\r\n  gap: 5px;\r\n  cursor: pointer;\r\n  padding: 5px;\r\n}\r\n.fr-apphero-toggle span {\r\n  width: 25px;\r\n  height: 2px;\r\n  background: #fff;\r\n  border-radius: 2px;\r\n  transition: 0.3s;\r\n}\r\n\r\n\/* HERO CONTENT *\/\r\n.fr-apphero-content {\r\n  position: relative;\r\n  z-index: 2;\r\n  text-align: center;\r\n  padding: 2rem;\r\n}\r\n.fr-apphero-content .fr-apphero-label {\r\n  color: #ff3b3b;\r\n  font-size: 0.85rem;\r\n  letter-spacing: 3px;\r\n  text-transform: uppercase;\r\n  font-weight: 700;\r\n  margin: 0 0 1.2rem;\r\n}\r\n.fr-apphero-content .fr-apphero-line-small {\r\n  font-size: clamp(1.2rem, 3vw, 1.8rem);\r\n  font-weight: 700;\r\n  color: rgba(255,255,255,0.85);\r\n  margin: 0 0 0.5rem;\r\n  letter-spacing: 1px;\r\n}\r\n.fr-apphero-content .fr-apphero-line-large {\r\n  font-size: clamp(2.2rem, 7vw, 4.2rem);\r\n  font-weight: 900;\r\n  color: #fff;\r\n  margin: 0 0 0.5rem;\r\n  line-height: 1.15;\r\n  white-space: nowrap;\r\n}\r\n.fr-apphero-content .fr-apphero-line-red {\r\n  font-size: clamp(1.2rem, 3vw, 1.8rem);\r\n  font-weight: 700;\r\n  color: #ff3b3b;\r\n  margin: 0 0 1.5rem;\r\n  letter-spacing: 1px;\r\n}\r\n.fr-apphero-content .fr-apphero-desc {\r\n  color: rgba(255,255,255,0.7);\r\n  font-size: 1.05rem;\r\n  line-height: 1.8;\r\n  max-width: 650px;\r\n  margin: 0 auto 2.5rem;\r\n}\r\n.fr-apphero-buttons {\r\n  display: flex;\r\n  gap: 1rem;\r\n  justify-content: center;\r\n  flex-wrap: wrap;\r\n}\r\n.fr-apphero-btn-p {\r\n  display: inline-block;\r\n  padding: 14px 36px;\r\n  background: #ff3b3b;\r\n  color: #fff;\r\n  text-decoration: none;\r\n  font-weight: 600;\r\n  font-size: 0.88rem;\r\n  letter-spacing: 0.5px;\r\n  text-transform: uppercase;\r\n  border-radius: 980px;\r\n  transition: background 0.3s, transform 0.2s, box-shadow 0.3s;\r\n  box-shadow: 0 2px 10px rgba(255,59,59,0.25);\r\n}\r\n.fr-apphero-btn-p:hover {\r\n  background: #e62e2e;\r\n  transform: scale(1.04);\r\n  box-shadow: 0 4px 16px rgba(255,59,59,0.4);\r\n  color: #fff;\r\n}\r\n.fr-apphero-btn-o {\r\n  display: inline-block;\r\n  padding: 14px 36px;\r\n  background: transparent;\r\n  color: #fff;\r\n  text-decoration: none;\r\n  font-weight: 600;\r\n  font-size: 0.88rem;\r\n  letter-spacing: 0.5px;\r\n  text-transform: uppercase;\r\n  border-radius: 980px;\r\n  border: 2px solid rgba(255,255,255,0.35);\r\n  transition: border-color 0.3s, color 0.3s, transform 0.2s;\r\n}\r\n.fr-apphero-btn-o:hover {\r\n  border-color: #ff3b3b;\r\n  color: #ff3b3b;\r\n  transform: scale(1.04);\r\n}\r\n\r\n\/* ===== STATS CARDS \u2014 BOTTOM OVERLAY ===== *\/\r\n.fr-apphero-stats {\r\n  position: absolute;\r\n  bottom: 30px;\r\n  left: 0;\r\n  right: 0;\r\n  z-index: 5;\r\n  padding: 0 40px;\r\n}\r\n.fr-apphero-stats-grid {\r\n  display: grid;\r\n  grid-template-columns: repeat(4, 1fr);\r\n  gap: 1rem;\r\n  max-width: 1100px;\r\n  margin: 0 auto;\r\n}\r\n.fr-apphero-stat {\r\n  background: rgba(10,10,10,0.6);\r\n  backdrop-filter: blur(14px);\r\n  -webkit-backdrop-filter: blur(14px);\r\n  border: 1px solid rgba(255,59,59,0.12);\r\n  border-radius: 14px;\r\n  padding: 20px 16px;\r\n  text-align: center;\r\n  transition: border-color 0.3s, transform 0.3s;\r\n}\r\n.fr-apphero-stat:hover {\r\n  border-color: rgba(255,59,59,0.35);\r\n  transform: translateY(-3px);\r\n}\r\n.fr-apphero-stat-num {\r\n  font-size: clamp(1.6rem, 3.5vw, 2.2rem);\r\n  font-weight: 900;\r\n  color: #ff3b3b;\r\n  margin: 0 0 0.4rem;\r\n  line-height: 1;\r\n}\r\n.fr-apphero-stat-lbl {\r\n  font-size: 0.72rem;\r\n  color: rgba(255,255,255,0.6);\r\n  text-transform: uppercase;\r\n  letter-spacing: 1px;\r\n  line-height: 1.4;\r\n  margin: 0;\r\n}\r\n.fr-apphero-stat-src {\r\n  font-size: 0.6rem;\r\n  color: rgba(255,255,255,0.25);\r\n  margin-top: 0.4rem;\r\n  font-style: italic;\r\n}\r\n\r\n\/* ===== MOBILE \u2014 COMPLETELY DIFFERENT LAYOUT ===== *\/\r\n@media (max-width: 768px) {\r\n  .fr-apphero-wrapper {\r\n    min-height: auto;\r\n    flex-direction: column;\r\n    align-items: stretch;\r\n  }\r\n\r\n  .fr-apphero-wrapper::before {\r\n    background: linear-gradient(180deg, rgba(0,0,0,0.4) 0%, rgba(0,0,0,0.85) 60%, rgba(0,0,0,0.95) 100%);\r\n  }\r\n\r\n  \/* Nav \u2014 minimal *\/\r\n  .fr-apphero-nav {\r\n    padding: 14px 20px;\r\n    flex-wrap: wrap;\r\n  }\r\n\r\n  .fr-apphero-nav-logo img {\r\n    height: 32px;\r\n  }\r\n\r\n  .fr-apphero-toggle {\r\n    display: flex;\r\n  }\r\n\r\n  .fr-apphero-nav-links {\r\n    display: none;\r\n    flex-direction: column;\r\n    width: 100%;\r\n    gap: 0;\r\n    margin-top: 12px;\r\n    background: rgba(0,0,0,0.95);\r\n    border-radius: 16px;\r\n    padding: 16px 20px;\r\n    border: 1px solid rgba(255,59,59,0.1);\r\n  }\r\n\r\n  .fr-apphero-nav-links.active {\r\n    display: flex;\r\n  }\r\n\r\n  .fr-apphero-nav-links li {\r\n    width: 100%;\r\n  }\r\n\r\n  .fr-apphero-nav-links li a {\r\n    padding: 12px 0;\r\n    font-size: 0.82rem;\r\n    border-bottom: 1px solid rgba(255,255,255,0.05);\r\n    width: 100%;\r\n  }\r\n\r\n  .fr-apphero-nav-links li:last-child a {\r\n    border-bottom: none;\r\n  }\r\n\r\n  .fr-apphero-nav-links li.fr-apphero-cta {\r\n    margin-top: 8px;\r\n  }\r\n\r\n  .fr-apphero-nav-links li.fr-apphero-cta a {\r\n    justify-content: center;\r\n    border-bottom: none;\r\n  }\r\n\r\n  \/* Hero content \u2014 mobile curated *\/\r\n  .fr-apphero-content {\r\n    padding: 100px 24px 40px;\r\n    text-align: left;\r\n  }\r\n\r\n  .fr-apphero-content .fr-apphero-label {\r\n    font-size: 0.68rem;\r\n    letter-spacing: 2.5px;\r\n    margin-bottom: 1rem;\r\n  }\r\n\r\n  .fr-apphero-content .fr-apphero-line-small {\r\n    font-size: 0.85rem;\r\n    letter-spacing: 0.5px;\r\n    margin-bottom: 0.4rem;\r\n  }\r\n\r\n  .fr-apphero-content .fr-apphero-line-large {\r\n    white-space: normal;\r\n    font-size: 1.75rem;\r\n    line-height: 1.2;\r\n    margin-bottom: 0.6rem;\r\n  }\r\n\r\n  .fr-apphero-content .fr-apphero-line-red {\r\n    font-size: 0.8rem;\r\n    letter-spacing: 1px;\r\n    margin-bottom: 1.2rem;\r\n  }\r\n\r\n  .fr-apphero-content .fr-apphero-desc {\r\n    font-size: 0.85rem;\r\n    line-height: 1.7;\r\n    margin-bottom: 1.8rem;\r\n    color: rgba(255,255,255,0.6);\r\n  }\r\n\r\n  \/* Buttons \u2014 stacked, full width *\/\r\n  .fr-apphero-buttons {\r\n    flex-direction: column;\r\n    align-items: stretch;\r\n    gap: 10px;\r\n  }\r\n\r\n  .fr-apphero-btn-p,\r\n  .fr-apphero-btn-o {\r\n    padding: 14px 24px;\r\n    font-size: 0.8rem;\r\n    text-align: center;\r\n    width: 100%;\r\n    box-sizing: border-box;\r\n  }\r\n\r\n  \/* Stats \u2014 horizontal scroll strip (FIXED CLIPPING) *\/\r\n  .fr-apphero-stats {\r\n    position: relative;\r\n    bottom: auto;\r\n    padding: 24px 0 30px;\r\n    overflow-x: auto;\r\n    overflow-y: hidden;\r\n    -webkit-overflow-scrolling: touch;\r\n    scrollbar-width: none;\r\n  }\r\n\r\n  .fr-apphero-stats::-webkit-scrollbar {\r\n    display: none;\r\n  }\r\n\r\n  .fr-apphero-stats-grid {\r\n    display: flex;\r\n    gap: 10px;\r\n    padding: 0 24px;\r\n    width: max-content;\r\n  }\r\n\r\n  .fr-apphero-stats-grid::after {\r\n    content: '';\r\n    min-width: 24px;\r\n    flex-shrink: 0;\r\n  }\r\n\r\n  .fr-apphero-stat {\r\n    min-width: 140px;\r\n    padding: 16px 14px;\r\n    border-radius: 12px;\r\n    flex-shrink: 0;\r\n  }\r\n\r\n  .fr-apphero-stat-num {\r\n    font-size: 1.5rem;\r\n  }\r\n\r\n  .fr-apphero-stat-lbl {\r\n    font-size: 0.6rem;\r\n    letter-spacing: 0.5px;\r\n  }\r\n\r\n  .fr-apphero-stat-src {\r\n    font-size: 0.52rem;\r\n  }\r\n}\r\n\r\n@media (max-width: 380px) {\r\n  .fr-apphero-content {\r\n    padding: 90px 18px 30px;\r\n  }\r\n\r\n  .fr-apphero-content .fr-apphero-line-large {\r\n    font-size: 1.5rem;\r\n  }\r\n\r\n  .fr-apphero-stat {\r\n    min-width: 125px;\r\n    padding: 14px 10px;\r\n  }\r\n\r\n  .fr-apphero-stat-num {\r\n    font-size: 1.3rem;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<div class=\"fr-apphero-wrapper\">\r\n  <!-- Image Background -->\r\n  <div class=\"fr-apphero-image\"><\/div>\r\n\r\n  <!-- Navigation -->\r\n  <nav class=\"fr-apphero-nav\">\r\n    <a href=\"https:\/\/firerant.com.au\/zh\/\" class=\"fr-apphero-nav-logo\">\r\n      <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/FR-logo-scaled.png\" alt=\"Fire Rant Logo\">\r\n    <\/a>\r\n    <div class=\"fr-apphero-toggle\" onclick=\"this.nextElementSibling.classList.toggle('active')\">\r\n      <span><\/span>\r\n      <span><\/span>\r\n      <span><\/span>\r\n    <\/div>\r\n    <ul class=\"fr-apphero-nav-links\">\r\n      <li><a href=\"https:\/\/firerant.com.au\/zh\/?page_id=573\"><i class=\"eicon-map-pin\"><\/i> \u5730\u56fe<\/a><\/li>\r\n      <li class=\"active\"><a href=\"https:\/\/firerant.com.au\/zh\/?page_id=571\"><i class=\"eicon-device-mobile\"><\/i> \u5e94\u7528<\/a><\/li>\r\n      <li><a href=\"https:\/\/firerant.com.au\/zh\/?page_id=392\"><i class=\"eicon-info-circle-o\"><\/i> \u5173\u4e8e<\/a><\/li>\r\n      <li><a href=\"https:\/\/firerant.com.au\/zh\/?page_id=575\"><i class=\"eicon-cart\"><\/i> \u5546\u5e97<\/a><\/li>\r\n      <li><a href=\"https:\/\/firerant.com.au\/zh\/?page_id=577\"><i class=\"eicon-basket-light\"><\/i> \u8d2d\u7269\u8f66<\/a><\/li>\r\n      <li class=\"fr-apphero-cta\"><a href=\"https:\/\/firerant.com.au\/zh\/?page_id=571\"><i class=\"eicon-download-bold\"><\/i> \u83b7\u53d6\u5e94\u7528<\/a><\/li>\r\n    <\/ul>\r\n  <\/nav>\r\n\r\n  <!-- Hero Content -->\r\n  <div class=\"fr-apphero-content\">\r\n    <p class=\"fr-apphero-label\">The App<\/p>\r\n    <p class=\"fr-apphero-line-small\">PHOTOGRAPH. IDENTIFY. REPORT.<\/p>\r\n    <h1 class=\"fr-apphero-line-large\">CITIZEN BIOSECURITY IN YOUR POCKET.<\/h1>\r\n    <p class=\"fr-apphero-line-red\">AI-POWERED. GEO-TAGGED. GAMIFIED.<\/p>\r\n    <p class=\"fr-apphero-desc\">Fire Rant turns every smartphone into a surveillance tool \u2014 real-time nest identification, evidence-grade reporting, and community-driven engagement in a single platform.<\/p>\r\n    <div class=\"fr-apphero-buttons\">\r\n      <a href=\"#\" class=\"fr-apphero-btn-p\">Download for iOS<\/a>\r\n      <a href=\"#features\" class=\"fr-apphero-btn-o\">Explore Features<\/a>\r\n    <\/div>\r\n  <\/div>\r\n\r\n  <!-- Stats Cards \u2014 Bottom -->\r\n  <div class=\"fr-apphero-stats\">\r\n    <div class=\"fr-apphero-stats-grid\">\r\n\r\n      <div class=\"fr-apphero-stat\">\r\n        <p class=\"fr-apphero-stat-num\">85%+<\/p>\r\n        <p class=\"fr-apphero-stat-lbl\">AI confidence score<\/p>\r\n        <p class=\"fr-apphero-stat-src\">Computer vision model<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"fr-apphero-stat\">\r\n        <p class=\"fr-apphero-stat-num\">20K+<\/p>\r\n        <p class=\"fr-apphero-stat-lbl\">Training images from iNaturalist<\/p>\r\n        <p class=\"fr-apphero-stat-src\">Verified S. invicta data<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"fr-apphero-stat\">\r\n        <p class=\"fr-apphero-stat-num\">60s<\/p>\r\n        <p class=\"fr-apphero-stat-lbl\">Nest identification speed<\/p>\r\n        <p class=\"fr-apphero-stat-src\">Real-time inference<\/p>\r\n      <\/div>\r\n\r\n      <div class=\"fr-apphero-stat\">\r\n        <p class=\"fr-apphero-stat-num\">99%<\/p>\r\n        <p class=\"fr-apphero-stat-lbl\">Biosecurity alerts from citizens<\/p>\r\n        <p class=\"fr-apphero-stat-src\">National data, 2026<\/p>\r\n      <\/div>\r\n\r\n    <\/div>\r\n  <\/div>\r\n\r\n<\/div>\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-bdd5736 elementor-widget elementor-widget-html\" data-id=\"bdd5736\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!-- ============================================\r\n     FIRE RANT \u2014 APP PAGE: INTRODUCTION\r\n     2 columns: Info left, Auto-playing iPhone Demo right\r\n     Cycles through all screens with overlayed info\r\n     Paste into Elementor HTML widget\r\n============================================ -->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<style>\r\n.fr-appintro {\r\n  background: #0a0a0a;\r\n  padding: 80px 40px;\r\n  font-family: Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n}\r\n\r\n.fr-appintro-grid {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 4rem;\r\n  max-width: 1200px;\r\n  margin: 0 auto;\r\n  align-items: center;\r\n}\r\n\r\n\/* LEFT COLUMN \u2014 INFO *\/\r\n.fr-appintro-text .fr-label {\r\n  color: #ff3b3b;\r\n  font-size: 0.8rem;\r\n  letter-spacing: 3px;\r\n  text-transform: uppercase;\r\n  margin-bottom: 0.5rem;\r\n}\r\n\r\n.fr-appintro-text h2 {\r\n  color: #fff;\r\n  font-size: 2.2rem;\r\n  font-weight: 800;\r\n  margin: 0 0 1.5rem;\r\n}\r\n\r\n.fr-appintro-divider {\r\n  width: 60px;\r\n  height: 3px;\r\n  background: #ff3b3b;\r\n  margin: 0 0 1.5rem;\r\n}\r\n\r\n.fr-appintro-text p {\r\n  color: rgba(255,255,255,0.75);\r\n  font-size: 1rem;\r\n  line-height: 1.85;\r\n  margin-bottom: 1.5rem;\r\n}\r\n\r\n.fr-appintro-text .fr-tagline {\r\n  color: #ff3b3b;\r\n  font-weight: 700;\r\n  font-size: 1.1rem;\r\n  margin-top: 1.5rem;\r\n  letter-spacing: 1px;\r\n}\r\n\r\n.fr-appintro-highlights {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0 0 24px;\r\n}\r\n\r\n.fr-appintro-highlights li {\r\n  display: flex;\r\n  align-items: flex-start;\r\n  gap: 12px;\r\n  padding: 10px 0;\r\n  border-bottom: 1px solid rgba(255,255,255,0.04);\r\n  color: rgba(255,255,255,0.75);\r\n  font-size: 0.92rem;\r\n  line-height: 1.6;\r\n}\r\n\r\n.fr-appintro-highlights li:last-child { border-bottom: none; }\r\n\r\n.fr-appintro-highlights li i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n  margin-top: 3px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.fr-appintro-highlights li strong { color: #fff; }\r\n\r\n.fr-appintro-btns {\r\n  display: flex;\r\n  gap: 12px;\r\n  flex-wrap: wrap;\r\n  margin-top: 1.5rem;\r\n}\r\n\r\n.fr-appintro-btn-p {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  padding: 14px 30px;\r\n  background: #ff3b3b;\r\n  color: #fff;\r\n  text-decoration: none;\r\n  font-weight: 700;\r\n  font-size: 0.82rem;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  border-radius: 980px;\r\n  transition: background 0.3s, transform 0.2s, box-shadow 0.3s;\r\n  box-shadow: 0 2px 10px rgba(255,59,59,0.25);\r\n}\r\n\r\n.fr-appintro-btn-p:hover {\r\n  background: #e62e2e;\r\n  transform: scale(1.04);\r\n  box-shadow: 0 4px 16px rgba(255,59,59,0.4);\r\n  color: #fff;\r\n}\r\n\r\n.fr-appintro-btn-o {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  padding: 14px 30px;\r\n  background: transparent;\r\n  color: #fff;\r\n  text-decoration: none;\r\n  font-weight: 700;\r\n  font-size: 0.82rem;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  border-radius: 980px;\r\n  border: 2px solid rgba(255,255,255,0.2);\r\n  transition: border-color 0.3s, color 0.3s, transform 0.2s;\r\n}\r\n\r\n.fr-appintro-btn-o:hover {\r\n  border-color: #ff3b3b;\r\n  color: #ff3b3b;\r\n  transform: scale(1.04);\r\n}\r\n\r\n\/* ===== RIGHT COLUMN \u2014 AUTO-PLAY iPHONE ===== *\/\r\n.frap-wrap {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  gap: 20px;\r\n}\r\n\r\n.frap-phone {\r\n  position: relative;\r\n  width: 320px;\r\n  height: 640px;\r\n  background: #000;\r\n  border-radius: 44px;\r\n  border: 4px solid #2a2a2a;\r\n  box-shadow: 0 25px 70px rgba(0,0,0,.75);\r\n  overflow: hidden;\r\n  font-family: Inter, -apple-system, Arial, sans-serif;\r\n}\r\n\r\n\/* Status Bar *\/\r\n.frap-status {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  display: grid;\r\n  grid-template-columns: 48px 1fr 68px;\r\n  align-items: center;\r\n  padding: 14px 24px 0;\r\n  font-size: 10px;\r\n  color: #fff;\r\n  font-weight: 700;\r\n  z-index: 30;\r\n}\r\n\r\n.frap-status-r { text-align: right; font-weight: 600; }\r\n\r\n.frap-island {\r\n  width: 110px;\r\n  height: 28px;\r\n  background: #000;\r\n  border-radius: 20px;\r\n  margin: 0 auto;\r\n  border: 1.5px solid #ff3b3b;\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 0 12px;\r\n}\r\n\r\n.frap-island img { width: 16px; height: 16px; object-fit: contain; }\r\n\r\n\/* ===== SCREENS ===== *\/\r\n.frap-scr {\r\n  position: absolute;\r\n  inset: 0;\r\n  opacity: 0;\r\n  transform: translateY(20px);\r\n  transition: opacity 0.6s ease, transform 0.6s ease;\r\n  pointer-events: none;\r\n  overflow: hidden;\r\n}\r\n\r\n.frap-scr.active {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n  pointer-events: auto;\r\n}\r\n\r\n\/* Screen overlay label *\/\r\n.frap-overlay {\r\n  position: absolute;\r\n  bottom: 0;\r\n  left: 0;\r\n  right: 0;\r\n  z-index: 20;\r\n  background: linear-gradient(to top, rgba(0,0,0,0.9) 0%, rgba(0,0,0,0.7) 60%, transparent 100%);\r\n  padding: 60px 20px 24px;\r\n  opacity: 0;\r\n  transform: translateY(10px);\r\n  transition: opacity 0.5s ease 0.3s, transform 0.5s ease 0.3s;\r\n}\r\n\r\n.frap-scr.active .frap-overlay {\r\n  opacity: 1;\r\n  transform: translateY(0);\r\n}\r\n\r\n.frap-overlay-tag {\r\n  display: inline-block;\r\n  background: rgba(255, 59, 59, 0.15);\r\n  border: 1px solid rgba(255, 59, 59, 0.4);\r\n  color: #ff3b3b;\r\n  font-size: 9px;\r\n  font-weight: 800;\r\n  text-transform: uppercase;\r\n  letter-spacing: 1px;\r\n  padding: 4px 10px;\r\n  border-radius: 999px;\r\n  margin-bottom: 8px;\r\n}\r\n\r\n.frap-overlay-title {\r\n  font-size: 16px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 4px;\r\n}\r\n\r\n.frap-overlay-desc {\r\n  font-size: 11px;\r\n  color: rgba(255,255,255,0.6);\r\n  margin: 0;\r\n  line-height: 1.5;\r\n}\r\n\r\n\/* Progress Dots *\/\r\n.frap-dots {\r\n  display: flex;\r\n  gap: 8px;\r\n  align-items: center;\r\n}\r\n\r\n.frap-dot {\r\n  width: 8px;\r\n  height: 8px;\r\n  border-radius: 50%;\r\n  background: rgba(255,255,255,0.2);\r\n  transition: background 0.3s, transform 0.3s;\r\n}\r\n\r\n.frap-dot.active {\r\n  background: #ff3b3b;\r\n  transform: scale(1.3);\r\n}\r\n\r\n\/* Screen Label Below Phone *\/\r\n.frap-screen-label {\r\n  color: rgba(255,255,255,0.5);\r\n  font-size: 12px;\r\n  font-weight: 600;\r\n  letter-spacing: 1px;\r\n  text-transform: uppercase;\r\n  transition: color 0.3s;\r\n  text-align: center;\r\n}\r\n\r\n\/* ===== INDIVIDUAL SCREEN STYLES ===== *\/\r\n\r\n\/* Dashboard *\/\r\n.frap-dash {\r\n  background: #0d0d0d;\r\n  padding: 54px 20px 130px;\r\n  overflow-y: auto;\r\n  scrollbar-width: none;\r\n}\r\n.frap-dash::-webkit-scrollbar { display: none; }\r\n.frap-d-greet { font-size: 22px; font-weight: 800; color: #fff; margin: 10px 0 12px; line-height: 1.15; }\r\n.frap-d-pts { display: inline-flex; align-items: center; gap: 5px; background: #1b0706; color: #ff3b3b; padding: 7px 12px; border-radius: 999px; font-size: 12px; font-weight: 800; margin-bottom: 24px; }\r\n.frap-d-sec { margin-bottom: 24px; }\r\n.frap-d-sec-t { font-size: 15px; font-weight: 800; color: #fff; margin: 0 0 12px; }\r\n.frap-d-rpt { display: grid; grid-template-columns: 44px 1fr 14px; align-items: center; gap: 10px; margin-bottom: 10px; padding: 8px; background: rgba(255,255,255,0.03); border-radius: 10px; }\r\n.frap-d-thumb { width: 44px; height: 44px; border-radius: 8px; overflow: hidden; }\r\n.frap-d-thumb img { width: 100%; height: 100%; object-fit: cover; }\r\n.frap-d-rpt-t { font-size: 13px; font-weight: 700; color: #fff; margin: 0; }\r\n.frap-d-rpt-m { font-size: 10px; color: rgba(255,255,255,0.4); margin: 2px 0 0; }\r\n.frap-d-link { display: flex; align-items: center; gap: 6px; color: #ff3b3b; font-size: 12px; font-weight: 700; text-decoration: none; margin-top: 8px; }\r\n.frap-d-ldr { display: grid; grid-template-columns: 28px 1fr auto; align-items: center; gap: 8px; margin-bottom: 10px; }\r\n.frap-d-rank { font-size: 13px; font-weight: 800; color: rgba(255,255,255,0.4); }\r\n.frap-d-rank.gold { color: #ffb000; }\r\n.frap-d-name { font-size: 13px; color: #fff; font-weight: 600; }\r\n.frap-d-score { display: inline-flex; align-items: center; gap: 4px; background: #1b0706; color: #ff3b3b; padding: 5px 10px; border-radius: 999px; font-size: 10px; font-weight: 800; }\r\n\r\n\/* Reports *\/\r\n.frap-reports {\r\n  background: #0d0d0d;\r\n  padding: 54px 20px 130px;\r\n}\r\n.frap-r-hdr { font-size: 22px; font-weight: 800; color: #fff; margin: 10px 0 16px; }\r\n.frap-r-tabs { display: flex; gap: 24px; margin-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,0.08); }\r\n.frap-r-tab { font-size: 13px; font-weight: 700; color: rgba(255,255,255,0.4); padding-bottom: 10px; }\r\n.frap-r-tab.on { color: #ff3b3b; border-bottom: 2px solid #ff3b3b; }\r\n.frap-r-item { display: grid; grid-template-columns: 48px 1fr 14px; align-items: center; gap: 10px; padding: 12px 0; border-bottom: 1px solid rgba(255,255,255,0.05); }\r\n.frap-r-thumb { width: 48px; height: 48px; border-radius: 10px; overflow: hidden; }\r\n.frap-r-thumb img { width: 100%; height: 100%; object-fit: cover; }\r\n.frap-r-t { font-size: 13px; font-weight: 700; color: #fff; margin: 0 0 3px; }\r\n.frap-r-m { font-size: 10px; color: rgba(255,255,255,0.4); margin: 0; }\r\n\r\n\/* Camera *\/\r\n.frap-camera { background: #000; }\r\n.frap-cam-vid { position: absolute; inset: 0; }\r\n.frap-cam-vid video { width: 100%; height: 100%; object-fit: cover; }\r\n.frap-cam-ui { position: absolute; inset: 0; z-index: 2; display: flex; flex-direction: column; justify-content: flex-end; align-items: center; padding: 40px; }\r\n.frap-cam-hint { font-size: 12px; color: rgba(255,255,255,0.6); margin-bottom: 14px; }\r\n.frap-cam-shutter { width: 60px; height: 60px; border-radius: 50%; border: 4px solid #fff; position: relative; }\r\n.frap-cam-shutter::after { content: ''; position: absolute; inset: 6px; border-radius: 50%; background: #ff3b3b; }\r\n\r\n\/* Analyzing *\/\r\n.frap-analyze { background: #fff; display: flex; flex-direction: column; align-items: center; justify-content: center; gap: 20px; }\r\n.frap-az-circle { width: 140px; height: 140px; animation: frapSpin 10s linear infinite; position: relative; }\r\n@keyframes frapSpin { to { transform: rotate(360deg); } }\r\n.frap-az-circle img { width: 100%; height: 100%; object-fit: contain; }\r\n.frap-az-vid { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); width: 60px; height: 60px; border-radius: 50%; overflow: hidden; }\r\n.frap-az-vid video { width: 100%; height: 100%; object-fit: cover; }\r\n.frap-az-title { font-size: 16px; font-weight: 700; color: #111; margin: 0; }\r\n.frap-az-dots { display: flex; gap: 6px; }\r\n.frap-az-dot { width: 7px; height: 7px; border-radius: 50%; background: rgba(255,59,59,0.2); animation: frapDotPulse 1.4s ease infinite; }\r\n.frap-az-dot:nth-child(2) { animation-delay: 0.2s; }\r\n.frap-az-dot:nth-child(3) { animation-delay: 0.4s; }\r\n@keyframes frapDotPulse { 0%, 100% { background: rgba(255,59,59,0.2); } 50% { background: #ff3b3b; transform: scale(1.3); } }\r\n\r\n\/* Results *\/\r\n.frap-results { background: #fff; overflow-y: auto; padding: 0; scrollbar-width: none; }\r\n.frap-results::-webkit-scrollbar { display: none; }\r\n.frap-res-hdr { background: #ff3b3b; padding: 50px 20px 16px; }\r\n.frap-res-hdr-t { font-size: 17px; font-weight: 700; color: #fff; margin: 0; }\r\n.frap-res-body { padding: 20px; }\r\n.frap-res-alert { text-align: center; padding: 16px 0 20px; border-bottom: 1px solid rgba(0,0,0,0.06); margin-bottom: 16px; }\r\n.frap-res-alert i { font-size: 32px; color: #ff3b3b; margin-bottom: 8px; }\r\n.frap-res-species { font-size: 20px; font-weight: 800; color: #ff3b3b; margin: 0 0 8px; }\r\n.frap-res-conf { display: inline-block; background: rgba(255,59,59,0.08); color: #ff3b3b; padding: 4px 12px; border-radius: 999px; font-size: 11px; font-weight: 700; }\r\n.frap-res-sec-t { font-size: 13px; font-weight: 800; color: #111; margin: 16px 0 8px; }\r\n.frap-res-feat { display: flex; align-items: flex-start; gap: 8px; font-size: 12px; color: #333; margin-bottom: 6px; }\r\n.frap-res-feat i { color: #ff3b3b; font-size: 6px; margin-top: 5px; }\r\n.frap-res-btn { display: block; width: 100%; padding: 12px; border-radius: 10px; background: #ff3b3b; color: #fff; font-size: 13px; font-weight: 700; text-align: center; border: none; margin-top: 16px; }\r\n\r\n\/* Knowledge Hub *\/\r\n.frap-articles {\r\n  background: #0d0d0d;\r\n  padding: 54px 20px 130px;\r\n}\r\n.frap-k-hdr { font-size: 22px; font-weight: 800; color: #fff; margin: 10px 0 16px; }\r\n.frap-k-card { border-radius: 12px; overflow: hidden; margin-bottom: 14px; background: #111; border: 1px solid rgba(255,255,255,0.06); }\r\n.frap-k-img { width: 100%; height: 90px; overflow: hidden; }\r\n.frap-k-img img { width: 100%; height: 100%; object-fit: cover; }\r\n.frap-k-info { padding: 10px 14px; }\r\n.frap-k-t { font-size: 13px; font-weight: 700; color: #fff; margin: 0 0 4px; }\r\n.frap-k-cat { font-size: 10px; color: #ff3b3b; font-weight: 600; margin: 0; }\r\n\r\n\/* Profile *\/\r\n.frap-profile {\r\n  background: #0d0d0d;\r\n  padding: 54px 20px 130px;\r\n}\r\n.frap-p-hdr { font-size: 22px; font-weight: 800; color: #fff; margin: 10px 0 20px; }\r\n.frap-p-pts { display: flex; align-items: center; gap: 8px; margin-bottom: 24px; }\r\n.frap-p-pts-lbl { font-size: 11px; color: rgba(255,255,255,0.5); }\r\n.frap-p-pts-val { font-size: 20px; font-weight: 800; color: #ff3b3b; }\r\n.frap-p-field { margin-bottom: 16px; padding-bottom: 16px; border-bottom: 1px solid rgba(255,255,255,0.06); }\r\n.frap-p-lbl { font-size: 10px; color: rgba(255,255,255,0.4); margin: 0 0 3px; text-transform: uppercase; letter-spacing: 0.5px; }\r\n.frap-p-val { font-size: 14px; color: #fff; font-weight: 600; margin: 0; }\r\n.frap-p-btn { display: block; width: 100%; padding: 11px; border-radius: 10px; border: 1px solid rgba(255,255,255,0.15); background: transparent; color: rgba(255,255,255,0.7); font-size: 13px; font-weight: 700; text-align: center; margin-bottom: 10px; }\r\n.frap-p-btn.danger { border-color: rgba(255,59,59,0.3); color: #ff3b3b; }\r\n\r\n\/* Bottom Nav *\/\r\n.frap-bnav {\r\n  position: absolute;\r\n  left: 0; right: 0; bottom: 0;\r\n  height: 110px;\r\n  background-image: url('https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Nav-Menu-Full-scaled.webp');\r\n  background-repeat: no-repeat;\r\n  background-position: bottom center;\r\n  background-size: 100% auto;\r\n  z-index: 20;\r\n  opacity: 0;\r\n  transition: opacity 0.4s ease;\r\n  pointer-events: none;\r\n}\r\n\r\n.frap-bnav.visible { opacity: 1; pointer-events: auto; }\r\n\r\n.frap-bnav-cam {\r\n  position: absolute;\r\n  left: 50%;\r\n  top: 58%;\r\n  transform: translate(-50%, -50%);\r\n  margin-top: -16px;\r\n  width: 26px; height: 26px;\r\n  color: #fff;\r\n  display: flex; align-items: center; justify-content: center;\r\n}\r\n\r\n.frap-bnav-cam svg {\r\n  width: 20px; height: 20px;\r\n  stroke: currentColor; fill: none;\r\n  stroke-width: 2.6;\r\n  stroke-linecap: round; stroke-linejoin: round;\r\n}\r\n\r\n.frap-bnav-icon {\r\n  position: absolute;\r\n  bottom: 24px;\r\n  width: 26px; height: 26px;\r\n  color: rgba(255,255,255,0.7);\r\n  display: flex; align-items: center; justify-content: center;\r\n}\r\n\r\n.frap-bnav-icon svg {\r\n  width: 20px; height: 20px;\r\n  stroke: currentColor; fill: none;\r\n  stroke-width: 2.5;\r\n  stroke-linecap: round; stroke-linejoin: round;\r\n}\r\n\r\n.frap-bnav-icon.bn1 { left: 30px; }\r\n.frap-bnav-icon.bn2 { left: 88px; }\r\n.frap-bnav-icon.bn3 { right: 88px; }\r\n.frap-bnav-icon.bn4 { right: 30px; }\r\n.frap-bnav-icon.on { color: #fff; }\r\n\r\n\/* MOBILE *\/\r\n@media (max-width: 768px) {\r\n  .fr-appintro { padding: 60px 20px; }\r\n  .fr-appintro-grid { grid-template-columns: 1fr; gap: 3rem; }\r\n  .fr-appintro-text { text-align: center; order: 2; }\r\n  .fr-appintro-divider { margin: 0 auto 1.5rem; }\r\n  .frap-wrap { order: 1; }\r\n  .frap-phone { width: 280px; height: 580px; }\r\n  .fr-appintro-btns { flex-direction: column; align-items: stretch; }\r\n  .fr-appintro-btn-p, .fr-appintro-btn-o { width: 100%; justify-content: center; box-sizing: border-box; text-align: center; }\r\n}\r\n<\/style>\r\n\r\n<div class=\"fr-appintro\">\r\n  <div class=\"fr-appintro-grid\">\r\n\r\n    <!-- LEFT \u2014 INFO -->\r\n    <div class=\"fr-appintro-text\">\r\n      <p class=\"fr-label\">Introducing Fire Rant<\/p>\r\n      <h2>EVERY SMARTPHONE. A SURVEILLANCE TOOL.<\/h2>\r\n      <div class=\"fr-appintro-divider\"><\/div>\r\n      <p>\r\n        Fire Rant is a citizen biosecurity platform that transforms community observations into actionable intelligence. \r\n        Photograph a suspected nest, receive AI-powered verification in under 60 seconds, and unlock free professional-grade \r\n        bait delivered to your door.\r\n      <\/p>\r\n      <p>\r\n        Built on 20,000+ verified training images from iNaturalist and designed for Australian conditions \u2014 Fire Rant bridges \r\n        the gap between community detection and coordinated eradication response.\r\n      <\/p>\r\n\r\n      <ul class=\"fr-appintro-highlights\">\r\n        <li><i class=\"fas fa-brain\"><\/i><span><strong>AI Nest Identification<\/strong> \u2014 Computer vision trained on verified <em>S. invicta<\/em> data, 85%+ confidence<\/span><\/li>\r\n        <li><i class=\"fas fa-map-marker-alt\"><\/i><span><strong>Geo-Tagged Reporting<\/strong> \u2014 GPS auto-fill creating evidence-grade location data<\/span><\/li>\r\n        <li><i class=\"fas fa-trophy\"><\/i><span><strong>Gamified Engagement<\/strong> \u2014 Points, leaderboards, and community rankings<\/span><\/li>\r\n        \r\n      <\/ul>\r\n\r\n      <div class=\"fr-appintro-btns\">\r\n        <a href=\"#\" class=\"fr-appintro-btn-p\"><i class=\"fab fa-apple\"><\/i> Download for iOS<\/a>\r\n        <a href=\"#howto\" class=\"fr-appintro-btn-o\"><i class=\"fas fa-play-circle\"><\/i> See How It Works<\/a>\r\n      <\/div>\r\n    <\/div>\r\n\r\n    <!-- RIGHT \u2014 AUTO-PLAY iPHONE -->\r\n    <div class=\"frap-wrap\">\r\n      <div class=\"frap-phone\">\r\n\r\n        <!-- Status Bar -->\r\n        <div class=\"frap-status\">\r\n          <span>2:34<\/span>\r\n          <div class=\"frap-island\"><img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/antScroll-scaled.png\" alt=\"Ant\"><\/div>\r\n          <span class=\"frap-status-r\">5G  77%<\/span>\r\n        <\/div>\r\n\r\n        <!-- SCREEN 1: Dashboard -->\r\n        <div class=\"frap-scr frap-dash active\" data-idx=\"0\">\r\n          <p class=\"frap-d-greet\">\u4e0b\u5348\u597d\uff0c,<br>\u8a79\u59c6\u65af<\/p>\r\n          <div class=\"frap-d-pts\"><i class=\"fas fa-star\"><\/i> 660 \u5206<\/div>\r\n          <div class=\"frap-d-sec\">\r\n            <p class=\"frap-d-sec-t\">\u8fd1\u671f\u62a5\u9053<\/p>\r\n            <div class=\"frap-d-rpt\">\r\n              <div class=\"frap-d-thumb\"><img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"ant\"><\/div>\r\n              <div><p class=\"frap-d-rpt-t\">\u66f4\u591a\u8682\u8681<\/p><p class=\"frap-d-rpt-m\">2026\u5e745\u670821\u65e5<\/p><\/div>\r\n              <span style=\"color:rgba(255,255,255,.5);font-size:18px\">\u203a<\/span>\r\n            <\/div>\r\n            <div class=\"frap-d-rpt\">\r\n              <div class=\"frap-d-thumb\"><img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"ant\"><\/div>\r\n              <div><p class=\"frap-d-rpt-t\">\u8bfb\u5199\u7aef\u53e3<\/p><p class=\"frap-d-rpt-m\">Feb 23, 2026<\/p><\/div>\r\n              <span style=\"color:rgba(255,255,255,.5);font-size:18px\">\u203a<\/span>\r\n            <\/div>\r\n            <a class=\"frap-d-link\" href=\"#\"><i class=\"fas fa-list\"><\/i> \u6240\u6709\u62a5\u544a<\/a>\r\n          <\/div>\r\n          <div class=\"frap-d-sec\">\r\n            <p class=\"frap-d-sec-t\">\u6392\u884c\u699c<\/p>\r\n            <div class=\"frap-d-ldr\">\r\n              <span class=\"frap-d-rank gold\">#1<\/span>\r\n              <span class=\"frap-d-name\">\u6770\u91cc\u7c73<\/span>\r\n              <span class=\"frap-d-score\"><i class=\"fas fa-star\"><\/i> 660<\/span>\r\n            <\/div>\r\n            <div class=\"frap-d-ldr\">\r\n              <span class=\"frap-d-rank\">#2<\/span>\r\n              <span class=\"frap-d-name\">\u4ea8\u5229\u4e00\u4e16<\/span>\r\n              <span class=\"frap-d-score\"><i class=\"fas fa-star\"><\/i> 130<\/span>\r\n            <\/div>\r\n            <a class=\"frap-d-link\" href=\"#\"><i class=\"fas fa-chart-bar\"><\/i> \u67e5\u770b\u5b8c\u6574\u6392\u884c\u699c<\/a>\r\n          <\/div>\r\n          <!-- Overlay Label -->\r\n          <div class=\"frap-overlay\">\r\n            <span class=\"frap-overlay-tag\">Dashboard<\/span>\r\n            <p class=\"frap-overlay-title\">Your Command Centre<\/p>\r\n            <p class=\"frap-overlay-desc\">Points, reports, leaderboard \u2014 everything at a glance<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- SCREEN 2: Camera -->\r\n        <div class=\"frap-scr frap-camera\" data-idx=\"1\">\r\n          <div class=\"frap-cam-vid\">\r\n            <video autoplay muted loop playsinline>\r\n              <source src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Fire-ant-hero-video.mp4\" type=\"video\/mp4\">\r\n            <\/video>\r\n          <\/div>\r\n          <div class=\"frap-cam-ui\">\r\n            <span class=\"frap-cam-hint\">Point at suspected nest<\/span>\r\n            <div class=\"frap-cam-shutter\"><\/div>\r\n          <\/div>\r\n          <div class=\"frap-overlay\">\r\n            <span class=\"frap-overlay-tag\">\u76f8\u673a<\/span>\r\n            <p class=\"frap-overlay-title\">Capture & Scan<\/p>\r\n            <p class=\"frap-overlay-desc\">Photograph the nest \u2014 AI analysis begins instantly<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- SCREEN 3: Analyzing -->\r\n        <div class=\"frap-scr frap-analyze\" data-idx=\"2\">\r\n          <div class=\"frap-az-circle\">\r\n            <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Fire-Ant-circle--scaled.png\" alt=\"Fire Ant Circle\">\r\n            <div class=\"frap-az-vid\">\r\n              <video autoplay muted loop playsinline>\r\n                <source src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Fire-Rant-Custom-Icons.mp4\" type=\"video\/mp4\">\r\n              <\/video>\r\n            <\/div>\r\n          <\/div>\r\n          <p class=\"frap-az-title\">\u6b63\u5728\u5206\u6790\u56fe\u50cf...<\/p>\r\n          <div class=\"frap-az-dots\">\r\n            <div class=\"frap-az-dot\"><\/div>\r\n            <div class=\"frap-az-dot\"><\/div>\r\n            <div class=\"frap-az-dot\"><\/div>\r\n          <\/div>\r\n          <div class=\"frap-overlay\">\r\n            <span class=\"frap-overlay-tag\">AI Engine<\/span>\r\n            <p class=\"frap-overlay-title\">Species Identification<\/p>\r\n            <p class=\"frap-overlay-desc\">20,000+ training images power 85%+ confidence scoring<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- SCREEN 4: Results -->\r\n        <div class=\"frap-scr frap-results\" data-idx=\"3\">\r\n          <div class=\"frap-res-hdr\">\r\n            <p class=\"frap-res-hdr-t\">\u5206\u6790\u7ed3\u679c<\/p>\r\n          <\/div>\r\n          <div class=\"frap-res-body\">\r\n            <div class=\"frap-res-alert\">\r\n              <i class=\"fas fa-exclamation-triangle\"><\/i>\r\n              <p class=\"frap-res-species\">\u745e\u6cd5<\/p>\r\n              <span class=\"frap-res-conf\">\u4fe1\u5fc3\u6307\u6570\uff1a85.0%<\/span>\r\n            <\/div>\r\n            <p class=\"frap-res-sec-t\">\u5df2\u8bc6\u522b\u7279\u5f81<\/p>\r\n            <div class=\"frap-res-feat\"><i class=\"fas fa-circle\"><\/i><span>\u677e\u6563\u3001\u6613\u788e\u7684\u571f\u58e4<\/span><\/div>\r\n            <div class=\"frap-res-feat\"><i class=\"fas fa-circle\"><\/i><span>\u591a\u4e2a\u5fae\u5c0f\u3001\u4e0d\u89c4\u5219\u7684\u7f1d\u9699<\/span><\/div>\r\n            <div class=\"frap-res-feat\"><i class=\"fas fa-circle\"><\/i><span>\u6ca1\u6709\u5355\u4e00\u7684\u5927\u5165\u53e3\u5b54<\/span><\/div>\r\n            <button class=\"frap-res-btn\">\u521b\u5efa\u62a5\u544a<\/button>\r\n          <\/div>\r\n          <div class=\"frap-overlay\">\r\n            <span class=\"frap-overlay-tag\">Results<\/span>\r\n            <p class=\"frap-overlay-title\">Instant Verification<\/p>\r\n            <p class=\"frap-overlay-desc\">RIFA confirmed \u2014 one tap to submit a verified report<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- SCREEN 5: Reports -->\r\n        <div class=\"frap-scr frap-reports\" data-idx=\"4\">\r\n          <p class=\"frap-r-hdr\">\u6211\u7684\u62a5\u544a<\/p>\r\n          <div class=\"frap-r-tabs\">\r\n            <span class=\"frap-r-tab on\">\u62a5\u544a<\/span>\r\n            <span class=\"frap-r-tab\">\u8349\u7a3f<\/span>\r\n          <\/div>\r\n          <div class=\"frap-r-item\">\r\n            <div class=\"frap-r-thumb\"><img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"ant\"><\/div>\r\n            <div><p class=\"frap-r-t\">\u66f4\u591a\u8682\u8681<\/p><p class=\"frap-r-m\">2026\u5e745\u670821\u65e5<\/p><\/div>\r\n            <span style=\"color:rgba(255,255,255,.5);font-size:18px\">\u203a<\/span>\r\n          <\/div>\r\n          <div class=\"frap-r-item\">\r\n            <div class=\"frap-r-thumb\"><img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"ant\"><\/div>\r\n            <div><p class=\"frap-r-t\">\u8bfb\u5199\u7aef\u53e3<\/p><p class=\"frap-r-m\">Feb 23, 2026<\/p><\/div>\r\n            <span style=\"color:rgba(255,255,255,.5);font-size:18px\">\u203a<\/span>\r\n          <\/div>\r\n          <div class=\"frap-r-item\">\r\n            <div class=\"frap-r-thumb\"><img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"ant\"><\/div>\r\n            <div><p class=\"frap-r-t\">\u5728\u6211\u7684\u540e\u9662<\/p><p class=\"frap-r-m\">Mar 08, 2026<\/p><\/div>\r\n            <span style=\"color:rgba(255,255,255,.5);font-size:18px\">\u203a<\/span>\r\n          <\/div>\r\n          <div class=\"frap-overlay\">\r\n            <span class=\"frap-overlay-tag\">\u62a5\u544a<\/span>\r\n            <p class=\"frap-overlay-title\">Track Every Sighting<\/p>\r\n            <p class=\"frap-overlay-desc\">Your submission history with timestamps and GPS data<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- SCREEN 6: Knowledge Hub -->\r\n        <div class=\"frap-scr frap-articles\" data-idx=\"5\">\r\n          <p class=\"frap-k-hdr\">\u77e5\u8bc6\u4e2d\u5fc3<\/p>\r\n          <div class=\"frap-k-card\"><div class=\"frap-k-img\"><img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"ant\"><\/div><div class=\"frap-k-info\"><p class=\"frap-k-t\">\u5982\u4f55\u5904\u7406\u8682\u8681<\/p><p class=\"frap-k-cat\">\u9884\u9632\u4e0e\u63a7\u5236<\/p><\/div><\/div>\r\n          <div class=\"frap-k-card\"><div class=\"frap-k-img\"><img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"ant\"><\/div><div class=\"frap-k-info\"><p class=\"frap-k-t\">\u5982\u4f55\u8bc6\u522b\u706b\u8681<\/p><p class=\"frap-k-cat\">\u706b\u8681\u8bc6\u522b<\/p><\/div><\/div>\r\n          <div class=\"frap-k-card\"><div class=\"frap-k-img\"><img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"ant\"><\/div><div class=\"frap-k-info\"><p class=\"frap-k-t\">\u62a5\u544a\u6700\u4f73\u5b9e\u8df5<\/p><p class=\"frap-k-cat\">\u793e\u533a\u6307\u5357<\/p><\/div><\/div>\r\n          <div class=\"frap-overlay\">\r\n            <span class=\"frap-overlay-tag\">\u77e5\u8bc6\u4e2d\u5fc3<\/span>\r\n            <p class=\"frap-overlay-title\">Learn & Identify<\/p>\r\n            <p class=\"frap-overlay-desc\">Expert articles on identification, treatment, and prevention<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- SCREEN 7: Profile -->\r\n        <div class=\"frap-scr frap-profile\" data-idx=\"6\">\r\n          <p class=\"frap-p-hdr\">\u4e2a\u4eba\u8d44\u6599<\/p>\r\n          <div class=\"frap-p-pts\">\r\n            <span class=\"frap-p-pts-lbl\">\u4f60\u7684\u5206\u6570<\/span>\r\n            <span class=\"frap-p-pts-val\"><i class=\"fas fa-star\"><\/i> 710<\/span>\r\n          <\/div>\r\n          <div class=\"frap-p-field\"><p class=\"frap-p-lbl\">\u59d3\u540d<\/p><p class=\"frap-p-val\">\u6770\u91cc\u7c73<\/p><\/div>\r\n          <div class=\"frap-p-field\"><p class=\"frap-p-lbl\">\u7535\u5b50\u90ae\u4ef6<\/p><p class=\"frap-p-val\">info@neonsnow.com.au<\/p><\/div>\r\n          <div class=\"frap-p-field\"><p class=\"frap-p-lbl\">Level<\/p><p class=\"frap-p-val\">\u7b2c\u4e09\u7ea7 \u2014 \u54e8\u5175<\/p><\/div>\r\n          <div class=\"frap-p-btn\">\u767b\u51fa<\/div>\r\n          <div class=\"frap-p-btn danger\">\u5220\u9664\u8d26\u6237<\/div>\r\n          <div class=\"frap-overlay\">\r\n            <span class=\"frap-overlay-tag\">\u4e2a\u4eba\u8d44\u6599<\/span>\r\n            <p class=\"frap-overlay-title\">Your Impact<\/p>\r\n            <p class=\"frap-overlay-desc\">710 points earned \u00b7 Level 3 Sentinel \u00b7 Active reporter<\/p>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- BOTTOM NAV -->\r\n        <div class=\"frap-bnav\" id=\"frapNav\">\r\n          <div class=\"frap-bnav-cam\">\r\n            <svg viewbox=\"0 0 24 24\"><path d=\"M7 7h2l1.5-2h3L15 7h2a3 3 0 0 1 3 3v7a3 3 0 0 1-3 3H7a3 3 0 0 1-3-3v-7a3 3 0 0 1 3-3z\"><\/path><circle cx=\"12\" cy=\"13.5\" r=\"3.2\"><\/circle><\/svg>\r\n          <\/div>\r\n          <div class=\"frap-bnav-icon bn1\">\r\n            <svg viewbox=\"0 0 24 24\"><path d=\"M3 11.5L12 4l9 7.5\"><\/path><path d=\"M5.5 10.5V20h5v-5h3v5h5v-9.5\"><\/path><\/svg>\r\n          <\/div>\r\n          <div class=\"frap-bnav-icon bn2\">\r\n            <svg viewbox=\"0 0 24 24\"><path d=\"M8 4h8\"><\/path><path d=\"M9 4a3 3 0 0 0 6 0\"><\/path><rect x=\"5\" y=\"5\" width=\"14\" height=\"16\" rx=\"2\"><\/rect><path d=\"M8 11h8\"><\/path><path d=\"M8 15h8\"><\/path><\/svg>\r\n          <\/div>\r\n          <div class=\"frap-bnav-icon bn3\">\r\n            <svg viewbox=\"0 0 24 24\"><path d=\"M4 5.5c2.5 0 5 .4 8 2.2v12c-3-1.8-5.5-2.2-8-2.2z\"><\/path><path d=\"M20 5.5c-2.5 0-5 .4-8 2.2v12c3-1.8 5.5-2.2 8-2.2z\"><\/path><\/svg>\r\n          <\/div>\r\n          <div class=\"frap-bnav-icon bn4\">\r\n            <svg viewbox=\"0 0 24 24\"><circle cx=\"12\" cy=\"8\" r=\"3.5\"><\/circle><path d=\"M5 20c1.2-4 4-6 7-6s5.8 2 7 6\"><\/path><\/svg>\r\n          <\/div>\r\n        <\/div>\r\n\r\n      <\/div>\r\n\r\n      <!-- Progress Dots -->\r\n      <div class=\"frap-dots\" id=\"frapDots\">\r\n        <div class=\"frap-dot active\"><\/div>\r\n        <div class=\"frap-dot\"><\/div>\r\n        <div class=\"frap-dot\"><\/div>\r\n        <div class=\"frap-dot\"><\/div>\r\n        <div class=\"frap-dot\"><\/div>\r\n        <div class=\"frap-dot\"><\/div>\r\n        <div class=\"frap-dot\"><\/div>\r\n      <\/div>\r\n\r\n      <span class=\"frap-screen-label\" id=\"frapLabel\">Dashboard<\/span>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script type=\"text\/javascript\">\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n  var screens = document.querySelectorAll('.frap-scr');\r\n  var dots = document.querySelectorAll('.frap-dot');\r\n  var nav = document.getElementById('frapNav');\r\n  var label = document.getElementById('frapLabel');\r\n\r\n  if (!screens.length) return;\r\n\r\n  var names = ['Dashboard', 'Camera', 'Analyzing...', 'Results', 'Reports', 'Knowledge Hub', 'Profile'];\r\n  var navScreens = [0, 4, 5, 6];\r\n  var current = 0;\r\n  var interval = 4000;\r\n\r\n  function showScreen(idx) {\r\n    screens.forEach(function(s) { s.classList.remove('active'); });\r\n    dots.forEach(function(d) { d.classList.remove('active'); });\r\n    screens[idx].classList.add('active');\r\n    dots[idx].classList.add('active');\r\n    label.textContent = names[idx] || '';\r\n    nav.classList.toggle('visible', navScreens.indexOf(idx) > -1);\r\n    current = idx;\r\n  }\r\n\r\n  function next() {\r\n    var nextIdx = (current + 1) % screens.length;\r\n    showScreen(nextIdx);\r\n  }\r\n\r\n  var autoplay = setInterval(next, interval);\r\n\r\n  \/* Pause on hover, resume on leave *\/\r\n  var phone = document.querySelector('.frap-phone');\r\n  phone.addEventListener('mouseenter', function() {\r\n    clearInterval(autoplay);\r\n  });\r\n  phone.addEventListener('mouseleave', function() {\r\n    autoplay = setInterval(next, interval);\r\n  });\r\n\r\n  \/* Click dots to jump *\/\r\n  dots.forEach(function(dot, i) {\r\n    dot.addEventListener('click', function() {\r\n      clearInterval(autoplay);\r\n      showScreen(i);\r\n      autoplay = setInterval(next, interval);\r\n    });\r\n  });\r\n});\r\n<\/script>\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-badd0e8 elementor-widget elementor-widget-html\" data-id=\"badd0e8\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!-- ============================================\r\n     FIRE RANT \u2014 APP DOWNLOAD CTA SECTION\r\n     Clean, Apple-style download section\r\n     Matching site design system (#ff3b3b, black, Inter)\r\n============================================ -->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<style>\r\n.fr-download {\r\n  background: #0a0a0a;\r\n  padding: 80px 40px;\r\n  font-family: Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n  text-align: center;\r\n}\r\n\r\n.fr-download-inner {\r\n  max-width: 700px;\r\n  margin: 0 auto;\r\n}\r\n\r\n.fr-download-icon {\r\n  width: 80px;\r\n  height: 80px;\r\n  border-radius: 20px;\r\n  overflow: hidden;\r\n  margin: 0 auto 28px;\r\n  box-shadow: 0 8px 32px rgba(255, 59, 59, 0.3);\r\n}\r\n\r\n.fr-download-icon img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n.fr-download h2 {\r\n  color: #fff;\r\n  font-size: 2.4rem;\r\n  font-weight: 800;\r\n  margin: 0 0 12px;\r\n  letter-spacing: -0.5px;\r\n}\r\n\r\n.fr-download p {\r\n  color: rgba(255, 255, 255, 0.55);\r\n  font-size: 1.1rem;\r\n  line-height: 1.6;\r\n  margin: 0 0 36px;\r\n}\r\n\r\n.fr-download-btns {\r\n  display: flex;\r\n  justify-content: center;\r\n  gap: 16px;\r\n  flex-wrap: wrap;\r\n}\r\n\r\n.fr-download-btn {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 16px 32px;\r\n  border-radius: 980px;\r\n  text-decoration: none;\r\n  font-weight: 700;\r\n  font-size: 0.95rem;\r\n  transition: transform 0.2s, box-shadow 0.3s, background 0.3s;\r\n}\r\n\r\n.fr-download-btn:hover {\r\n  transform: scale(1.04);\r\n}\r\n\r\n.fr-download-btn.apple {\r\n  background: #fff;\r\n  color: #000;\r\n  box-shadow: 0 4px 20px rgba(255, 255, 255, 0.1);\r\n}\r\n\r\n.fr-download-btn.apple:hover {\r\n  box-shadow: 0 6px 28px rgba(255, 255, 255, 0.2);\r\n  color: #000;\r\n}\r\n\r\n.fr-download-btn.google {\r\n  background: transparent;\r\n  color: #fff;\r\n  border: 2px solid rgba(255, 255, 255, 0.2);\r\n}\r\n\r\n.fr-download-btn.google:hover {\r\n  border-color: #ff3b3b;\r\n  color: #ff3b3b;\r\n  box-shadow: 0 4px 20px rgba(255, 59, 59, 0.15);\r\n}\r\n\r\n.fr-download-btn i {\r\n  font-size: 22px;\r\n}\r\n\r\n.fr-download-btn .fr-btn-text {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: flex-start;\r\n  line-height: 1.2;\r\n}\r\n\r\n.fr-download-btn .fr-btn-sub {\r\n  font-size: 0.65rem;\r\n  font-weight: 500;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  opacity: 0.7;\r\n}\r\n\r\n.fr-download-btn .fr-btn-store {\r\n  font-size: 1rem;\r\n  font-weight: 800;\r\n}\r\n\r\n.fr-download-note {\r\n  margin-top: 28px;\r\n  color: rgba(255, 255, 255, 0.3);\r\n  font-size: 0.8rem;\r\n}\r\n\r\n.fr-download-note i {\r\n  color: #ff3b3b;\r\n  margin-right: 4px;\r\n}\r\n\r\n\/* Mobile *\/\r\n@media (max-width: 768px) {\r\n  .fr-download { padding: 60px 20px; }\r\n  .fr-download h2 { font-size: 1.8rem; }\r\n  .fr-download p { font-size: 0.95rem; }\r\n  .fr-download-btns { flex-direction: column; align-items: center; }\r\n  .fr-download-btn { width: 100%; max-width: 280px; justify-content: center; }\r\n}\r\n<\/style>\r\n\r\n<div class=\"fr-download\">\r\n  <div class=\"fr-download-inner\">\r\n\r\n    <div class=\"fr-download-icon\">\r\n      <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2025\/06\/ChatGPT-Image-Jun-13-2025-10_39_07-PM.png\" alt=\"Fire Rant App Icon\">\r\n    <\/div>\r\n\r\n    <h2>Download Fire Rant<\/h2>\r\n    <p>Join the frontline of Australia's biosecurity effort. Detect, report, and earn rewards \u2014 every observation strengthens the national eradication response.<\/p>\r\n\r\n    <div class=\"fr-download-btns\">\r\n      <a href=\"#\" class=\"fr-download-btn apple\">\r\n        <i class=\"fab fa-apple\"><\/i>\r\n        <div class=\"fr-btn-text\">\r\n          <span class=\"fr-btn-sub\">Download on the<\/span>\r\n          <span class=\"fr-btn-store\">App Store<\/span>\r\n        <\/div>\r\n      <\/a>\r\n      <a href=\"#\" class=\"fr-download-btn google\">\r\n        <i class=\"fab fa-google-play\"><\/i>\r\n        <div class=\"fr-btn-text\">\r\n          <span class=\"fr-btn-sub\">Get it on<\/span>\r\n          <span class=\"fr-btn-store\">Google Play<\/span>\r\n        <\/div>\r\n      <\/a>\r\n    <\/div>\r\n\r\n    <p class=\"fr-download-note\"><i class=\"fas fa-shield-alt\"><\/i> Free to download \u00b7 iOS 15+ & Android 12+ \u00b7 Pilot available in SEQ<\/p>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-5098d13 elementor-widget elementor-widget-html\" data-id=\"5098d13\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!-- ============================================\r\n     FIRE RANT \u2014 APP PAGE STEP 01\r\n     Open Fire Rant \u2192 Login \u2192 Loading \u2192 Dashboard\r\n     FIXED: Frontend rendering + Bottom nav stays fixed\r\n============================================ -->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<style>\r\n.fr-step01 {\r\n  background: #0a0a0a;\r\n  padding: 80px 40px;\r\n  font-family: Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n}\r\n\r\n.fr-step01-grid {\r\n  max-width: 1100px;\r\n  margin: 0 auto;\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 60px;\r\n  align-items: center;\r\n}\r\n\r\n\/* LEFT COLUMN \u2014 INFO *\/\r\n.fr-step01-tag {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border: 1px solid rgba(255, 59, 59, 0.25);\r\n  border-radius: 980px;\r\n  padding: 6px 14px;\r\n  font-size: 0.75rem;\r\n  font-weight: 700;\r\n  color: #ff3b3b;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.fr-step01-info h2 {\r\n  font-size: 2.2rem;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 16px;\r\n  letter-spacing: -0.5px;\r\n  line-height: 1.15;\r\n}\r\n\r\n.fr-step01-info > p {\r\n  font-size: 1.05rem;\r\n  color: rgba(255, 255, 255, 0.6);\r\n  line-height: 1.7;\r\n  margin: 0 0 28px;\r\n}\r\n\r\n.fr-step01-features {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n}\r\n\r\n.fr-step01-features li {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 10px 0;\r\n  font-size: 0.95rem;\r\n  color: rgba(255, 255, 255, 0.75);\r\n}\r\n\r\n.fr-step01-features li i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n  width: 28px;\r\n  height: 28px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border-radius: 8px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n\/* RIGHT COLUMN \u2014 iPHONE *\/\r\n.fr-step01-phone-col {\r\n  display: flex;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s01-phone {\r\n  position: relative;\r\n  width: 320px;\r\n  height: 660px;\r\n  background: #000;\r\n  border-radius: 48px;\r\n  border: 4px solid #2a2a2a;\r\n  box-shadow: 0 30px 80px rgba(0,0,0,.8);\r\n  overflow: hidden;\r\n  font-family: Inter, -apple-system, Arial, sans-serif;\r\n  cursor: pointer;\r\n}\r\n\r\n\/* Status Bar *\/\r\n.fr-s01-status {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  display: grid;\r\n  grid-template-columns: 48px 1fr 68px;\r\n  align-items: center;\r\n  padding: 14px 24px 0;\r\n  font-size: 10px;\r\n  color: #fff;\r\n  font-weight: 700;\r\n  z-index: 10;\r\n}\r\n\r\n.fr-s01-status-right {\r\n  text-align: right;\r\n  font-weight: 600;\r\n}\r\n\r\n.fr-s01-island {\r\n  width: 110px;\r\n  height: 28px;\r\n  background: #000;\r\n  border-radius: 20px;\r\n  margin: 0 auto;\r\n  border: 1.5px solid #ff3b3b;\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 0 12px;\r\n}\r\n\r\n.fr-s01-island img {\r\n  width: 16px;\r\n  height: 16px;\r\n  object-fit: contain;\r\n}\r\n\r\n\/* ALL STATES *\/\r\n.fr-s01-state {\r\n  position: absolute;\r\n  inset: 0;\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  opacity: 0;\r\n  transition: opacity 0.4s ease;\r\n  pointer-events: none;\r\n}\r\n\r\n.fr-s01-state.active {\r\n  opacity: 1;\r\n  pointer-events: auto;\r\n}\r\n\r\n\/* STATE 1: HOME SCREEN *\/\r\n.fr-s01-home {\r\n  padding: 60px 20px 40px;\r\n}\r\n\r\n.fr-s01-home::before {\r\n  content: '';\r\n  position: absolute;\r\n  inset: 0;\r\n  background: url('https:\/\/firerant.com.au\/wp-content\/uploads\/2025\/06\/ChatGPT-Image-Jun-12-2025-10_59_33-PM-2-1.png') center\/cover;\r\n  filter: blur(12px) brightness(0.4);\r\n  z-index: 0;\r\n}\r\n\r\n.fr-s01-appicon {\r\n  position: relative;\r\n  z-index: 2;\r\n  width: 72px;\r\n  height: 72px;\r\n  border-radius: 18px;\r\n  overflow: hidden;\r\n  box-shadow: 0 6px 24px rgba(255, 59, 59, 0.4);\r\n  margin-bottom: 12px;\r\n  transition: transform 0.2s;\r\n}\r\n\r\n.fr-s01-appicon:hover {\r\n  transform: scale(1.08);\r\n}\r\n\r\n.fr-s01-appicon img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n.fr-s01-appname {\r\n  position: relative;\r\n  z-index: 2;\r\n  color: #fff;\r\n  font-size: 12px;\r\n  font-weight: 600;\r\n  text-shadow: 0 1px 4px rgba(0,0,0,0.6);\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.fr-s01-tap-hint {\r\n  position: relative;\r\n  z-index: 2;\r\n  font-size: 11px;\r\n  color: rgba(255,255,255,0.4);\r\n  font-weight: 500;\r\n  animation: fr01blink 2s infinite;\r\n}\r\n\r\n@keyframes fr01blink {\r\n  0%, 100% { opacity: 0.4; }\r\n  50% { opacity: 1; }\r\n}\r\n\r\n\/* STATE 2: LOGIN SCREEN *\/\r\n.fr-s01-login {\r\n  background: #0d0d0d;\r\n  padding: 80px 28px 40px;\r\n  align-items: stretch;\r\n  justify-content: flex-start;\r\n}\r\n\r\n.fr-s01-login-logo {\r\n  width: 64px;\r\n  height: 64px;\r\n  border-radius: 16px;\r\n  overflow: hidden;\r\n  margin: 0 auto 20px;\r\n  box-shadow: 0 4px 16px rgba(255, 59, 59, 0.3);\r\n}\r\n\r\n.fr-s01-login-logo img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n.fr-s01-login-title {\r\n  font-size: 20px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  text-align: center;\r\n  margin: 0 0 6px;\r\n}\r\n\r\n.fr-s01-login-sub {\r\n  font-size: 12px;\r\n  color: rgba(255,255,255,0.4);\r\n  text-align: center;\r\n  margin: 0 0 28px;\r\n}\r\n\r\n.fr-s01-input {\r\n  width: 100%;\r\n  background: rgba(255,255,255,0.05);\r\n  border: 1px solid rgba(255,255,255,0.1);\r\n  border-radius: 12px;\r\n  padding: 14px 16px;\r\n  font-size: 13px;\r\n  color: rgba(255,255,255,0.7);\r\n  margin-bottom: 12px;\r\n  font-family: inherit;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.fr-s01-input-pass {\r\n  width: 100%;\r\n  background: rgba(255,255,255,0.05);\r\n  border: 1px solid rgba(255,255,255,0.1);\r\n  border-radius: 12px;\r\n  padding: 14px 16px;\r\n  font-size: 13px;\r\n  color: rgba(255,255,255,0.7);\r\n  margin-bottom: 20px;\r\n  font-family: inherit;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.fr-s01-login-btn {\r\n  width: 100%;\r\n  background: #ff3b3b;\r\n  color: #fff;\r\n  border: none;\r\n  border-radius: 980px;\r\n  padding: 14px;\r\n  font-size: 14px;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  transition: transform 0.2s, box-shadow 0.2s;\r\n  font-family: inherit;\r\n  margin-bottom: 16px;\r\n}\r\n\r\n.fr-s01-login-btn:hover {\r\n  transform: scale(1.02);\r\n  box-shadow: 0 4px 20px rgba(255, 59, 59, 0.4);\r\n}\r\n\r\n.fr-s01-login-divider {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  margin-bottom: 16px;\r\n}\r\n\r\n.fr-s01-login-divider::before,\r\n.fr-s01-login-divider::after {\r\n  content: '';\r\n  flex: 1;\r\n  height: 1px;\r\n  background: rgba(255,255,255,0.08);\r\n}\r\n\r\n.fr-s01-login-divider span {\r\n  font-size: 10px;\r\n  color: rgba(255,255,255,0.3);\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n}\r\n\r\n.fr-s01-social-btns {\r\n  display: flex;\r\n  gap: 10px;\r\n}\r\n\r\n.fr-s01-social {\r\n  flex: 1;\r\n  background: rgba(255,255,255,0.05);\r\n  border: 1px solid rgba(255,255,255,0.08);\r\n  border-radius: 12px;\r\n  padding: 12px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 6px;\r\n  font-size: 11px;\r\n  font-weight: 600;\r\n  color: rgba(255,255,255,0.7);\r\n  cursor: pointer;\r\n  transition: border-color 0.2s;\r\n}\r\n\r\n.fr-s01-social:hover {\r\n  border-color: rgba(255,255,255,0.2);\r\n}\r\n\r\n.fr-s01-social i {\r\n  font-size: 14px;\r\n}\r\n\r\n.fr-s01-signup {\r\n  text-align: center;\r\n  margin-top: 20px;\r\n  font-size: 11px;\r\n  color: rgba(255,255,255,0.35);\r\n}\r\n\r\n.fr-s01-signup a {\r\n  color: #ff3b3b;\r\n  text-decoration: none;\r\n  font-weight: 700;\r\n}\r\n\r\n\/* STATE 3: LOADING SCREEN *\/\r\n.fr-s01-loading {\r\n  background: #0d0d0d;\r\n}\r\n\r\n.fr-s01-load-icon {\r\n  width: 64px;\r\n  height: 64px;\r\n  border-radius: 16px;\r\n  overflow: hidden;\r\n  margin-bottom: 20px;\r\n  animation: fr01bounce 1s infinite;\r\n}\r\n\r\n.fr-s01-load-icon img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n@keyframes fr01bounce {\r\n  0%, 100% { transform: translateY(0); }\r\n  50% { transform: translateY(-8px); }\r\n}\r\n\r\n.fr-s01-load-text {\r\n  font-size: 13px;\r\n  color: rgba(255,255,255,0.5);\r\n  font-weight: 600;\r\n  margin-bottom: 20px;\r\n}\r\n\r\n.fr-s01-load-bar-wrap {\r\n  width: 160px;\r\n  height: 4px;\r\n  background: rgba(255,255,255,0.08);\r\n  border-radius: 2px;\r\n  overflow: hidden;\r\n}\r\n\r\n.fr-s01-load-bar {\r\n  height: 100%;\r\n  width: 0%;\r\n  background: #ff3b3b;\r\n  border-radius: 2px;\r\n  transition: width 1.8s ease;\r\n}\r\n\r\n.fr-s01-load-bar.go {\r\n  width: 100%;\r\n}\r\n\r\n\/* STATE 4: DASHBOARD *\/\r\n.fr-s01-dash {\r\n  background: #0d0d0d;\r\n  padding: 54px 20px 130px;\r\n  align-items: stretch;\r\n  justify-content: flex-start;\r\n  overflow-y: auto;\r\n  -webkit-overflow-scrolling: touch;\r\n  scrollbar-width: none;\r\n}\r\n\r\n.fr-s01-dash::-webkit-scrollbar { display: none; }\r\n\r\n.fr-s01-dash-greeting {\r\n  font-size: 22px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 10px 0 12px;\r\n  line-height: 1.2;\r\n}\r\n\r\n.fr-s01-dash-points {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n  background: #1b0706;\r\n  color: #ff3b3b;\r\n  padding: 8px 14px;\r\n  border-radius: 999px;\r\n  font-size: 13px;\r\n  font-weight: 800;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.fr-s01-dash-section {\r\n  margin-bottom: 22px;\r\n}\r\n\r\n.fr-s01-dash-section-title {\r\n  font-size: 15px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 12px;\r\n}\r\n\r\n\/* Report Cards *\/\r\n.fr-s01-dash-report {\r\n  display: grid;\r\n  grid-template-columns: 44px 1fr 14px;\r\n  align-items: center;\r\n  gap: 10px;\r\n  padding: 10px;\r\n  margin-bottom: 8px;\r\n  background: rgba(255,255,255,0.03);\r\n  border-radius: 12px;\r\n  border: 1px solid rgba(255,255,255,0.06);\r\n}\r\n\r\n.fr-s01-dash-rthumb {\r\n  width: 44px;\r\n  height: 44px;\r\n  border-radius: 10px;\r\n  overflow: hidden;\r\n}\r\n\r\n.fr-s01-dash-rthumb img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  display: block;\r\n}\r\n\r\n.fr-s01-dash-rname {\r\n  font-size: 13px;\r\n  font-weight: 700;\r\n  color: #fff;\r\n  margin: 0;\r\n}\r\n\r\n.fr-s01-dash-rmeta {\r\n  font-size: 10px;\r\n  color: rgba(255,255,255,0.4);\r\n  margin: 2px 0 0;\r\n}\r\n\r\n.fr-s01-dash-chevron {\r\n  color: rgba(255,255,255,0.3);\r\n  font-size: 12px;\r\n}\r\n\r\n\/* Red Link *\/\r\n.fr-s01-dash-link {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n  color: #ff3b3b;\r\n  font-size: 12px;\r\n  font-weight: 700;\r\n  text-decoration: none;\r\n  margin-top: 6px;\r\n}\r\n\r\n\/* Leaderboard *\/\r\n.fr-s01-dash-leader {\r\n  display: grid;\r\n  grid-template-columns: 26px 1fr auto;\r\n  align-items: center;\r\n  gap: 10px;\r\n  margin-bottom: 10px;\r\n}\r\n\r\n.fr-s01-dash-rank {\r\n  font-size: 13px;\r\n  font-weight: 800;\r\n  color: rgba(255,255,255,0.35);\r\n}\r\n\r\n.fr-s01-dash-rank.gold { color: #ffb000; }\r\n\r\n.fr-s01-dash-lname {\r\n  font-size: 13px;\r\n  font-weight: 600;\r\n  color: #fff;\r\n}\r\n\r\n.fr-s01-dash-lscore {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  background: #1b0706;\r\n  color: #ff3b3b;\r\n  padding: 5px 10px;\r\n  border-radius: 999px;\r\n  font-size: 10px;\r\n  font-weight: 800;\r\n}\r\n\r\n\/* Article Rows *\/\r\n.fr-s01-dash-article {\r\n  display: grid;\r\n  grid-template-columns: 44px 1fr 14px;\r\n  align-items: center;\r\n  gap: 10px;\r\n  padding: 10px;\r\n  margin-bottom: 8px;\r\n  background: rgba(255,255,255,0.03);\r\n  border-radius: 12px;\r\n  border: 1px solid rgba(255,255,255,0.06);\r\n}\r\n\r\n.fr-s01-dash-athumb {\r\n  width: 44px;\r\n  height: 44px;\r\n  border-radius: 10px;\r\n  overflow: hidden;\r\n}\r\n\r\n.fr-s01-dash-athumb img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n  display: block;\r\n}\r\n\r\n\/* ===== BOTTOM NAV \u2014 SITS ON PHONE LEVEL ===== *\/\r\n.fr-s01-phone-nav {\r\n  position: absolute;\r\n  left: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  height: 110px;\r\n  background-image: url('https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Nav-Menu-Full-scaled.webp');\r\n  background-repeat: no-repeat;\r\n  background-position: bottom center;\r\n  background-size: 100% auto;\r\n  z-index: 50;\r\n  display: none;\r\n}\r\n\r\n.fr-s01-phone-nav.visible {\r\n  display: block;\r\n}\r\n\r\n.fr-s01-pn-icon {\r\n  position: absolute;\r\n  bottom: 24px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: rgba(255,255,255,0.72);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s01-pn-icon svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.5;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n.fr-s01-pn-icon.pn-home { left: 30px; color: #fff; }\r\n.fr-s01-pn-icon.pn-reports { left: 88px; }\r\n.fr-s01-pn-icon.pn-articles { right: 88px; }\r\n.fr-s01-pn-icon.pn-profile { right: 30px; }\r\n\r\n.fr-s01-pn-camera {\r\n  position: absolute;\r\n  left: 50%;\r\n  top: 58%;\r\n  transform: translate(-50%, -50%);\r\n  margin-top: -16px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: #fff;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s01-pn-camera svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.6;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n\/* RESET BUTTON *\/\r\n.fr-s01-reset {\r\n  position: absolute;\r\n  top: 16px;\r\n  right: -44px;\r\n  width: 36px;\r\n  height: 36px;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border: 1px solid rgba(255, 59, 59, 0.3);\r\n  border-radius: 50%;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  cursor: pointer;\r\n  transition: background 0.2s;\r\n  z-index: 30;\r\n}\r\n\r\n.fr-s01-reset:hover {\r\n  background: rgba(255, 59, 59, 0.25);\r\n}\r\n\r\n.fr-s01-reset i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n}\r\n\r\n\/* MOBILE *\/\r\n@media (max-width: 768px) {\r\n  .fr-step01 { padding: 50px 20px; }\r\n  .fr-step01-grid {\r\n    grid-template-columns: 1fr;\r\n    gap: 40px;\r\n    text-align: center;\r\n  }\r\n  .fr-step01-info h2 { font-size: 1.7rem; }\r\n  .fr-step01-features li { justify-content: center; }\r\n  .fr-s01-phone { width: 280px; height: 580px; }\r\n  .fr-s01-reset { top: auto; bottom: -44px; right: 50%; transform: translateX(50%); }\r\n}\r\n<\/style>\r\n\r\n<div class=\"fr-step01\">\r\n  <div class=\"fr-step01-grid\">\r\n\r\n    <!-- LEFT \u2014 INFO -->\r\n    <div class=\"fr-step01-info\">\r\n      <div class=\"fr-step01-tag\">\r\n        <i class=\"fas fa-play\"><\/i> Step 01\r\n      <\/div>\r\n      <h2>Open Fire Rant<br>in seconds<\/h2>\r\n      <p>Tap the app, sign in, and land on your dashboard in under 10 seconds. No friction \u2014 just open and go.<\/p>\r\n      <ul class=\"fr-step01-features\">\r\n        <li><i class=\"fas fa-bolt\"><\/i> Instant load \u2014 minimal login wall<\/li>\r\n        <li><i class=\"fas fa-lock\"><\/i> Secure login with social sign-in<\/li>\r\n        <li><i class=\"fas fa-home\"><\/i> Dashboard-first design<\/li>\r\n        <li><i class=\"fas fa-map-marker-alt\"><\/i> GPS auto-detects your location<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n\r\n    <!-- RIGHT \u2014 iPHONE -->\r\n    <div class=\"fr-step01-phone-col\">\r\n      <div class=\"fr-s01-phone\" id=\"frS01Phone\">\r\n\r\n        <!-- Status Bar -->\r\n        <div class=\"fr-s01-status\">\r\n          <span>2:34<\/span>\r\n          <div class=\"fr-s01-island\">\r\n            <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/antScroll-scaled.png\" alt=\"Ant\">\r\n          <\/div>\r\n          <span class=\"fr-s01-status-right\">5G  77%<\/span>\r\n        <\/div>\r\n\r\n        <!-- STATE 1: Home Screen -->\r\n        <div class=\"fr-s01-state fr-s01-home active\" id=\"frS01Home\">\r\n          <div class=\"fr-s01-appicon\" id=\"frS01AppIcon\">\r\n            <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2025\/06\/ChatGPT-Image-Jun-13-2025-10_39_07-PM.png\" alt=\"Fire Rant\">\r\n          <\/div>\r\n          <span class=\"fr-s01-appname\">\u706b\u6012<\/span>\r\n          <span class=\"fr-s01-tap-hint\">Tap to open<\/span>\r\n        <\/div>\r\n\r\n        <!-- STATE 2: Login Screen -->\r\n        <div class=\"fr-s01-state fr-s01-login\" id=\"frS01Login\">\r\n          <div class=\"fr-s01-login-logo\">\r\n            <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2025\/06\/ChatGPT-Image-Jun-13-2025-10_39_07-PM.png\" alt=\"Fire Rant\">\r\n          <\/div>\r\n          <p class=\"fr-s01-login-title\">Welcome back<\/p>\r\n          <p class=\"fr-s01-login-sub\">Sign in to continue reporting<\/p>\r\n\r\n          <div class=\"fr-s01-input\">james@firerant.com.au<\/div>\r\n          <div class=\"fr-s01-input-pass\">\u2022\u2022\u2022\u2022\u2022\u2022\u2022\u2022<\/div>\r\n\r\n          <button class=\"fr-s01-login-btn\" id=\"frS01LoginBtn\">Sign In<\/button>\r\n\r\n          <div class=\"fr-s01-login-divider\"><span>or continue with<\/span><\/div>\r\n\r\n          <div class=\"fr-s01-social-btns\">\r\n            <div class=\"fr-s01-social\"><i class=\"fab fa-apple\"><\/i> Apple<\/div>\r\n            <div class=\"fr-s01-social\"><i class=\"fab fa-google\"><\/i> Google<\/div>\r\n          <\/div>\r\n\r\n          <p class=\"fr-s01-signup\">New here? <a href=\"#\">Create account<\/a><\/p>\r\n        <\/div>\r\n\r\n        <!-- STATE 3: Loading Screen -->\r\n        <div class=\"fr-s01-state fr-s01-loading\" id=\"frS01Loading\">\r\n          <div class=\"fr-s01-load-icon\">\r\n            <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2025\/06\/ChatGPT-Image-Jun-13-2025-10_39_07-PM.png\" alt=\"Fire Rant\">\r\n          <\/div>\r\n          <span class=\"fr-s01-load-text\">Loading your dashboard...<\/span>\r\n          <div class=\"fr-s01-load-bar-wrap\">\r\n            <div class=\"fr-s01-load-bar\" id=\"frS01LoadBar\"><\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- STATE 4: DASHBOARD (scrollable content) -->\r\n        <div class=\"fr-s01-state fr-s01-dash\" id=\"frS01Dash\">\r\n\r\n          <!-- Greeting -->\r\n          <p class=\"fr-s01-dash-greeting\">\u4e0b\u5348\u597d\uff0c,<br>\u6770\u91cc\u7c73<\/p>\r\n          <div class=\"fr-s01-dash-points\"><i class=\"fas fa-star\"><\/i> 660 \u5206<\/div>\r\n\r\n          <!-- Recent Reports -->\r\n          <div class=\"fr-s01-dash-section\">\r\n            <p class=\"fr-s01-dash-section-title\">\u8fd1\u671f\u62a5\u9053<\/p>\r\n\r\n            <div class=\"fr-s01-dash-report\">\r\n              <div class=\"fr-s01-dash-rthumb\">\r\n                <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Fire ant\">\r\n              <\/div>\r\n              <div>\r\n                <p class=\"fr-s01-dash-rname\">\u66f4\u591a\u8682\u8681<\/p>\r\n                <p class=\"fr-s01-dash-rmeta\">2026\u5e745\u670821\u65e5<\/p>\r\n              <\/div>\r\n              <i class=\"fas fa-chevron-right fr-s01-dash-chevron\"><\/i>\r\n            <\/div>\r\n\r\n            <div class=\"fr-s01-dash-report\">\r\n              <div class=\"fr-s01-dash-rthumb\">\r\n                <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Fire ant\">\r\n              <\/div>\r\n              <div>\r\n                <p class=\"fr-s01-dash-rname\">\u8bfb\u5199\u7aef\u53e3<\/p>\r\n                <p class=\"fr-s01-dash-rmeta\">\u6d4b\u8bd5 \u00b7 2026\u5e742\u670823\u65e5<\/p>\r\n              <\/div>\r\n              <i class=\"fas fa-chevron-right fr-s01-dash-chevron\"><\/i>\r\n            <\/div>\r\n\r\n            <a class=\"fr-s01-dash-link\" href=\"#\"><i class=\"fas fa-list\"><\/i> \u6240\u6709\u62a5\u544a<\/a>\r\n          <\/div>\r\n\r\n          <!-- Leaderboard -->\r\n          <div class=\"fr-s01-dash-section\">\r\n            <p class=\"fr-s01-dash-section-title\">\u6392\u884c\u699c<\/p>\r\n\r\n            <div class=\"fr-s01-dash-leader\">\r\n              <span class=\"fr-s01-dash-rank gold\">#1<\/span>\r\n              <span class=\"fr-s01-dash-lname\">\u6770\u91cc\u7c73<\/span>\r\n              <span class=\"fr-s01-dash-lscore\"><i class=\"fas fa-star\"><\/i> 660<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"fr-s01-dash-leader\">\r\n              <span class=\"fr-s01-dash-rank\">#2<\/span>\r\n              <span class=\"fr-s01-dash-lname\">\u4ea8\u5229\u4e00\u4e16<\/span>\r\n              <span class=\"fr-s01-dash-lscore\"><i class=\"fas fa-star\"><\/i> 130<\/span>\r\n            <\/div>\r\n\r\n            <a class=\"fr-s01-dash-link\" href=\"#\"><i class=\"fas fa-chart-bar\"><\/i> \u67e5\u770b\u5b8c\u6574\u6392\u884c\u699c<\/a>\r\n          <\/div>\r\n\r\n          <!-- Articles -->\r\n          <div class=\"fr-s01-dash-section\">\r\n            <p class=\"fr-s01-dash-section-title\">\u6587\u7ae0<\/p>\r\n\r\n            <div class=\"fr-s01-dash-article\">\r\n              <div class=\"fr-s01-dash-athumb\">\r\n                <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Fire ant\">\r\n              <\/div>\r\n              <div>\r\n                <p class=\"fr-s01-dash-rname\">\u5982\u4f55\u5904\u7406\u8682\u8681<\/p>\r\n                <p class=\"fr-s01-dash-rmeta\">\u9884\u9632\u4e0e\u63a7\u5236<\/p>\r\n              <\/div>\r\n              <i class=\"fas fa-chevron-right fr-s01-dash-chevron\"><\/i>\r\n            <\/div>\r\n\r\n            <div class=\"fr-s01-dash-article\">\r\n              <div class=\"fr-s01-dash-athumb\">\r\n                <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Fire ant\">\r\n              <\/div>\r\n              <div>\r\n                <p class=\"fr-s01-dash-rname\">\u5982\u4f55\u8bc6\u522b\u706b\u8681<\/p>\r\n                <p class=\"fr-s01-dash-rmeta\">\u706b\u8681\u8bc6\u522b<\/p>\r\n              <\/div>\r\n              <i class=\"fas fa-chevron-right fr-s01-dash-chevron\"><\/i>\r\n            <\/div>\r\n\r\n            <a class=\"fr-s01-dash-link\" href=\"#\"><i class=\"fas fa-book-open\"><\/i> \u67e5\u770b\u6240\u6709\u6587\u7ae0<\/a>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n        <!-- ===== BOTTOM NAV (OUTSIDE scrollable state \u2014 stays fixed) ===== -->\r\n        <div class=\"fr-s01-phone-nav\" id=\"frS01Nav\">\r\n          <div class=\"fr-s01-pn-camera\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M7 7h2l1.5-2h3L15 7h2a3 3 0 0 1 3 3v7a3 3 0 0 1-3 3H7a3 3 0 0 1-3-3v-7a3 3 0 0 1 3-3z\"><\/path>\r\n              <circle cx=\"12\" cy=\"13.5\" r=\"3.2\"><\/circle>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s01-pn-icon pn-home\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M3 11.5L12 4l9 7.5\"><\/path>\r\n              <path d=\"M5.5 10.5V20h5v-5h3v5h5v-9.5\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s01-pn-icon pn-reports\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M8 4h8\"><\/path>\r\n              <path d=\"M9 4a3 3 0 0 0 6 0\"><\/path>\r\n              <rect x=\"5\" y=\"5\" width=\"14\" height=\"16\" rx=\"2\"><\/rect>\r\n              <path d=\"M8 11h8\"><\/path>\r\n              <path d=\"M8 15h8\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s01-pn-icon pn-articles\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M4 5.5c2.5 0 5 .4 8 2.2v12c-3-1.8-5.5-2.2-8-2.2z\"><\/path>\r\n              <path d=\"M20 5.5c-2.5 0-5 .4-8 2.2v12c3-1.8 5.5-2.2 8-2.2z\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s01-pn-icon pn-profile\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <circle cx=\"12\" cy=\"8\" r=\"3.5\"><\/circle>\r\n              <path d=\"M5 20c1.2-4 4-6 7-6s5.8 2 7 6\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Reset Button -->\r\n        <div class=\"fr-s01-reset\" id=\"frS01Reset\" title=\"Reset\">\r\n          <i class=\"fas fa-redo-alt\"><\/i>\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script type=\"text\/javascript\">\r\ndocument.addEventListener('DOMContentLoaded', function() {\r\n  var home = document.getElementById('frS01Home');\r\n  var login = document.getElementById('frS01Login');\r\n  var loading = document.getElementById('frS01Loading');\r\n  var dash = document.getElementById('frS01Dash');\r\n  var navEl = document.getElementById('frS01Nav');\r\n  var appIcon = document.getElementById('frS01AppIcon');\r\n  var loginBtn = document.getElementById('frS01LoginBtn');\r\n  var loadBar = document.getElementById('frS01LoadBar');\r\n  var resetBtn = document.getElementById('frS01Reset');\r\n\r\n  if (!home || !appIcon) return;\r\n\r\n  function hideAll() {\r\n    home.classList.remove('active');\r\n    login.classList.remove('active');\r\n    loading.classList.remove('active');\r\n    dash.classList.remove('active');\r\n    loadBar.classList.remove('go');\r\n    loadBar.style.width = '0%';\r\n    navEl.classList.remove('visible');\r\n  }\r\n\r\n  function showState(el) {\r\n    hideAll();\r\n    el.classList.add('active');\r\n    if (el === dash) {\r\n      navEl.classList.add('visible');\r\n    }\r\n  }\r\n\r\n  appIcon.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(login);\r\n  });\r\n\r\n  loginBtn.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(loading);\r\n    setTimeout(function() { loadBar.classList.add('go'); }, 100);\r\n    setTimeout(function() { showState(dash); }, 2200);\r\n  });\r\n\r\n  resetBtn.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(home);\r\n  });\r\n});\r\n<\/script>\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-8c3278e elementor-widget elementor-widget-html\" data-id=\"8c3278e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!-- ============================================\r\n     FIRE RANT \u2014 APP PAGE STEP 02\r\n     Land on a clear reporting dashboard\r\n     2-Column: Info left, Real mockup right\r\n     SVG bottom nav icons\r\n============================================ -->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<style>\r\n.fr-step02 {\r\n  background: #0a0a0a;\r\n  padding: 80px 40px;\r\n  font-family: Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n  border-top: 1px solid rgba(255,255,255,0.04);\r\n}\r\n\r\n.fr-step02-grid {\r\n  max-width: 1100px;\r\n  margin: 0 auto;\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 60px;\r\n  align-items: center;\r\n}\r\n\r\n\/* LEFT COLUMN \u2014 INFO *\/\r\n.fr-step02-info {}\r\n\r\n.fr-step02-tag {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border: 1px solid rgba(255, 59, 59, 0.25);\r\n  border-radius: 980px;\r\n  padding: 6px 14px;\r\n  font-size: 0.75rem;\r\n  font-weight: 700;\r\n  color: #ff3b3b;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.fr-step02-info h2 {\r\n  font-size: 2.2rem;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 16px;\r\n  letter-spacing: -0.5px;\r\n  line-height: 1.15;\r\n}\r\n\r\n.fr-step02-info > p {\r\n  font-size: 1.05rem;\r\n  color: rgba(255, 255, 255, 0.6);\r\n  line-height: 1.7;\r\n  margin: 0 0 28px;\r\n}\r\n\r\n.fr-step02-features {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n}\r\n\r\n.fr-step02-features li {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 10px 0;\r\n  font-size: 0.95rem;\r\n  color: rgba(255, 255, 255, 0.75);\r\n}\r\n\r\n.fr-step02-features li i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n  width: 28px;\r\n  height: 28px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border-radius: 8px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n\/* RIGHT COLUMN \u2014 PHONE MOCKUP *\/\r\n.fr-step02-phone-col {\r\n  display: flex;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s02-phone {\r\n  position: relative;\r\n  width: 320px;\r\n  height: 660px;\r\n  background: #000;\r\n  border-radius: 48px;\r\n  border: 4px solid #2a2a2a;\r\n  box-shadow: 0 30px 80px rgba(0,0,0,.8);\r\n  overflow: hidden;\r\n  font-family: Inter, -apple-system, Arial, sans-serif;\r\n}\r\n\r\n\/* Status Bar *\/\r\n.fr-s02-status {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  display: grid;\r\n  grid-template-columns: 48px 1fr 68px;\r\n  align-items: center;\r\n  padding: 14px 24px 0;\r\n  font-size: 10px;\r\n  color: #fff;\r\n  font-weight: 700;\r\n  z-index: 10;\r\n}\r\n\r\n.fr-s02-status-right {\r\n  text-align: right;\r\n  font-weight: 600;\r\n}\r\n\r\n.fr-s02-island {\r\n  width: 140px;\r\n  height: 34px;\r\n  background: #000;\r\n  border-radius: 999px;\r\n  margin: 0 auto;\r\n  border: 1.5px solid #ff3b3b;\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 0 14px;\r\n}\r\n\r\n.fr-s02-island img {\r\n  width: 18px;\r\n  height: 18px;\r\n  object-fit: contain;\r\n}\r\n\r\n\/* Scrollable Content *\/\r\n.fr-s02-content {\r\n  position: absolute;\r\n  inset: 0;\r\n  overflow-y: auto;\r\n  padding: 54px 20px 140px;\r\n  scrollbar-width: none;\r\n}\r\n\r\n.fr-s02-content::-webkit-scrollbar { display: none; }\r\n\r\n\/* Greeting *\/\r\n.fr-s02-greeting {\r\n  font-size: 24px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 16px 0 12px;\r\n  line-height: 1.2;\r\n}\r\n\r\n\/* Points Pill *\/\r\n.fr-s02-points {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n  background: #1b0706;\r\n  color: #ff3b3b;\r\n  padding: 8px 14px;\r\n  border-radius: 999px;\r\n  font-size: 13px;\r\n  font-weight: 800;\r\n  margin-bottom: 28px;\r\n}\r\n\r\n\/* Section *\/\r\n.fr-s02-section {\r\n  margin-bottom: 26px;\r\n}\r\n\r\n.fr-s02-section-title {\r\n  font-size: 16px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 14px;\r\n}\r\n\r\n\/* Report Cards *\/\r\n.fr-s02-report {\r\n  display: grid;\r\n  grid-template-columns: 50px 1fr 14px;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 10px;\r\n  margin-bottom: 10px;\r\n  background: rgba(255,255,255,0.03);\r\n  border-radius: 12px;\r\n  border: 1px solid rgba(255,255,255,0.06);\r\n}\r\n\r\n.fr-s02-thumb {\r\n  width: 50px;\r\n  height: 50px;\r\n  border-radius: 10px;\r\n  overflow: hidden;\r\n}\r\n\r\n.fr-s02-thumb img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n.fr-s02-report-title {\r\n  font-size: 14px;\r\n  font-weight: 700;\r\n  color: #fff;\r\n  margin: 0 0 3px;\r\n}\r\n\r\n.fr-s02-report-sub {\r\n  font-size: 11px;\r\n  color: rgba(255,255,255,0.45);\r\n  margin: 0;\r\n}\r\n\r\n.fr-s02-chevron {\r\n  color: rgba(255,255,255,0.3);\r\n  font-size: 16px;\r\n}\r\n\r\n\/* Red Link *\/\r\n.fr-s02-red-link {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n  color: #ff3b3b;\r\n  font-size: 13px;\r\n  font-weight: 700;\r\n  text-decoration: none;\r\n  margin-top: 6px;\r\n}\r\n\r\n.fr-s02-red-link i {\r\n  font-size: 12px;\r\n}\r\n\r\n\/* Leaderboard *\/\r\n.fr-s02-leader {\r\n  display: grid;\r\n  grid-template-columns: 30px 1fr auto;\r\n  align-items: center;\r\n  gap: 10px;\r\n  margin-bottom: 12px;\r\n}\r\n\r\n.fr-s02-rank {\r\n  font-size: 14px;\r\n  font-weight: 800;\r\n  color: rgba(255,255,255,0.35);\r\n}\r\n\r\n.fr-s02-rank.gold { color: #ffb000; }\r\n\r\n.fr-s02-name {\r\n  font-size: 15px;\r\n  font-weight: 600;\r\n  color: #fff;\r\n}\r\n\r\n.fr-s02-score {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 4px;\r\n  background: #1b0706;\r\n  color: #ff3b3b;\r\n  padding: 6px 10px;\r\n  border-radius: 999px;\r\n  font-size: 11px;\r\n  font-weight: 800;\r\n}\r\n\r\n\/* Articles Preview *\/\r\n.fr-s02-article-row {\r\n  display: grid;\r\n  grid-template-columns: 50px 1fr 14px;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 10px;\r\n  margin-bottom: 10px;\r\n  background: rgba(255,255,255,0.03);\r\n  border-radius: 12px;\r\n  border: 1px solid rgba(255,255,255,0.06);\r\n}\r\n\r\n.fr-s02-article-thumb {\r\n  width: 50px;\r\n  height: 50px;\r\n  border-radius: 10px;\r\n  overflow: hidden;\r\n}\r\n\r\n.fr-s02-article-thumb img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n\/* Bottom Nav *\/\r\n.fr-s02-nav {\r\n  position: absolute;\r\n  left: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  height: 120px;\r\n  background-image: url('https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Nav-Menu-Full-scaled.webp');\r\n  background-repeat: no-repeat;\r\n  background-position: bottom center;\r\n  background-size: 100% auto;\r\n  z-index: 20;\r\n}\r\n\r\n.fr-s02-nav-icon {\r\n  position: absolute;\r\n  bottom: 24px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: rgba(255,255,255,0.72);\r\n  z-index: 25;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s02-nav-icon svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.5;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n.fr-s02-nav-icon.n-home { left: 30px; color: #fff; }\r\n.fr-s02-nav-icon.n-reports { left: 88px; }\r\n.fr-s02-nav-icon.n-articles { right: 88px; }\r\n.fr-s02-nav-icon.n-profile { right: 30px; }\r\n\r\n.fr-s02-nav-camera {\r\n  position: absolute;\r\n  left: 50%;\r\n  top: 58%;\r\n  transform: translate(-50%, -50%);\r\n  margin-top: -16px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: #fff;\r\n  z-index: 26;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s02-nav-camera svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.6;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n\/* MOBILE *\/\r\n@media (max-width: 768px) {\r\n  .fr-step02 { padding: 50px 20px; }\r\n  .fr-step02-grid {\r\n    grid-template-columns: 1fr;\r\n    gap: 40px;\r\n    text-align: center;\r\n  }\r\n  .fr-step02-info h2 { font-size: 1.7rem; }\r\n  .fr-step02-features li { justify-content: center; }\r\n  .fr-s02-phone { width: 280px; height: 580px; }\r\n}\r\n<\/style>\r\n\r\n<div class=\"fr-step02\">\r\n  <div class=\"fr-step02-grid\">\r\n\r\n    <!-- LEFT \u2014 INFO -->\r\n    <div class=\"fr-step02-info\">\r\n      <div class=\"fr-step02-tag\">\r\n        <i class=\"fas fa-th-large\"><\/i> Step 02\r\n      <\/div>\r\n      <h2>Land on a clear<br>reporting dashboard<\/h2>\r\n      <p>Everything you need at a glance \u2014 your points, recent reports, leaderboard position, and quick actions. No hunting through menus.<\/p>\r\n      <ul class=\"fr-step02-features\">\r\n        <li><i class=\"fas fa-trophy\"><\/i> Live points & community ranking<\/li>\r\n        <li><i class=\"fas fa-file-alt\"><\/i> Recent reports with status tracking<\/li>\r\n        <li><i class=\"fas fa-book-open\"><\/i> Education content & identification guides<\/li>\r\n        <li><i class=\"fas fa-plus-circle\"><\/i> One-tap to create new report<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n\r\n    <!-- RIGHT \u2014 iPHONE MOCKUP -->\r\n    <div class=\"fr-step02-phone-col\">\r\n      <div class=\"fr-s02-phone\">\r\n\r\n        <!-- Status Bar -->\r\n        <div class=\"fr-s02-status\">\r\n          <span>2:34<\/span>\r\n          <div class=\"fr-s02-island\">\r\n            <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/antScroll-scaled.png\" alt=\"Ant\">\r\n          <\/div>\r\n          <span class=\"fr-s02-status-right\">5G  77%<\/span>\r\n        <\/div>\r\n\r\n        <!-- Scrollable Content -->\r\n        <div class=\"fr-s02-content\">\r\n\r\n          <!-- Greeting -->\r\n          <p class=\"fr-s02-greeting\">\u4e0b\u5348\u597d\uff0c,<br>\u8a79\u59c6\u65af<\/p>\r\n          <div class=\"fr-s02-points\"><i class=\"fas fa-star\" aria-hidden=\"true\"><\/i> 660 \u5206<\/div>\r\n\r\n          <!-- Recent Reports -->\r\n          <div class=\"fr-s02-section\">\r\n            <p class=\"fr-s02-section-title\">\u8fd1\u671f\u62a5\u9053<\/p>\r\n\r\n            <div class=\"fr-s02-report\">\r\n              <div class=\"fr-s02-thumb\">\r\n                <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Report\">\r\n              <\/div>\r\n              <div>\r\n                <p class=\"fr-s02-report-title\">\u66f4\u591a\u8682\u8681<\/p>\r\n                <p class=\"fr-s02-report-sub\">2026\u5e745\u670821\u65e5<\/p>\r\n              <\/div>\r\n              <span class=\"fr-s02-chevron\">\u203a<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"fr-s02-report\">\r\n              <div class=\"fr-s02-thumb\">\r\n                <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Report\">\r\n              <\/div>\r\n              <div>\r\n                <p class=\"fr-s02-report-title\">\u8bfb\u5199\u7aef\u53e3<\/p>\r\n                <p class=\"fr-s02-report-sub\">\u6d4b\u8bd5 \u00b7 2026\u5e742\u670823\u65e5<\/p>\r\n              <\/div>\r\n              <span class=\"fr-s02-chevron\">\u203a<\/span>\r\n            <\/div>\r\n\r\n            <a class=\"fr-s02-red-link\" href=\"#\"><i class=\"fas fa-bars\"><\/i> \u6240\u6709\u62a5\u544a<\/a>\r\n          <\/div>\r\n\r\n          <!-- Leaderboard -->\r\n          <div class=\"fr-s02-section\">\r\n            <p class=\"fr-s02-section-title\">\u6392\u884c\u699c<\/p>\r\n\r\n            <div class=\"fr-s02-leader\">\r\n              <span class=\"fr-s02-rank gold\">#1<\/span>\r\n              <span class=\"fr-s02-name\">\u6770\u91cc\u7c73<\/span>\r\n              <span class=\"fr-s02-score\"><i class=\"fas fa-star\"><\/i> 660<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"fr-s02-leader\">\r\n              <span class=\"fr-s02-rank\">#2<\/span>\r\n              <span class=\"fr-s02-name\">\u4ea8\u5229\u4e00\u4e16<\/span>\r\n              <span class=\"fr-s02-score\"><i class=\"fas fa-star\"><\/i> 130<\/span>\r\n            <\/div>\r\n\r\n            <a class=\"fr-s02-red-link\" href=\"#\"><i class=\"fas fa-chart-bar\"><\/i> \u67e5\u770b\u5b8c\u6574\u6392\u884c\u699c<\/a>\r\n          <\/div>\r\n\r\n          <!-- Articles -->\r\n          <div class=\"fr-s02-section\">\r\n            <p class=\"fr-s02-section-title\">\u6587\u7ae0<\/p>\r\n\r\n            <div class=\"fr-s02-article-row\">\r\n              <div class=\"fr-s02-article-thumb\">\r\n                <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Article\">\r\n              <\/div>\r\n              <div>\r\n                <p class=\"fr-s02-report-title\">\u5982\u4f55\u5904\u7406\u8682\u8681<\/p>\r\n                <p class=\"fr-s02-report-sub\">\u9884\u9632\u4e0e\u63a7\u5236<\/p>\r\n              <\/div>\r\n              <span class=\"fr-s02-chevron\">\u203a<\/span>\r\n            <\/div>\r\n\r\n            <div class=\"fr-s02-article-row\">\r\n              <div class=\"fr-s02-article-thumb\">\r\n                <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Article\">\r\n              <\/div>\r\n              <div>\r\n                <p class=\"fr-s02-report-title\">\u5982\u4f55\u8bc6\u522b\u706b\u8681<\/p>\r\n                <p class=\"fr-s02-report-sub\">\u706b\u8681\u8bc6\u522b<\/p>\r\n              <\/div>\r\n              <span class=\"fr-s02-chevron\">\u203a<\/span>\r\n            <\/div>\r\n\r\n            <a class=\"fr-s02-red-link\" href=\"#\"><i class=\"fas fa-file-alt\"><\/i> \u67e5\u770b\u6240\u6709\u6587\u7ae0<\/a>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n        <!-- Bottom Nav (SVG Icons) -->\r\n        <div class=\"fr-s02-nav\">\r\n          <div class=\"fr-s02-nav-camera\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M7 7h2l1.5-2h3L15 7h2a3 3 0 0 1 3 3v7a3 3 0 0 1-3 3H7a3 3 0 0 1-3-3v-7a3 3 0 0 1 3-3z\"><\/path>\r\n              <circle cx=\"12\" cy=\"13.5\" r=\"3.2\"><\/circle>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s02-nav-icon n-home\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M3 11.5L12 4l9 7.5\"><\/path>\r\n              <path d=\"M5.5 10.5V20h5v-5h3v5h5v-9.5\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s02-nav-icon n-reports\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M8 4h8\"><\/path>\r\n              <path d=\"M9 4a3 3 0 0 0 6 0\"><\/path>\r\n              <rect x=\"5\" y=\"5\" width=\"14\" height=\"16\" rx=\"2\"><\/rect>\r\n              <path d=\"M8 11h8\"><\/path>\r\n              <path d=\"M8 15h8\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s02-nav-icon n-articles\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M4 5.5c2.5 0 5 .4 8 2.2v12c-3-1.8-5.5-2.2-8-2.2z\"><\/path>\r\n              <path d=\"M20 5.5c-2.5 0-5 .4-8 2.2v12c3-1.8 5.5-2.2 8-2.2z\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s02-nav-icon n-profile\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <circle cx=\"12\" cy=\"8\" r=\"3.5\"><\/circle>\r\n              <path d=\"M5 20c1.2-4 4-6 7-6s5.8 2 7 6\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-6731730 elementor-widget elementor-widget-html\" data-id=\"6731730\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!-- ============================================\r\n     FIRE RANT \u2014 APP PAGE STEP 03\r\n     Camera \u2192 Analyzing \u2192 Results\r\n     Uses detailed camera mockup style\r\n============================================ -->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<style>\r\n.fr-step03 {\r\n  background: #0a0a0a;\r\n  padding: 80px 40px;\r\n  font-family: Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n  border-top: 1px solid rgba(255,255,255,0.04);\r\n}\r\n\r\n.fr-step03-grid {\r\n  max-width: 1100px;\r\n  margin: 0 auto;\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 60px;\r\n  align-items: center;\r\n}\r\n\r\n\/* LEFT COLUMN \u2014 INFO *\/\r\n.fr-step03-tag {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border: 1px solid rgba(255, 59, 59, 0.25);\r\n  border-radius: 980px;\r\n  padding: 6px 14px;\r\n  font-size: 0.75rem;\r\n  font-weight: 700;\r\n  color: #ff3b3b;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.fr-step03-info h2 {\r\n  font-size: 2.2rem;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 16px;\r\n  letter-spacing: -0.5px;\r\n  line-height: 1.15;\r\n}\r\n\r\n.fr-step03-info > p {\r\n  font-size: 1.05rem;\r\n  color: rgba(255, 255, 255, 0.6);\r\n  line-height: 1.7;\r\n  margin: 0 0 28px;\r\n}\r\n\r\n.fr-step03-features {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n}\r\n\r\n.fr-step03-features li {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 10px 0;\r\n  font-size: 0.95rem;\r\n  color: rgba(255, 255, 255, 0.75);\r\n}\r\n\r\n.fr-step03-features li i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n  width: 28px;\r\n  height: 28px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border-radius: 8px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n\/* RIGHT COLUMN \u2014 iPHONE *\/\r\n.fr-step03-phone-col {\r\n  display: flex;\r\n  justify-content: center;\r\n  position: relative;\r\n}\r\n\r\n.fr-s03-phone {\r\n  position: relative;\r\n  width: 320px;\r\n  height: 640px;\r\n  background: #000;\r\n  border-radius: 44px;\r\n  border: 4px solid #2a2a2a;\r\n  box-shadow: 0 25px 70px rgba(0,0,0,.75);\r\n  overflow: hidden;\r\n  font-family: Inter, -apple-system, Arial, sans-serif;\r\n}\r\n\r\n\/* Status Bar (shared across states) *\/\r\n.fr-s03-status {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  display: grid;\r\n  grid-template-columns: 48px 1fr 68px;\r\n  align-items: center;\r\n  padding: 14px 24px 0;\r\n  font-size: 10px;\r\n  color: #fff;\r\n  font-weight: 700;\r\n  z-index: 30;\r\n}\r\n\r\n.fr-s03-status-right {\r\n  text-align: right;\r\n  font-weight: 600;\r\n}\r\n\r\n.fr-s03-island {\r\n  width: 140px;\r\n  height: 34px;\r\n  background: #000;\r\n  border-radius: 999px;\r\n  margin: 0 auto;\r\n  border: 1.5px solid #ff3b3b;\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 0 14px;\r\n}\r\n\r\n.fr-s03-island img {\r\n  width: 18px;\r\n  height: 18px;\r\n  object-fit: contain;\r\n}\r\n\r\n\/* ALL STATES *\/\r\n.fr-s03-state {\r\n  position: absolute;\r\n  inset: 0;\r\n  opacity: 0;\r\n  transition: opacity 0.4s ease;\r\n  pointer-events: none;\r\n}\r\n\r\n.fr-s03-state.active {\r\n  opacity: 1;\r\n  pointer-events: auto;\r\n}\r\n\r\n\/* ==========================================\r\n   STATE 1: CAMERA (matches detailed mockup)\r\n   ========================================== *\/\r\n\r\n\/* Video Background *\/\r\n.fr-s03-cam-video {\r\n  position: absolute;\r\n  inset: 0;\r\n  z-index: 0;\r\n}\r\n\r\n.fr-s03-cam-video video {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n\/* Top Controls *\/\r\n.fr-s03-cam-top {\r\n  position: absolute;\r\n  top: 60px;\r\n  left: 20px;\r\n  right: 20px;\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  z-index: 10;\r\n}\r\n\r\n.fr-s03-cam-top-btn {\r\n  width: 36px;\r\n  height: 36px;\r\n  border-radius: 50%;\r\n  background: rgba(0,0,0,0.4);\r\n  backdrop-filter: blur(10px);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: #fff;\r\n  font-size: 14px;\r\n}\r\n\r\n\/* Scan Hint *\/\r\n.fr-s03-cam-hint {\r\n  position: absolute;\r\n  top: 110px;\r\n  left: 0;\r\n  right: 0;\r\n  text-align: center;\r\n  z-index: 10;\r\n  color: rgba(255,255,255,0.7);\r\n  font-size: 12px;\r\n  font-weight: 600;\r\n  letter-spacing: 0.5px;\r\n}\r\n\r\n\/* Viewfinder Overlay *\/\r\n.fr-s03-cam-viewfinder {\r\n  position: absolute;\r\n  top: 50%;\r\n  left: 50%;\r\n  transform: translate(-50%, -50%);\r\n  width: 220px;\r\n  height: 220px;\r\n  border: 2px solid rgba(255,59,59,0.5);\r\n  border-radius: 16px;\r\n  z-index: 5;\r\n}\r\n\r\n.fr-s03-cam-viewfinder::before,\r\n.fr-s03-cam-viewfinder::after {\r\n  content: '';\r\n  position: absolute;\r\n  width: 30px;\r\n  height: 30px;\r\n  border-color: #ff3b3b;\r\n  border-style: solid;\r\n}\r\n\r\n.fr-s03-cam-viewfinder::before {\r\n  top: -2px;\r\n  left: -2px;\r\n  border-width: 3px 0 0 3px;\r\n  border-radius: 16px 0 0 0;\r\n}\r\n\r\n.fr-s03-cam-viewfinder::after {\r\n  top: -2px;\r\n  right: -2px;\r\n  border-width: 3px 3px 0 0;\r\n  border-radius: 0 16px 0 0;\r\n}\r\n\r\n.fr-s03-cam-corner-bl,\r\n.fr-s03-cam-corner-br {\r\n  position: absolute;\r\n  width: 30px;\r\n  height: 30px;\r\n  border-color: #ff3b3b;\r\n  border-style: solid;\r\n}\r\n\r\n.fr-s03-cam-corner-bl {\r\n  bottom: -2px;\r\n  left: -2px;\r\n  border-width: 0 0 3px 3px;\r\n  border-radius: 0 0 0 16px;\r\n}\r\n\r\n.fr-s03-cam-corner-br {\r\n  bottom: -2px;\r\n  right: -2px;\r\n  border-width: 0 3px 3px 0;\r\n  border-radius: 0 0 16px 0;\r\n}\r\n\r\n\/* AI Badge *\/\r\n.fr-s03-cam-ai-badge {\r\n  position: absolute;\r\n  bottom: 220px;\r\n  left: 50%;\r\n  transform: translateX(-50%);\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n  background: rgba(0,0,0,0.5);\r\n  backdrop-filter: blur(10px);\r\n  padding: 8px 14px;\r\n  border-radius: 999px;\r\n  border: 1px solid rgba(255,59,59,0.2);\r\n  z-index: 10;\r\n}\r\n\r\n.fr-s03-cam-ai-badge i {\r\n  color: #ff3b3b;\r\n  font-size: 12px;\r\n}\r\n\r\n.fr-s03-cam-ai-badge span {\r\n  color: rgba(255,255,255,0.8);\r\n  font-size: 11px;\r\n  font-weight: 600;\r\n}\r\n\r\n\/* Bottom Controls *\/\r\n.fr-s03-cam-bottom {\r\n  position: absolute;\r\n  bottom: 30px;\r\n  left: 0;\r\n  right: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 30px;\r\n  z-index: 10;\r\n}\r\n\r\n.fr-s03-cam-gallery {\r\n  width: 44px;\r\n  height: 44px;\r\n  border-radius: 10px;\r\n  background: rgba(255,255,255,0.15);\r\n  backdrop-filter: blur(10px);\r\n  border: 1px solid rgba(255,255,255,0.2);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: #fff;\r\n  font-size: 16px;\r\n}\r\n\r\n.fr-s03-cam-shutter {\r\n  width: 68px;\r\n  height: 68px;\r\n  border-radius: 50%;\r\n  background: none;\r\n  border: 4px solid #fff;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  cursor: pointer;\r\n  transition: transform 0.15s;\r\n}\r\n\r\n.fr-s03-cam-shutter:hover {\r\n  transform: scale(1.05);\r\n}\r\n\r\n.fr-s03-cam-shutter-inner {\r\n  width: 54px;\r\n  height: 54px;\r\n  border-radius: 50%;\r\n  background: #ff3b3b;\r\n  transition: background 0.15s;\r\n}\r\n\r\n.fr-s03-cam-shutter:hover .fr-s03-cam-shutter-inner {\r\n  background: #ff5555;\r\n}\r\n\r\n.fr-s03-cam-flip {\r\n  width: 44px;\r\n  height: 44px;\r\n  border-radius: 50%;\r\n  background: rgba(255,255,255,0.15);\r\n  backdrop-filter: blur(10px);\r\n  border: 1px solid rgba(255,255,255,0.2);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: #fff;\r\n  font-size: 16px;\r\n}\r\n\r\n\/* ==========================================\r\n   STATE 2: ANALYZING\r\n   ========================================== *\/\r\n.fr-s03-analyzing {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background: #0d0d0d;\r\n}\r\n\r\n.fr-s03-analyze-circle {\r\n  width: 120px;\r\n  height: 120px;\r\n  border-radius: 50%;\r\n  overflow: hidden;\r\n  margin-bottom: 24px;\r\n  animation: fr03spin 3s linear infinite;\r\n}\r\n\r\n.fr-s03-analyze-circle img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n@keyframes fr03spin {\r\n  0% { transform: rotate(0deg); }\r\n  100% { transform: rotate(360deg); }\r\n}\r\n\r\n.fr-s03-analyze-text {\r\n  font-size: 14px;\r\n  font-weight: 700;\r\n  color: #fff;\r\n  margin-bottom: 8px;\r\n}\r\n\r\n.fr-s03-analyze-sub {\r\n  font-size: 11px;\r\n  color: rgba(255,255,255,0.4);\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.fr-s03-analyze-steps {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n  width: 200px;\r\n}\r\n\r\n.fr-s03-analyze-steps li {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  padding: 8px 0;\r\n  font-size: 12px;\r\n  color: rgba(255,255,255,0.5);\r\n  transition: color 0.3s;\r\n}\r\n\r\n.fr-s03-analyze-steps li i {\r\n  font-size: 12px;\r\n  color: #ff3b3b;\r\n  width: 18px;\r\n  text-align: center;\r\n}\r\n\r\n.fr-s03-analyze-steps li.done {\r\n  color: rgba(255,255,255,0.85);\r\n}\r\n\r\n.fr-s03-analyze-steps li.done i {\r\n  color: #34C759;\r\n}\r\n\r\n\/* ==========================================\r\n   STATE 3: AI RESULTS\r\n   ========================================== *\/\r\n.fr-s03-results {\r\n  display: flex;\r\n  flex-direction: column;\r\n  background: #0d0d0d;\r\n  overflow-y: auto;\r\n}\r\n\r\n.fr-s03-results-header {\r\n  background: #ff3b3b;\r\n  padding: 66px 20px 22px;\r\n  text-align: center;\r\n  border-radius: 0 0 24px 24px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.fr-s03-results-badge {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n  background: rgba(255,255,255,0.2);\r\n  border-radius: 980px;\r\n  padding: 6px 14px;\r\n  font-size: 11px;\r\n  font-weight: 700;\r\n  color: #fff;\r\n  margin-bottom: 10px;\r\n}\r\n\r\n.fr-s03-results-title {\r\n  font-size: 16px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 4px;\r\n}\r\n\r\n.fr-s03-results-conf {\r\n  font-size: 32px;\r\n  font-weight: 900;\r\n  color: #fff;\r\n  margin: 0;\r\n}\r\n\r\n.fr-s03-results-conflabel {\r\n  font-size: 10px;\r\n  color: rgba(255,255,255,0.7);\r\n  margin: 4px 0 0;\r\n}\r\n\r\n.fr-s03-results-body {\r\n  padding: 20px 20px 120px;\r\n  flex: 1;\r\n}\r\n\r\n.fr-s03-result-row {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  padding: 14px 0;\r\n  border-bottom: 1px solid rgba(255,255,255,0.06);\r\n}\r\n\r\n.fr-s03-result-label {\r\n  font-size: 12px;\r\n  color: rgba(255,255,255,0.5);\r\n}\r\n\r\n.fr-s03-result-val {\r\n  font-size: 12px;\r\n  font-weight: 700;\r\n  color: #fff;\r\n}\r\n\r\n.fr-s03-result-val.high { color: #34C759; }\r\n.fr-s03-result-val.warn { color: #ffb000; }\r\n\r\n\/* Bottom Nav (all states) *\/\r\n.fr-s03-nav {\r\n  position: absolute;\r\n  left: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  height: 120px;\r\n  background-image: url('https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Nav-Menu-Full-scaled.webp');\r\n  background-repeat: no-repeat;\r\n  background-position: bottom center;\r\n  background-size: 100% auto;\r\n  z-index: 40;\r\n  display: none;\r\n}\r\n\r\n.fr-s03-nav.show { display: block; }\r\n\r\n.fr-s03-nav-icon {\r\n  position: absolute;\r\n  bottom: 24px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: rgba(255,255,255,0.72);\r\n  z-index: 45;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s03-nav-icon svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.5;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n.fr-s03-nav-icon.n-home { left: 30px; }\r\n.fr-s03-nav-icon.n-reports { left: 88px; }\r\n.fr-s03-nav-icon.n-articles { right: 88px; }\r\n.fr-s03-nav-icon.n-profile { right: 30px; }\r\n\r\n.fr-s03-nav-camera {\r\n  position: absolute;\r\n  left: 50%;\r\n  top: 58%;\r\n  transform: translate(-50%, -50%);\r\n  margin-top: -16px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: #fff;\r\n  z-index: 46;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s03-nav-camera svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.6;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n\/* RESET *\/\r\n.fr-s03-reset {\r\n  position: absolute;\r\n  top: 16px;\r\n  right: -44px;\r\n  width: 36px;\r\n  height: 36px;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border: 1px solid rgba(255, 59, 59, 0.3);\r\n  border-radius: 50%;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  cursor: pointer;\r\n  transition: background 0.2s;\r\n  z-index: 50;\r\n}\r\n\r\n.fr-s03-reset:hover {\r\n  background: rgba(255, 59, 59, 0.25);\r\n}\r\n\r\n.fr-s03-reset i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n}\r\n\r\n\/* MOBILE *\/\r\n@media (max-width: 768px) {\r\n  .fr-step03 { padding: 50px 20px; }\r\n  .fr-step03-grid {\r\n    grid-template-columns: 1fr;\r\n    gap: 40px;\r\n    text-align: center;\r\n  }\r\n  .fr-step03-info h2 { font-size: 1.7rem; }\r\n  .fr-step03-features li { justify-content: center; }\r\n  .fr-s03-phone { width: 300px; height: 600px; }\r\n  .fr-s03-reset { top: auto; bottom: -44px; right: 50%; transform: translateX(50%); }\r\n}\r\n<\/style>\r\n\r\n<div class=\"fr-step03\">\r\n  <div class=\"fr-step03-grid\">\r\n\r\n    <!-- LEFT \u2014 INFO -->\r\n    <div class=\"fr-step03-info\">\r\n      <div class=\"fr-step03-tag\">\r\n        <i class=\"fas fa-camera\"><\/i> Step 03\r\n      <\/div>\r\n      <h2>Snap a photo &<br>let AI identify<\/h2>\r\n      <p>Point your camera at a suspected fire ant or nest. One tap and our AI model \u2014 trained on 20,000+ verified images \u2014 delivers a confidence score in seconds.<\/p>\r\n      <ul class=\"fr-step03-features\">\r\n        <li><i class=\"fas fa-crosshairs\"><\/i> Guided viewfinder with targeting brackets<\/li>\r\n        <li><i class=\"fas fa-brain\"><\/i> On-device AI classification<\/li>\r\n        <li><i class=\"fas fa-check-circle\"><\/i> 92%+ confidence scoring<\/li>\r\n        <li><i class=\"fas fa-clock\"><\/i> Results in under 5 seconds<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n\r\n    <!-- RIGHT \u2014 iPHONE -->\r\n    <div class=\"fr-step03-phone-col\">\r\n      <div class=\"fr-s03-phone\" id=\"frS03Phone\">\r\n\r\n        <!-- Status Bar -->\r\n        <div class=\"fr-s03-status\">\r\n          <span>2:34<\/span>\r\n          <div class=\"fr-s03-island\">\r\n            <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/antScroll-scaled.png\" alt=\"Ant\">\r\n          <\/div>\r\n          <span class=\"fr-s03-status-right\">5G  77%<\/span>\r\n        <\/div>\r\n\r\n        <!-- STATE 1: CAMERA -->\r\n        <div class=\"fr-s03-state active\" id=\"frS03Camera\">\r\n          <!-- Video Background -->\r\n          <div class=\"fr-s03-cam-video\">\r\n            <video autoplay muted loop playsinline>\r\n              <source src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Fire-ant-hero-video.mp4\" type=\"video\/mp4\">\r\n            <\/video>\r\n          <\/div>\r\n\r\n          <!-- Top Controls -->\r\n          <div class=\"fr-s03-cam-top\">\r\n            <div class=\"fr-s03-cam-top-btn\">\r\n              <i class=\"fas fa-times\" aria-hidden=\"true\"><\/i>\r\n            <\/div>\r\n            <div class=\"fr-s03-cam-top-btn\">\r\n              <i class=\"fas fa-bolt\" aria-hidden=\"true\"><\/i>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <!-- Scan Hint -->\r\n          <p class=\"fr-s03-cam-hint\"><i class=\"fas fa-crosshairs\" aria-hidden=\"true\"><\/i>&nbsp;&nbsp;\u5728\u753b\u9762\u4e2d\u5b9a\u4f4d\u7591\u4f3c\u5de2\u7a74<\/p>\r\n\r\n          <!-- Viewfinder -->\r\n          <div class=\"fr-s03-cam-viewfinder\">\r\n            <div class=\"fr-s03-cam-corner-bl\"><\/div>\r\n            <div class=\"fr-s03-cam-corner-br\"><\/div>\r\n          <\/div>\r\n\r\n          <!-- AI Badge -->\r\n          <div class=\"fr-s03-cam-ai-badge\">\r\n            <i class=\"fas fa-brain\" aria-hidden=\"true\"><\/i>\r\n            <span>AI \u68c0\u6d4b\u5df2\u6fc0\u6d3b<\/span>\r\n          <\/div>\r\n\r\n          <!-- Bottom Controls -->\r\n          <div class=\"fr-s03-cam-bottom\">\r\n            <div class=\"fr-s03-cam-gallery\">\r\n              <i class=\"fas fa-images\" aria-hidden=\"true\"><\/i>\r\n            <\/div>\r\n            <div class=\"fr-s03-cam-shutter\" id=\"frS03Shutter\">\r\n              <div class=\"fr-s03-cam-shutter-inner\"><\/div>\r\n            <\/div>\r\n            <div class=\"fr-s03-cam-flip\">\r\n              <i class=\"fas fa-sync-alt\" aria-hidden=\"true\"><\/i>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- STATE 2: ANALYZING -->\r\n        <div class=\"fr-s03-state fr-s03-analyzing\" id=\"frS03Analyzing\">\r\n          <div class=\"fr-s03-analyze-circle\">\r\n            <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Fire-Ant-circle-.png\" alt=\"Analyzing\">\r\n          <\/div>\r\n          <span class=\"fr-s03-analyze-text\">\u6b63\u5728\u5206\u6790\u56fe\u50cf...<\/span>\r\n          <span class=\"fr-s03-analyze-sub\">AI model processing<\/span>\r\n          <ul class=\"fr-s03-analyze-steps\" id=\"frS03Steps\">\r\n            <li><i class=\"fas fa-spinner fa-spin\"><\/i> Detecting specimen<\/li>\r\n            <li><i class=\"fas fa-spinner fa-spin\"><\/i> Classifying species<\/li>\r\n            <li><i class=\"fas fa-spinner fa-spin\"><\/i> Generating confidence<\/li>\r\n          <\/ul>\r\n        <\/div>\r\n\r\n        <!-- STATE 3: AI RESULTS -->\r\n        <div class=\"fr-s03-state fr-s03-results\" id=\"frS03Results\">\r\n          <div class=\"fr-s03-results-header\">\r\n            <div class=\"fr-s03-results-badge\"><i class=\"fas fa-check\"><\/i> Identified<\/div>\r\n            <p class=\"fr-s03-results-title\">\u706b\u8681<\/p>\r\n            <p class=\"fr-s03-results-conf\">92%<\/p>\r\n            <p class=\"fr-s03-results-conflabel\">Confidence Score<\/p>\r\n          <\/div>\r\n          <div class=\"fr-s03-results-body\">\r\n            <div class=\"fr-s03-result-row\">\r\n              <span class=\"fr-s03-result-label\">Species<\/span>\r\n              <span class=\"fr-s03-result-val\">Red Imported Fire Ant<\/span>\r\n            <\/div>\r\n            <div class=\"fr-s03-result-row\">\r\n              <span class=\"fr-s03-result-label\">Confidence<\/span>\r\n              <span class=\"fr-s03-result-val high\">92% \u2014 High<\/span>\r\n            <\/div>\r\n            <div class=\"fr-s03-result-row\">\r\n              <span class=\"fr-s03-result-label\">Risk Level<\/span>\r\n              <span class=\"fr-s03-result-val warn\">Elevated<\/span>\r\n            <\/div>\r\n            <div class=\"fr-s03-result-row\">\r\n              <span class=\"fr-s03-result-label\">Action<\/span>\r\n              <span class=\"fr-s03-result-val\">\u63d0\u4ea4\u62a5\u544a<\/span>\r\n            <\/div>\r\n            <div class=\"fr-s03-result-row\">\r\n              <span class=\"fr-s03-result-label\">\u5730\u70b9<\/span>\r\n              <span class=\"fr-s03-result-val\">Yarrabilba, QLD<\/span>\r\n            <\/div>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Bottom Nav (shows on analyzing + results) -->\r\n        <div class=\"fr-s03-nav\" id=\"frS03Nav\">\r\n          <div class=\"fr-s03-nav-camera\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M7 7h2l1.5-2h3L15 7h2a3 3 0 0 1 3 3v7a3 3 0 0 1-3 3H7a3 3 0 0 1-3-3v-7a3 3 0 0 1 3-3z\"><\/path>\r\n              <circle cx=\"12\" cy=\"13.5\" r=\"3.2\"><\/circle>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s03-nav-icon n-home\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M3 11.5L12 4l9 7.5\"><\/path>\r\n              <path d=\"M5.5 10.5V20h5v-5h3v5h5v-9.5\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s03-nav-icon n-reports\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M8 4h8\"><\/path>\r\n              <path d=\"M9 4a3 3 0 0 0 6 0\"><\/path>\r\n              <rect x=\"5\" y=\"5\" width=\"14\" height=\"16\" rx=\"2\"><\/rect>\r\n              <path d=\"M8 11h8\"><\/path>\r\n              <path d=\"M8 15h8\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s03-nav-icon n-articles\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M4 5.5c2.5 0 5 .4 8 2.2v12c-3-1.8-5.5-2.2-8-2.2z\"><\/path>\r\n              <path d=\"M20 5.5c-2.5 0-5 .4-8 2.2v12c3-1.8 5.5-2.2 8-2.2z\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s03-nav-icon n-profile\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <circle cx=\"12\" cy=\"8\" r=\"3.5\"><\/circle>\r\n              <path d=\"M5 20c1.2-4 4-6 7-6s5.8 2 7 6\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Reset -->\r\n        <div class=\"fr-s03-reset\" id=\"frS03Reset\" title=\"Reset\">\r\n          <i class=\"fas fa-redo-alt\"><\/i>\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n  var camera = document.getElementById('frS03Camera');\r\n  var analyzing = document.getElementById('frS03Analyzing');\r\n  var results = document.getElementById('frS03Results');\r\n  var shutter = document.getElementById('frS03Shutter');\r\n  var resetBtn = document.getElementById('frS03Reset');\r\n  var nav = document.getElementById('frS03Nav');\r\n  var steps = document.querySelectorAll('#frS03Steps li');\r\n\r\n  function hideAll() {\r\n    camera.classList.remove('active');\r\n    analyzing.classList.remove('active');\r\n    results.classList.remove('active');\r\n    nav.classList.remove('show');\r\n    steps.forEach(function(s) {\r\n      s.classList.remove('done');\r\n      s.querySelector('i').className = 'fas fa-spinner fa-spin';\r\n    });\r\n  }\r\n\r\n  function showState(el, showNav) {\r\n    hideAll();\r\n    el.classList.add('active');\r\n    if (showNav) nav.classList.add('show');\r\n  }\r\n\r\n  \/\/ Click shutter \u2192 analyzing \u2192 results\r\n  shutter.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(analyzing, true);\r\n\r\n    setTimeout(function() {\r\n      steps[0].classList.add('done');\r\n      steps[0].querySelector('i').className = 'fas fa-check-circle';\r\n    }, 800);\r\n\r\n    setTimeout(function() {\r\n      steps[1].classList.add('done');\r\n      steps[1].querySelector('i').className = 'fas fa-check-circle';\r\n    }, 1600);\r\n\r\n    setTimeout(function() {\r\n      steps[2].classList.add('done');\r\n      steps[2].querySelector('i').className = 'fas fa-check-circle';\r\n    }, 2400);\r\n\r\n    setTimeout(function() {\r\n      showState(results, true);\r\n    }, 3200);\r\n  });\r\n\r\n  \/\/ Reset\r\n  resetBtn.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(camera, false);\r\n  });\r\n})();\r\n<\/script>\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-f9d4a9f elementor-widget elementor-widget-html\" data-id=\"f9d4a9f\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!-- ============================================\r\n     FIRE RANT \u2014 APP PAGE STEP 04\r\n     Submit Report \u2192 Report Submitted + Points\r\n     2-Column: Info left, iPhone right\r\n     UPDATED: All images \u2192 fire ant image\r\n============================================ -->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<style>\r\n.fr-step04 {\r\n  background: #0a0a0a;\r\n  padding: 80px 40px;\r\n  font-family: Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n  border-top: 1px solid rgba(255,255,255,0.04);\r\n}\r\n\r\n.fr-step04-grid {\r\n  max-width: 1100px;\r\n  margin: 0 auto;\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 60px;\r\n  align-items: center;\r\n}\r\n\r\n\/* LEFT COLUMN \u2014 INFO *\/\r\n.fr-step04-tag {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border: 1px solid rgba(255, 59, 59, 0.25);\r\n  border-radius: 980px;\r\n  padding: 6px 14px;\r\n  font-size: 0.75rem;\r\n  font-weight: 700;\r\n  color: #ff3b3b;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.fr-step04-info h2 {\r\n  font-size: 2.2rem;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 16px;\r\n  letter-spacing: -0.5px;\r\n  line-height: 1.15;\r\n}\r\n\r\n.fr-step04-info > p {\r\n  font-size: 1.05rem;\r\n  color: rgba(255, 255, 255, 0.6);\r\n  line-height: 1.7;\r\n  margin: 0 0 28px;\r\n}\r\n\r\n.fr-step04-features {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n}\r\n\r\n.fr-step04-features li {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 10px 0;\r\n  font-size: 0.95rem;\r\n  color: rgba(255, 255, 255, 0.75);\r\n}\r\n\r\n.fr-step04-features li i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n  width: 28px;\r\n  height: 28px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border-radius: 8px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n\/* RIGHT COLUMN \u2014 iPHONE *\/\r\n.fr-step04-phone-col {\r\n  display: flex;\r\n  justify-content: center;\r\n  position: relative;\r\n}\r\n\r\n.fr-s04-phone {\r\n  position: relative;\r\n  width: 320px;\r\n  height: 640px;\r\n  background: #000;\r\n  border-radius: 44px;\r\n  border: 4px solid #2a2a2a;\r\n  box-shadow: 0 25px 70px rgba(0,0,0,.75);\r\n  overflow: hidden;\r\n  font-family: Inter, -apple-system, Arial, sans-serif;\r\n}\r\n\r\n\/* Status Bar *\/\r\n.fr-s04-status {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  display: grid;\r\n  grid-template-columns: 48px 1fr 68px;\r\n  align-items: center;\r\n  padding: 14px 24px 0;\r\n  font-size: 10px;\r\n  color: #fff;\r\n  font-weight: 700;\r\n  z-index: 30;\r\n}\r\n\r\n.fr-s04-status-right {\r\n  text-align: right;\r\n  font-weight: 600;\r\n}\r\n\r\n.fr-s04-island {\r\n  width: 140px;\r\n  height: 34px;\r\n  background: #000;\r\n  border-radius: 999px;\r\n  margin: 0 auto;\r\n  border: 1.5px solid #ff3b3b;\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 0 14px;\r\n}\r\n\r\n.fr-s04-island img {\r\n  width: 18px;\r\n  height: 18px;\r\n  object-fit: contain;\r\n}\r\n\r\n\/* ALL STATES *\/\r\n.fr-s04-state {\r\n  position: absolute;\r\n  inset: 0;\r\n  opacity: 0;\r\n  transition: opacity 0.4s ease;\r\n  pointer-events: none;\r\n  display: flex;\r\n  flex-direction: column;\r\n}\r\n\r\n.fr-s04-state.active {\r\n  opacity: 1;\r\n  pointer-events: auto;\r\n}\r\n\r\n\/* ==========================================\r\n   STATE 1: CREATE REPORT FORM\r\n   ========================================== *\/\r\n.fr-s04-form {\r\n  background: #0d0d0d;\r\n  padding: 60px 20px 130px;\r\n  overflow-y: auto;\r\n}\r\n\r\n.fr-s04-form::-webkit-scrollbar { display: none; }\r\n\r\n.fr-s04-form-header {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.fr-s04-form-back {\r\n  width: 32px;\r\n  height: 32px;\r\n  border-radius: 50%;\r\n  background: rgba(255,255,255,0.05);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: #fff;\r\n  font-size: 12px;\r\n}\r\n\r\n.fr-s04-form-title {\r\n  font-size: 18px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0;\r\n}\r\n\r\n\/* Form Fields *\/\r\n.fr-s04-field {\r\n  margin-bottom: 16px;\r\n}\r\n\r\n.fr-s04-label {\r\n  font-size: 11px;\r\n  font-weight: 700;\r\n  color: rgba(255,255,255,0.4);\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  margin-bottom: 6px;\r\n  display: block;\r\n}\r\n\r\n.fr-s04-input {\r\n  width: 100%;\r\n  background: rgba(255,255,255,0.04);\r\n  border: 1px solid rgba(255,255,255,0.08);\r\n  border-radius: 12px;\r\n  padding: 13px 14px;\r\n  font-size: 13px;\r\n  color: rgba(255,255,255,0.8);\r\n  font-family: inherit;\r\n  box-sizing: border-box;\r\n}\r\n\r\n.fr-s04-input-row {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 10px;\r\n}\r\n\r\n\/* Image Preview *\/\r\n.fr-s04-images {\r\n  display: flex;\r\n  gap: 8px;\r\n  margin-top: 6px;\r\n}\r\n\r\n.fr-s04-img-thumb {\r\n  width: 56px;\r\n  height: 56px;\r\n  border-radius: 10px;\r\n  overflow: hidden;\r\n  border: 1px solid rgba(255,255,255,0.08);\r\n}\r\n\r\n.fr-s04-img-thumb img {\r\n  width: 100%;\r\n  height: 100%;\r\n  object-fit: cover;\r\n}\r\n\r\n.fr-s04-img-add {\r\n  width: 56px;\r\n  height: 56px;\r\n  border-radius: 10px;\r\n  border: 1.5px dashed rgba(255,255,255,0.15);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: rgba(255,255,255,0.3);\r\n  font-size: 18px;\r\n}\r\n\r\n\/* Submit Button *\/\r\n.fr-s04-submit-btn {\r\n  width: 100%;\r\n  background: #ff3b3b;\r\n  color: #fff;\r\n  border: none;\r\n  border-radius: 980px;\r\n  padding: 14px;\r\n  font-size: 14px;\r\n  font-weight: 800;\r\n  cursor: pointer;\r\n  transition: transform 0.2s, box-shadow 0.2s;\r\n  font-family: inherit;\r\n  margin-top: 20px;\r\n}\r\n\r\n.fr-s04-submit-btn:hover {\r\n  transform: scale(1.02);\r\n  box-shadow: 0 4px 20px rgba(255, 59, 59, 0.4);\r\n}\r\n\r\n\/* ==========================================\r\n   STATE 2: REPORT SUBMITTED + POINTS\r\n   ========================================== *\/\r\n.fr-s04-submitted {\r\n  background: #0d0d0d;\r\n  align-items: center;\r\n  justify-content: center;\r\n  text-align: center;\r\n  padding: 40px 24px;\r\n}\r\n\r\n.fr-s04-success-icon {\r\n  width: 80px;\r\n  height: 80px;\r\n  border-radius: 50%;\r\n  background: rgba(52, 199, 89, 0.1);\r\n  border: 3px solid #34C759;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  margin-bottom: 20px;\r\n  animation: fr04pop 0.5s ease;\r\n}\r\n\r\n@keyframes fr04pop {\r\n  0% { transform: scale(0); opacity: 0; }\r\n  60% { transform: scale(1.15); }\r\n  100% { transform: scale(1); opacity: 1; }\r\n}\r\n\r\n.fr-s04-success-icon i {\r\n  color: #34C759;\r\n  font-size: 32px;\r\n}\r\n\r\n.fr-s04-submitted-title {\r\n  font-size: 20px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 6px;\r\n}\r\n\r\n.fr-s04-submitted-sub {\r\n  font-size: 12px;\r\n  color: rgba(255,255,255,0.5);\r\n  margin: 0 0 28px;\r\n}\r\n\r\n\/* Points Earned Card *\/\r\n.fr-s04-points-card {\r\n  background: rgba(255, 59, 59, 0.06);\r\n  border: 1px solid rgba(255, 59, 59, 0.2);\r\n  border-radius: 16px;\r\n  padding: 20px;\r\n  width: 100%;\r\n  margin-bottom: 20px;\r\n}\r\n\r\n.fr-s04-points-earned {\r\n  font-size: 36px;\r\n  font-weight: 900;\r\n  color: #ff3b3b;\r\n  margin: 0 0 4px;\r\n}\r\n\r\n.fr-s04-points-label {\r\n  font-size: 11px;\r\n  color: rgba(255,255,255,0.5);\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  margin: 0 0 16px;\r\n}\r\n\r\n.fr-s04-points-divider {\r\n  height: 1px;\r\n  background: rgba(255,255,255,0.06);\r\n  margin: 0 0 16px;\r\n}\r\n\r\n.fr-s04-points-total-row {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n}\r\n\r\n.fr-s04-points-total-label {\r\n  font-size: 12px;\r\n  color: rgba(255,255,255,0.5);\r\n}\r\n\r\n.fr-s04-points-total {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 6px;\r\n  background: #1b0706;\r\n  color: #ff3b3b;\r\n  padding: 8px 14px;\r\n  border-radius: 999px;\r\n  font-size: 14px;\r\n  font-weight: 800;\r\n}\r\n\r\n\/* Level Progress *\/\r\n.fr-s04-level {\r\n  background: rgba(255,255,255,0.03);\r\n  border: 1px solid rgba(255,255,255,0.06);\r\n  border-radius: 12px;\r\n  padding: 14px;\r\n  width: 100%;\r\n  margin-bottom: 20px;\r\n}\r\n\r\n.fr-s04-level-row {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  margin-bottom: 8px;\r\n}\r\n\r\n.fr-s04-level-name {\r\n  font-size: 12px;\r\n  font-weight: 700;\r\n  color: #fff;\r\n}\r\n\r\n.fr-s04-level-next {\r\n  font-size: 10px;\r\n  color: rgba(255,255,255,0.4);\r\n}\r\n\r\n.fr-s04-level-bar {\r\n  width: 100%;\r\n  height: 6px;\r\n  background: rgba(255,255,255,0.06);\r\n  border-radius: 3px;\r\n  overflow: hidden;\r\n}\r\n\r\n.fr-s04-level-fill {\r\n  height: 100%;\r\n  width: 0%;\r\n  background: linear-gradient(90deg, #ff3b3b, #ff6b6b);\r\n  border-radius: 3px;\r\n  transition: width 1.2s ease;\r\n}\r\n\r\n.fr-s04-level-fill.go {\r\n  width: 73%;\r\n}\r\n\r\n\/* Home Button *\/\r\n.fr-s04-home-btn {\r\n  width: 100%;\r\n  background: rgba(255,255,255,0.05);\r\n  border: 1px solid rgba(255,255,255,0.1);\r\n  color: #fff;\r\n  border-radius: 980px;\r\n  padding: 12px;\r\n  font-size: 13px;\r\n  font-weight: 700;\r\n  cursor: pointer;\r\n  font-family: inherit;\r\n  transition: background 0.2s;\r\n}\r\n\r\n.fr-s04-home-btn:hover {\r\n  background: rgba(255,255,255,0.1);\r\n}\r\n\r\n\/* Bottom Nav *\/\r\n.fr-s04-nav {\r\n  position: absolute;\r\n  left: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  height: 120px;\r\n  background-image: url('https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Nav-Menu-Full-scaled.webp');\r\n  background-repeat: no-repeat;\r\n  background-position: bottom center;\r\n  background-size: 100% auto;\r\n  z-index: 40;\r\n}\r\n\r\n.fr-s04-nav-icon {\r\n  position: absolute;\r\n  bottom: 24px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: rgba(255,255,255,0.72);\r\n  z-index: 45;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s04-nav-icon svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.5;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n.fr-s04-nav-icon.n-home { left: 30px; }\r\n.fr-s04-nav-icon.n-reports { left: 88px; }\r\n.fr-s04-nav-icon.n-articles { right: 88px; }\r\n.fr-s04-nav-icon.n-profile { right: 30px; }\r\n\r\n.fr-s04-nav-camera {\r\n  position: absolute;\r\n  left: 50%;\r\n  top: 58%;\r\n  transform: translate(-50%, -50%);\r\n  margin-top: -16px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: #fff;\r\n  z-index: 46;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s04-nav-camera svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.6;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n\/* RESET *\/\r\n.fr-s04-reset {\r\n  position: absolute;\r\n  top: 16px;\r\n  right: -44px;\r\n  width: 36px;\r\n  height: 36px;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border: 1px solid rgba(255, 59, 59, 0.3);\r\n  border-radius: 50%;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  cursor: pointer;\r\n  transition: background 0.2s;\r\n  z-index: 50;\r\n}\r\n\r\n.fr-s04-reset:hover {\r\n  background: rgba(255, 59, 59, 0.25);\r\n}\r\n\r\n.fr-s04-reset i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n}\r\n\r\n\/* MOBILE *\/\r\n@media (max-width: 768px) {\r\n  .fr-step04 { padding: 50px 20px; }\r\n  .fr-step04-grid {\r\n    grid-template-columns: 1fr;\r\n    gap: 40px;\r\n    text-align: center;\r\n  }\r\n  .fr-step04-info h2 { font-size: 1.7rem; }\r\n  .fr-step04-features li { justify-content: center; }\r\n  .fr-s04-phone { width: 300px; height: 600px; }\r\n  .fr-s04-reset { top: auto; bottom: -44px; right: 50%; transform: translateX(50%); }\r\n}\r\n<\/style>\r\n\r\n<div class=\"fr-step04\">\r\n  <div class=\"fr-step04-grid\">\r\n\r\n    <!-- LEFT \u2014 INFO -->\r\n    <div class=\"fr-step04-info\">\r\n      <div class=\"fr-step04-tag\">\r\n        <i class=\"fas fa-paper-plane\"><\/i> Step 04\r\n      <\/div>\r\n      <h2>Submit your report<br>& earn points<\/h2>\r\n      <p>Fill in the details \u2014 title, location, images \u2014 and hit submit. Your report goes straight to the biosecurity network and you earn community points instantly.<\/p>\r\n      <ul class=\"fr-step04-features\">\r\n        <li><i class=\"fas fa-map-marker-alt\"><\/i> GPS auto-fills your location<\/li>\r\n        <li><i class=\"fas fa-image\"><\/i> Attach multiple photos as evidence<\/li>\r\n        <li><i class=\"fas fa-star\"><\/i> Earn 110 points per verified report<\/li>\r\n        <li><i class=\"fas fa-trophy\"><\/i> Level up on the community leaderboard<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n\r\n    <!-- RIGHT \u2014 iPHONE -->\r\n    <div class=\"fr-step04-phone-col\">\r\n      <div class=\"fr-s04-phone\" id=\"frS04Phone\">\r\n\r\n        <!-- Status Bar -->\r\n        <div class=\"fr-s04-status\">\r\n          <span>2:34<\/span>\r\n          <div class=\"fr-s04-island\">\r\n            <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/antScroll-scaled.png\" alt=\"Ant\">\r\n          <\/div>\r\n          <span class=\"fr-s04-status-right\">5G  77%<\/span>\r\n        <\/div>\r\n\r\n        <!-- STATE 1: CREATE REPORT FORM -->\r\n        <div class=\"fr-s04-state fr-s04-form active\" id=\"frS04Form\">\r\n          <div class=\"fr-s04-form-header\">\r\n            <div class=\"fr-s04-form-back\"><i class=\"fas fa-chevron-left\"><\/i><\/div>\r\n            <p class=\"fr-s04-form-title\">\u521b\u5efa\u62a5\u544a<\/p>\r\n          <\/div>\r\n\r\n          <div class=\"fr-s04-field\">\r\n            <span class=\"fr-s04-label\">\u6807\u9898<\/span>\r\n            <div class=\"fr-s04-input\">Suspected fire ant nest<\/div>\r\n          <\/div>\r\n\r\n          <div class=\"fr-s04-field\">\r\n            <span class=\"fr-s04-label\">\u65e5\u671f\u548c\u65f6\u95f4<\/span>\r\n            <div class=\"fr-s04-input-row\">\r\n              <div class=\"fr-s04-input\">28\/06\/2026<\/div>\r\n              <div class=\"fr-s04-input\">\u4e0b\u53482:34<\/div>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <div class=\"fr-s04-field\">\r\n            <span class=\"fr-s04-label\">\u5730\u70b9<\/span>\r\n            <div class=\"fr-s04-input\"><i class=\"fas fa-map-marker-alt\" style=\"color:#ff3b3b;margin-right:8px;\"><\/i>Yarrabilba, QLD 4207<\/div>\r\n          <\/div>\r\n\r\n          <div class=\"fr-s04-field\">\r\n            <span class=\"fr-s04-label\">\u63cf\u8ff0<\/span>\r\n            <div class=\"fr-s04-input\" style=\"min-height:60px;\">Discovered fire ant mound near walking path. Approx 30cm diameter.<\/div>\r\n          <\/div>\r\n\r\n          <div class=\"fr-s04-field\">\r\n            <span class=\"fr-s04-label\">\u56fe\u7247<\/span>\r\n            <div class=\"fr-s04-images\">\r\n              <div class=\"fr-s04-img-thumb\">\r\n                <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Evidence\">\r\n              <\/div>\r\n              <div class=\"fr-s04-img-thumb\">\r\n                <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Evidence 2\">\r\n              <\/div>\r\n              <div class=\"fr-s04-img-add\"><i class=\"fas fa-plus\"><\/i><\/div>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <button class=\"fr-s04-submit-btn\" id=\"frS04SubmitBtn\">\u63d0\u4ea4\u62a5\u544a<\/button>\r\n        <\/div>\r\n\r\n        <!-- STATE 2: REPORT SUBMITTED + POINTS -->\r\n        <div class=\"fr-s04-state fr-s04-submitted\" id=\"frS04Submitted\">\r\n          <div class=\"fr-s04-success-icon\">\r\n            <i class=\"fas fa-check\"><\/i>\r\n          <\/div>\r\n          <p class=\"fr-s04-submitted-title\">\u62a5\u544a\u5df2\u63d0\u4ea4\uff01<\/p>\r\n          <p class=\"fr-s04-submitted-sub\">Your sighting has been logged to the network<\/p>\r\n\r\n          <!-- Points Card -->\r\n          <div class=\"fr-s04-points-card\">\r\n            <p class=\"fr-s04-points-earned\">+110<\/p>\r\n            <p class=\"fr-s04-points-label\">\u79ef\u5206\u83b7\u5f97<\/p>\r\n            <div class=\"fr-s04-points-divider\"><\/div>\r\n            <div class=\"fr-s04-points-total-row\">\r\n              <span class=\"fr-s04-points-total-label\">Total Balance<\/span>\r\n              <span class=\"fr-s04-points-total\"><i class=\"fas fa-star\"><\/i> 770<\/span>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <!-- Level Progress -->\r\n          <div class=\"fr-s04-level\">\r\n            <div class=\"fr-s04-level-row\">\r\n              <span class=\"fr-s04-level-name\"><i class=\"fas fa-shield-alt\" style=\"color:#ff3b3b;margin-right:6px;\"><\/i>Scout Rank<\/span>\r\n              <span class=\"fr-s04-level-next\">230 pts to Ranger<\/span>\r\n            <\/div>\r\n            <div class=\"fr-s04-level-bar\">\r\n              <div class=\"fr-s04-level-fill\" id=\"frS04LevelBar\"><\/div>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <button class=\"fr-s04-home-btn\" id=\"frS04HomeBtn\"><i class=\"fas fa-home\" style=\"margin-right:6px;\"><\/i>\u8fd4\u56de\u4eea\u8868\u677f<\/button>\r\n        <\/div>\r\n\r\n        <!-- Bottom Nav -->\r\n        <div class=\"fr-s04-nav\">\r\n          <div class=\"fr-s04-nav-camera\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M7 7h2l1.5-2h3L15 7h2a3 3 0 0 1 3 3v7a3 3 0 0 1-3 3H7a3 3 0 0 1-3-3v-7a3 3 0 0 1 3-3z\"><\/path>\r\n              <circle cx=\"12\" cy=\"13.5\" r=\"3.2\"><\/circle>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s04-nav-icon n-home\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M3 11.5L12 4l9 7.5\"><\/path>\r\n              <path d=\"M5.5 10.5V20h5v-5h3v5h5v-9.5\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s04-nav-icon n-reports\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M8 4h8\"><\/path>\r\n              <path d=\"M9 4a3 3 0 0 0 6 0\"><\/path>\r\n              <rect x=\"5\" y=\"5\" width=\"14\" height=\"16\" rx=\"2\"><\/rect>\r\n              <path d=\"M8 11h8\"><\/path>\r\n              <path d=\"M8 15h8\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s04-nav-icon n-articles\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M4 5.5c2.5 0 5 .4 8 2.2v12c-3-1.8-5.5-2.2-8-2.2z\"><\/path>\r\n              <path d=\"M20 5.5c-2.5 0-5 .4-8 2.2v12c3-1.8 5.5-2.2 8-2.2z\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s04-nav-icon n-profile\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <circle cx=\"12\" cy=\"8\" r=\"3.5\"><\/circle>\r\n              <path d=\"M5 20c1.2-4 4-6 7-6s5.8 2 7 6\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Reset -->\r\n        <div class=\"fr-s04-reset\" id=\"frS04Reset\" title=\"Reset\">\r\n          <i class=\"fas fa-redo-alt\"><\/i>\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n  var form = document.getElementById('frS04Form');\r\n  var submitted = document.getElementById('frS04Submitted');\r\n  var submitBtn = document.getElementById('frS04SubmitBtn');\r\n  var resetBtn = document.getElementById('frS04Reset');\r\n  var homeBtn = document.getElementById('frS04HomeBtn');\r\n  var levelBar = document.getElementById('frS04LevelBar');\r\n\r\n  function hideAll() {\r\n    form.classList.remove('active');\r\n    submitted.classList.remove('active');\r\n    levelBar.classList.remove('go');\r\n  }\r\n\r\n  function showState(el) {\r\n    hideAll();\r\n    el.classList.add('active');\r\n  }\r\n\r\n  \/\/ Submit \u2192 Submitted + animate level bar\r\n  submitBtn.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(submitted);\r\n    setTimeout(function() {\r\n      levelBar.classList.add('go');\r\n    }, 300);\r\n  });\r\n\r\n  \/\/ Home button \u2192 back to form\r\n  homeBtn.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(form);\r\n  });\r\n\r\n  \/\/ Reset\r\n  resetBtn.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(form);\r\n  });\r\n})();\r\n<\/script>\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-35cb728 elementor-widget elementor-widget-html\" data-id=\"35cb728\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!-- ============================================\r\n     FIRE RANT \u2014 APP PAGE STEP 05\r\n     Track Your Impact \/ Community Leaderboard\r\n     SCROLLABLE FIX \u2014 content scrolls in phone\r\n============================================ -->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<style>\r\n.fr-step05 {\r\n  background: #0a0a0a;\r\n  padding: 80px 40px;\r\n  font-family: Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n  border-top: 1px solid rgba(255,255,255,0.04);\r\n}\r\n\r\n.fr-step05-grid {\r\n  max-width: 1100px;\r\n  margin: 0 auto;\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 60px;\r\n  align-items: center;\r\n}\r\n\r\n\/* LEFT COLUMN \u2014 INFO *\/\r\n.fr-step05-tag {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border: 1px solid rgba(255, 59, 59, 0.25);\r\n  border-radius: 980px;\r\n  padding: 6px 14px;\r\n  font-size: 0.75rem;\r\n  font-weight: 700;\r\n  color: #ff3b3b;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.fr-step05-info h2 {\r\n  font-size: 2.2rem;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 16px;\r\n  letter-spacing: -0.5px;\r\n  line-height: 1.15;\r\n}\r\n\r\n.fr-step05-info > p {\r\n  font-size: 1.05rem;\r\n  color: rgba(255, 255, 255, 0.6);\r\n  line-height: 1.7;\r\n  margin: 0 0 28px;\r\n}\r\n\r\n.fr-step05-features {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n}\r\n\r\n.fr-step05-features li {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 10px 0;\r\n  font-size: 0.95rem;\r\n  color: rgba(255, 255, 255, 0.75);\r\n}\r\n\r\n.fr-step05-features li i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n  width: 28px;\r\n  height: 28px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border-radius: 8px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n\/* RIGHT COLUMN \u2014 iPHONE *\/\r\n.fr-step05-phone-col {\r\n  display: flex;\r\n  justify-content: center;\r\n  position: relative;\r\n}\r\n\r\n.fr-s05-phone {\r\n  position: relative;\r\n  width: 320px;\r\n  height: 640px;\r\n  background: #000;\r\n  border-radius: 44px;\r\n  border: 4px solid #2a2a2a;\r\n  box-shadow: 0 25px 70px rgba(0,0,0,.75);\r\n  overflow: hidden;\r\n  font-family: Inter, -apple-system, Arial, sans-serif;\r\n}\r\n\r\n\/* Status Bar *\/\r\n.fr-s05-status {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  display: grid;\r\n  grid-template-columns: 48px 1fr 68px;\r\n  align-items: center;\r\n  padding: 14px 24px 0;\r\n  font-size: 10px;\r\n  color: #fff;\r\n  font-weight: 700;\r\n  z-index: 30;\r\n  background: #0d0d0d;\r\n}\r\n\r\n.fr-s05-status-right {\r\n  text-align: right;\r\n  font-weight: 600;\r\n}\r\n\r\n.fr-s05-island {\r\n  width: 140px;\r\n  height: 34px;\r\n  background: #000;\r\n  border-radius: 999px;\r\n  margin: 0 auto;\r\n  border: 1.5px solid #ff3b3b;\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 0 14px;\r\n}\r\n\r\n.fr-s05-island img {\r\n  width: 18px;\r\n  height: 18px;\r\n  object-fit: contain;\r\n}\r\n\r\n\/* ALL STATES \u2014 SCROLLABLE FIX *\/\r\n.fr-s05-state {\r\n  position: absolute;\r\n  inset: 0;\r\n  opacity: 0;\r\n  transition: opacity 0.4s ease;\r\n  pointer-events: none;\r\n  overflow-y: auto;\r\n  -webkit-overflow-scrolling: touch;\r\n}\r\n\r\n.fr-s05-state::-webkit-scrollbar {\r\n  display: none;\r\n}\r\n\r\n.fr-s05-state.active {\r\n  opacity: 1;\r\n  pointer-events: auto;\r\n}\r\n\r\n\/* ==========================================\r\n   STATE 1: PROFILE + LEADERBOARD\r\n   ========================================== *\/\r\n.fr-s05-profile {\r\n  padding: 62px 18px 130px;\r\n}\r\n\r\n\/* Profile Header *\/\r\n.fr-s05-profile-top {\r\n  text-align: center;\r\n  margin-bottom: 22px;\r\n}\r\n\r\n.fr-s05-avatar {\r\n  width: 56px;\r\n  height: 56px;\r\n  border-radius: 50%;\r\n  background: linear-gradient(135deg, #ff3b3b, #cc0000);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  margin: 0 auto 10px;\r\n  font-size: 20px;\r\n  font-weight: 900;\r\n  color: #fff;\r\n}\r\n\r\n.fr-s05-username {\r\n  font-size: 16px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 3px;\r\n}\r\n\r\n.fr-s05-rank {\r\n  font-size: 11px;\r\n  color: #ff3b3b;\r\n  font-weight: 700;\r\n}\r\n\r\n\/* Stats Row *\/\r\n.fr-s05-stats-row {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr 1fr;\r\n  gap: 8px;\r\n  margin-bottom: 20px;\r\n}\r\n\r\n.fr-s05-stat-card {\r\n  background: rgba(255,255,255,0.03);\r\n  border: 1px solid rgba(255,255,255,0.06);\r\n  border-radius: 12px;\r\n  padding: 12px 8px;\r\n  text-align: center;\r\n}\r\n\r\n.fr-s05-stat-num {\r\n  font-size: 18px;\r\n  font-weight: 900;\r\n  color: #fff;\r\n  margin: 0 0 2px;\r\n}\r\n\r\n.fr-s05-stat-label {\r\n  font-size: 9px;\r\n  color: rgba(255,255,255,0.4);\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.3px;\r\n  margin: 0;\r\n}\r\n\r\n\/* Tabs *\/\r\n.fr-s05-tabs {\r\n  display: flex;\r\n  gap: 6px;\r\n  margin-bottom: 18px;\r\n}\r\n\r\n.fr-s05-tab {\r\n  flex: 1;\r\n  padding: 10px;\r\n  text-align: center;\r\n  font-size: 11px;\r\n  font-weight: 700;\r\n  color: rgba(255,255,255,0.4);\r\n  background: rgba(255,255,255,0.03);\r\n  border: 1px solid rgba(255,255,255,0.06);\r\n  border-radius: 10px;\r\n  cursor: pointer;\r\n  transition: all 0.2s;\r\n}\r\n\r\n.fr-s05-tab.active {\r\n  color: #fff;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border-color: rgba(255, 59, 59, 0.3);\r\n}\r\n\r\n\/* Leaderboard *\/\r\n.fr-s05-lb-header {\r\n  display: flex;\r\n  justify-content: space-between;\r\n  align-items: center;\r\n  margin-bottom: 12px;\r\n}\r\n\r\n.fr-s05-lb-title {\r\n  font-size: 14px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0;\r\n}\r\n\r\n.fr-s05-lb-tab {\r\n  font-size: 10px;\r\n  color: rgba(255,255,255,0.4);\r\n  background: rgba(255,255,255,0.04);\r\n  border-radius: 999px;\r\n  padding: 4px 10px;\r\n  font-weight: 600;\r\n}\r\n\r\n.fr-s05-lb-list {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n}\r\n\r\n.fr-s05-lb-item {\r\n  display: grid;\r\n  grid-template-columns: 24px 32px 1fr auto;\r\n  gap: 10px;\r\n  align-items: center;\r\n  padding: 10px 12px;\r\n  border-radius: 12px;\r\n  margin-bottom: 6px;\r\n  background: rgba(255,255,255,0.02);\r\n  border: 1px solid rgba(255,255,255,0.04);\r\n}\r\n\r\n.fr-s05-lb-item.me {\r\n  background: rgba(255, 59, 59, 0.06);\r\n  border-color: rgba(255, 59, 59, 0.15);\r\n}\r\n\r\n.fr-s05-lb-pos {\r\n  font-size: 12px;\r\n  font-weight: 800;\r\n  color: rgba(255,255,255,0.4);\r\n  text-align: center;\r\n}\r\n\r\n.fr-s05-lb-item.me .fr-s05-lb-pos {\r\n  color: #ff3b3b;\r\n}\r\n\r\n.fr-s05-lb-avatar {\r\n  width: 32px;\r\n  height: 32px;\r\n  border-radius: 50%;\r\n  background: rgba(255,255,255,0.08);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  font-size: 11px;\r\n  font-weight: 800;\r\n  color: rgba(255,255,255,0.6);\r\n}\r\n\r\n.fr-s05-lb-item.me .fr-s05-lb-avatar {\r\n  background: linear-gradient(135deg, #ff3b3b, #cc0000);\r\n  color: #fff;\r\n}\r\n\r\n.fr-s05-lb-name {\r\n  font-size: 12px;\r\n  font-weight: 700;\r\n  color: rgba(255,255,255,0.8);\r\n  margin: 0;\r\n}\r\n\r\n.fr-s05-lb-region {\r\n  font-size: 9px;\r\n  color: rgba(255,255,255,0.35);\r\n  margin: 2px 0 0;\r\n}\r\n\r\n.fr-s05-lb-pts {\r\n  font-size: 12px;\r\n  font-weight: 800;\r\n  color: #ff3b3b;\r\n}\r\n\r\n\/* ==========================================\r\n   STATE 2: COMMUNITY IMPACT MAP\r\n   ========================================== *\/\r\n.fr-s05-impact {\r\n  padding: 62px 18px 130px;\r\n}\r\n\r\n.fr-s05-impact-header {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  margin-bottom: 18px;\r\n}\r\n\r\n.fr-s05-impact-back {\r\n  width: 30px;\r\n  height: 30px;\r\n  border-radius: 50%;\r\n  background: rgba(255,255,255,0.05);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: #fff;\r\n  font-size: 11px;\r\n  cursor: pointer;\r\n}\r\n\r\n.fr-s05-impact-title {\r\n  font-size: 16px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0;\r\n}\r\n\r\n\/* Map Area *\/\r\n.fr-s05-map-area {\r\n  width: 100%;\r\n  height: 120px;\r\n  border-radius: 16px;\r\n  background: linear-gradient(135deg, #1a1a1a, #0f0f0f);\r\n  border: 1px solid rgba(255,255,255,0.06);\r\n  position: relative;\r\n  overflow: hidden;\r\n  margin-bottom: 18px;\r\n}\r\n\r\n.fr-s05-map-dots {\r\n  position: absolute;\r\n  inset: 0;\r\n}\r\n\r\n.fr-s05-dot {\r\n  position: absolute;\r\n  width: 8px;\r\n  height: 8px;\r\n  border-radius: 50%;\r\n  background: #ff3b3b;\r\n  animation: fr05pulse 2s infinite;\r\n}\r\n\r\n@keyframes fr05pulse {\r\n  0%, 100% { opacity: 0.4; transform: scale(1); }\r\n  50% { opacity: 1; transform: scale(1.5); }\r\n}\r\n\r\n.fr-s05-dot:nth-child(1) { top: 30%; left: 25%; animation-delay: 0s; }\r\n.fr-s05-dot:nth-child(2) { top: 50%; left: 45%; animation-delay: 0.4s; }\r\n.fr-s05-dot:nth-child(3) { top: 35%; left: 60%; animation-delay: 0.8s; }\r\n.fr-s05-dot:nth-child(4) { top: 65%; left: 35%; animation-delay: 1.2s; }\r\n.fr-s05-dot:nth-child(5) { top: 55%; left: 72%; animation-delay: 1.6s; }\r\n.fr-s05-dot:nth-child(6) { top: 75%; left: 55%; animation-delay: 0.3s; }\r\n\r\n.fr-s05-map-label {\r\n  position: absolute;\r\n  bottom: 10px;\r\n  left: 14px;\r\n  font-size: 10px;\r\n  color: rgba(255,255,255,0.4);\r\n  font-weight: 600;\r\n}\r\n\r\n.fr-s05-map-count {\r\n  position: absolute;\r\n  bottom: 10px;\r\n  right: 14px;\r\n  font-size: 10px;\r\n  color: #ff3b3b;\r\n  font-weight: 800;\r\n}\r\n\r\n\/* Impact Stats *\/\r\n.fr-s05-impact-stats {\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 10px;\r\n  margin-bottom: 18px;\r\n}\r\n\r\n.fr-s05-impact-card {\r\n  background: rgba(255,255,255,0.03);\r\n  border: 1px solid rgba(255,255,255,0.06);\r\n  border-radius: 14px;\r\n  padding: 12px;\r\n  text-align: center;\r\n}\r\n\r\n.fr-s05-impact-num {\r\n  font-size: 18px;\r\n  font-weight: 900;\r\n  color: #fff;\r\n  margin: 0 0 2px;\r\n}\r\n\r\n.fr-s05-impact-num span {\r\n  color: #ff3b3b;\r\n}\r\n\r\n.fr-s05-impact-desc {\r\n  font-size: 10px;\r\n  color: rgba(255,255,255,0.4);\r\n  margin: 0;\r\n}\r\n\r\n\/* Recent Activity *\/\r\n.fr-s05-activity-title {\r\n  font-size: 13px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 10px;\r\n}\r\n\r\n.fr-s05-activity-item {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  padding: 10px 0;\r\n  border-bottom: 1px solid rgba(255,255,255,0.04);\r\n}\r\n\r\n.fr-s05-activity-icon {\r\n  width: 30px;\r\n  height: 30px;\r\n  border-radius: 8px;\r\n  background: rgba(255, 59, 59, 0.08);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  flex-shrink: 0;\r\n}\r\n\r\n.fr-s05-activity-icon i {\r\n  color: #ff3b3b;\r\n  font-size: 12px;\r\n}\r\n\r\n.fr-s05-activity-text {\r\n  font-size: 11px;\r\n  color: rgba(255,255,255,0.7);\r\n  margin: 0;\r\n  line-height: 1.4;\r\n}\r\n\r\n.fr-s05-activity-text strong {\r\n  color: #fff;\r\n}\r\n\r\n.fr-s05-activity-time {\r\n  font-size: 9px;\r\n  color: rgba(255,255,255,0.3);\r\n  margin-left: auto;\r\n  white-space: nowrap;\r\n}\r\n\r\n\/* Bottom Nav *\/\r\n.fr-s05-nav {\r\n  position: absolute;\r\n  left: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  height: 120px;\r\n  background-image: url('https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Nav-Menu-Full-scaled.webp');\r\n  background-repeat: no-repeat;\r\n  background-position: bottom center;\r\n  background-size: 100% auto;\r\n  z-index: 40;\r\n}\r\n\r\n.fr-s05-nav-icon {\r\n  position: absolute;\r\n  bottom: 24px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: rgba(255,255,255,0.72);\r\n  z-index: 45;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s05-nav-icon svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.5;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n.fr-s05-nav-icon.n-home { left: 30px; }\r\n.fr-s05-nav-icon.n-reports { left: 88px; }\r\n.fr-s05-nav-icon.n-articles { right: 88px; }\r\n.fr-s05-nav-icon.n-profile { right: 30px; }\r\n\r\n.fr-s05-nav-camera {\r\n  position: absolute;\r\n  left: 50%;\r\n  top: 58%;\r\n  transform: translate(-50%, -50%);\r\n  margin-top: -16px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: #fff;\r\n  z-index: 46;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s05-nav-camera svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.6;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n\/* RESET *\/\r\n.fr-s05-reset {\r\n  position: absolute;\r\n  top: 16px;\r\n  right: -44px;\r\n  width: 36px;\r\n  height: 36px;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border: 1px solid rgba(255, 59, 59, 0.3);\r\n  border-radius: 50%;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  cursor: pointer;\r\n  transition: background 0.2s;\r\n  z-index: 50;\r\n}\r\n\r\n.fr-s05-reset:hover {\r\n  background: rgba(255, 59, 59, 0.25);\r\n}\r\n\r\n.fr-s05-reset i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n}\r\n\r\n\/* MOBILE *\/\r\n@media (max-width: 768px) {\r\n  .fr-step05 { padding: 50px 20px; }\r\n  .fr-step05-grid {\r\n    grid-template-columns: 1fr;\r\n    gap: 40px;\r\n    text-align: center;\r\n  }\r\n  .fr-step05-info h2 { font-size: 1.7rem; }\r\n  .fr-step05-features li { justify-content: center; }\r\n  .fr-s05-phone { width: 300px; height: 600px; }\r\n  .fr-s05-reset { top: auto; bottom: -44px; right: 50%; transform: translateX(50%); }\r\n}\r\n<\/style>\r\n\r\n<div class=\"fr-step05\">\r\n  <div class=\"fr-step05-grid\">\r\n\r\n    <!-- LEFT \u2014 INFO -->\r\n    <div class=\"fr-step05-info\">\r\n      <div class=\"fr-step05-tag\">\r\n        <i class=\"fas fa-chart-line\"><\/i> Step 05\r\n      <\/div>\r\n      <h2>Track your impact<br>& climb the ranks<\/h2>\r\n      <p>Every report strengthens the biosecurity network. Watch your contributions add up, compete on the community leaderboard, and see how your local area is tracking in real time.<\/p>\r\n      <ul class=\"fr-step05-features\">\r\n        <li><i class=\"fas fa-trophy\"><\/i> Community leaderboard by region<\/li>\r\n        <li><i class=\"fas fa-map-marked-alt\"><\/i> Live heatmap of reported sightings<\/li>\r\n        <li><i class=\"fas fa-fire\"><\/i> Your total contribution to eradication<\/li>\r\n        <li><i class=\"fas fa-users\"><\/i> Network effect \u2014 more users, faster response<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n\r\n    <!-- RIGHT \u2014 iPHONE -->\r\n    <div class=\"fr-step05-phone-col\">\r\n      <div class=\"fr-s05-phone\" id=\"frS05Phone\">\r\n\r\n        <!-- Status Bar -->\r\n        <div class=\"fr-s05-status\">\r\n          <span>2:34<\/span>\r\n          <div class=\"fr-s05-island\">\r\n            <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/antScroll-scaled.png\" alt=\"Ant\">\r\n          <\/div>\r\n          <span class=\"fr-s05-status-right\">5G  77%<\/span>\r\n        <\/div>\r\n\r\n        <!-- STATE 1: PROFILE + LEADERBOARD -->\r\n        <div class=\"fr-s05-state fr-s05-profile active\" id=\"frS05Profile\">\r\n\r\n          <!-- Profile Header -->\r\n          <div class=\"fr-s05-profile-top\">\r\n            <div class=\"fr-s05-avatar\">JW<\/div>\r\n            <p class=\"fr-s05-username\">james@firerant.com.au<\/p>\r\n            <span class=\"fr-s05-rank\"><i class=\"fas fa-shield-alt\"><\/i> Scout Rank<\/span>\r\n          <\/div>\r\n\r\n          <!-- Stats Row -->\r\n          <div class=\"fr-s05-stats-row\">\r\n            <div class=\"fr-s05-stat-card\">\r\n              <p class=\"fr-s05-stat-num\">7<\/p>\r\n              <p class=\"fr-s05-stat-label\">\u62a5\u544a<\/p>\r\n            <\/div>\r\n            <div class=\"fr-s05-stat-card\">\r\n              <p class=\"fr-s05-stat-num\">770<\/p>\r\n              <p class=\"fr-s05-stat-label\">Points<\/p>\r\n            <\/div>\r\n            <div class=\"fr-s05-stat-card\">\r\n              <p class=\"fr-s05-stat-num\">#12<\/p>\r\n              <p class=\"fr-s05-stat-label\">Rank<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <!-- Tabs -->\r\n          <div class=\"fr-s05-tabs\">\r\n            <div class=\"fr-s05-tab active\" id=\"frS05TabLb\">\u6392\u884c\u699c<\/div>\r\n            <div class=\"fr-s05-tab\" id=\"frS05TabImpact\">My Impact<\/div>\r\n          <\/div>\r\n\r\n          <!-- Leaderboard -->\r\n          <div class=\"fr-s05-lb-header\">\r\n            <p class=\"fr-s05-lb-title\">SEQ Region<\/p>\r\n            <span class=\"fr-s05-lb-tab\">This Month<\/span>\r\n          <\/div>\r\n\r\n          <ul class=\"fr-s05-lb-list\">\r\n            <li class=\"fr-s05-lb-item\">\r\n              <span class=\"fr-s05-lb-pos\">1<\/span>\r\n              <div class=\"fr-s05-lb-avatar\">SB<\/div>\r\n              <div>\r\n                <p class=\"fr-s05-lb-name\">Sarah B.<\/p>\r\n                <p class=\"fr-s05-lb-region\">Logan, QLD<\/p>\r\n              <\/div>\r\n              <span class=\"fr-s05-lb-pts\">2,340<\/span>\r\n            <\/li>\r\n            <li class=\"fr-s05-lb-item\">\r\n              <span class=\"fr-s05-lb-pos\">2<\/span>\r\n              <div class=\"fr-s05-lb-avatar\">MK<\/div>\r\n              <div>\r\n                <p class=\"fr-s05-lb-name\">Mike K.<\/p>\r\n                <p class=\"fr-s05-lb-region\">Ipswich, QLD<\/p>\r\n              <\/div>\r\n              <span class=\"fr-s05-lb-pts\">1,890<\/span>\r\n            <\/li>\r\n            <li class=\"fr-s05-lb-item\">\r\n              <span class=\"fr-s05-lb-pos\">3<\/span>\r\n              <div class=\"fr-s05-lb-avatar\">TC<\/div>\r\n              <div>\r\n                <p class=\"fr-s05-lb-name\">Tina C.<\/p>\r\n                <p class=\"fr-s05-lb-region\">Gold Coast, QLD<\/p>\r\n              <\/div>\r\n              <span class=\"fr-s05-lb-pts\">1,550<\/span>\r\n            <\/li>\r\n            <li class=\"fr-s05-lb-item me\">\r\n              <span class=\"fr-s05-lb-pos\">12<\/span>\r\n              <div class=\"fr-s05-lb-avatar\">JW<\/div>\r\n              <div>\r\n                <p class=\"fr-s05-lb-name\">You<\/p>\r\n                <p class=\"fr-s05-lb-region\">Yarrabilba, QLD<\/p>\r\n              <\/div>\r\n              <span class=\"fr-s05-lb-pts\">770<\/span>\r\n            <\/li>\r\n          <\/ul>\r\n\r\n        <\/div>\r\n\r\n        <!-- STATE 2: COMMUNITY IMPACT MAP -->\r\n        <div class=\"fr-s05-state fr-s05-impact\" id=\"frS05Impact\">\r\n\r\n          <div class=\"fr-s05-impact-header\">\r\n            <div class=\"fr-s05-impact-back\" id=\"frS05BackBtn\"><i class=\"fas fa-chevron-left\"><\/i><\/div>\r\n            <p class=\"fr-s05-impact-title\">Community Impact<\/p>\r\n          <\/div>\r\n\r\n          <!-- Map Area -->\r\n          <div class=\"fr-s05-map-area\">\r\n            <div class=\"fr-s05-map-dots\">\r\n              <div class=\"fr-s05-dot\"><\/div>\r\n              <div class=\"fr-s05-dot\"><\/div>\r\n              <div class=\"fr-s05-dot\"><\/div>\r\n              <div class=\"fr-s05-dot\"><\/div>\r\n              <div class=\"fr-s05-dot\"><\/div>\r\n              <div class=\"fr-s05-dot\"><\/div>\r\n            <\/div>\r\n            <span class=\"fr-s05-map-label\">SEQ Region<\/span>\r\n            <span class=\"fr-s05-map-count\">847 reports<\/span>\r\n          <\/div>\r\n\r\n          <!-- Impact Stats -->\r\n          <div class=\"fr-s05-impact-stats\">\r\n            <div class=\"fr-s05-impact-card\">\r\n              <p class=\"fr-s05-impact-num\"><span>847<\/span><\/p>\r\n              <p class=\"fr-s05-impact-desc\">Total Reports<\/p>\r\n            <\/div>\r\n            <div class=\"fr-s05-impact-card\">\r\n              <p class=\"fr-s05-impact-num\"><span>234<\/span><\/p>\r\n              <p class=\"fr-s05-impact-desc\">Active Users<\/p>\r\n            <\/div>\r\n            <div class=\"fr-s05-impact-card\">\r\n              <p class=\"fr-s05-impact-num\"><span>92%<\/span><\/p>\r\n              <p class=\"fr-s05-impact-desc\">Accuracy Rate<\/p>\r\n            <\/div>\r\n            <div class=\"fr-s05-impact-card\">\r\n              <p class=\"fr-s05-impact-num\"><span>48hr<\/span><\/p>\r\n              <p class=\"fr-s05-impact-desc\">Avg Response<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <!-- Recent Activity -->\r\n          <p class=\"fr-s05-activity-title\">Recent Network Activity<\/p>\r\n\r\n          <div class=\"fr-s05-activity-item\">\r\n            <div class=\"fr-s05-activity-icon\"><i class=\"fas fa-flag\"><\/i><\/div>\r\n            <p class=\"fr-s05-activity-text\"><strong>New nest confirmed<\/strong> \u2014 Logan Reserve<\/p>\r\n            <span class=\"fr-s05-activity-time\">2h ago<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"fr-s05-activity-item\">\r\n            <div class=\"fr-s05-activity-icon\"><i class=\"fas fa-check-circle\"><\/i><\/div>\r\n            <p class=\"fr-s05-activity-text\"><strong>Treatment dispatched<\/strong> \u2014 Yarrabilba<\/p>\r\n            <span class=\"fr-s05-activity-time\">5h ago<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"fr-s05-activity-item\">\r\n            <div class=\"fr-s05-activity-icon\"><i class=\"fas fa-user-plus\"><\/i><\/div>\r\n            <p class=\"fr-s05-activity-text\"><strong>12 new users<\/strong> joined this week<\/p>\r\n            <span class=\"fr-s05-activity-time\">1d ago<\/span>\r\n          <\/div>\r\n\r\n          <div class=\"fr-s05-activity-item\">\r\n            <div class=\"fr-s05-activity-icon\"><i class=\"fas fa-bug\"><\/i><\/div>\r\n            <p class=\"fr-s05-activity-text\"><strong>Nest cluster identified<\/strong> \u2014 Scenic Rim<\/p>\r\n            <span class=\"fr-s05-activity-time\">2d ago<\/span>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n        <!-- Bottom Nav -->\r\n        <div class=\"fr-s05-nav\">\r\n          <div class=\"fr-s05-nav-camera\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M7 7h2l1.5-2h3L15 7h2a3 3 0 0 1 3 3v7a3 3 0 0 1-3 3H7a3 3 0 0 1-3-3v-7a3 3 0 0 1 3-3z\"><\/path>\r\n              <circle cx=\"12\" cy=\"13.5\" r=\"3.2\"><\/circle>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s05-nav-icon n-home\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M3 11.5L12 4l9 7.5\"><\/path>\r\n              <path d=\"M5.5 10.5V20h5v-5h3v5h5v-9.5\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s05-nav-icon n-reports\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M8 4h8\"><\/path>\r\n              <path d=\"M9 4a3 3 0 0 0 6 0\"><\/path>\r\n              <rect x=\"5\" y=\"5\" width=\"14\" height=\"16\" rx=\"2\"><\/rect>\r\n              <path d=\"M8 11h8\"><\/path>\r\n              <path d=\"M8 15h8\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s05-nav-icon n-articles\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M4 5.5c2.5 0 5 .4 8 2.2v12c-3-1.8-5.5-2.2-8-2.2z\"><\/path>\r\n              <path d=\"M20 5.5c-2.5 0-5 .4-8 2.2v12c3-1.8 5.5-2.2 8-2.2z\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s05-nav-icon n-profile\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <circle cx=\"12\" cy=\"8\" r=\"3.5\"><\/circle>\r\n              <path d=\"M5 20c1.2-4 4-6 7-6s5.8 2 7 6\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Reset -->\r\n        <div class=\"fr-s05-reset\" id=\"frS05Reset\" title=\"Reset\">\r\n          <i class=\"fas fa-redo-alt\"><\/i>\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n  var profile = document.getElementById('frS05Profile');\r\n  var impact = document.getElementById('frS05Impact');\r\n  var tabLb = document.getElementById('frS05TabLb');\r\n  var tabImpact = document.getElementById('frS05TabImpact');\r\n  var backBtn = document.getElementById('frS05BackBtn');\r\n  var resetBtn = document.getElementById('frS05Reset');\r\n\r\n  function hideAll() {\r\n    profile.classList.remove('active');\r\n    impact.classList.remove('active');\r\n  }\r\n\r\n  function showState(el) {\r\n    hideAll();\r\n    el.classList.add('active');\r\n  }\r\n\r\n  tabImpact.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    tabLb.classList.remove('active');\r\n    tabImpact.classList.add('active');\r\n    showState(impact);\r\n  });\r\n\r\n  tabLb.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    tabImpact.classList.remove('active');\r\n    tabLb.classList.add('active');\r\n    showState(profile);\r\n  });\r\n\r\n  backBtn.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    tabImpact.classList.remove('active');\r\n    tabLb.classList.add('active');\r\n    showState(profile);\r\n  });\r\n\r\n  resetBtn.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    tabImpact.classList.remove('active');\r\n    tabLb.classList.add('active');\r\n    showState(profile);\r\n  });\r\n})();\r\n<\/script>\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-c4bf33a elementor-widget elementor-widget-html\" data-id=\"c4bf33a\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!-- ============================================\r\n     FIRE RANT \u2014 APP PAGE STEP 06\r\n     Knowledge Hub \u2014 Learn & Stay Informed\r\n     2-Column: Info left, iPhone right\r\n     IMAGE: ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\r\n============================================ -->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/6.4.0\/css\/all.min.css\">\r\n\r\n<style>\r\n.fr-step06 {\r\n  background: #0a0a0a;\r\n  padding: 80px 40px;\r\n  font-family: Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n  border-top: 1px solid rgba(255,255,255,0.04);\r\n}\r\n\r\n.fr-step06-grid {\r\n  max-width: 1100px;\r\n  margin: 0 auto;\r\n  display: grid;\r\n  grid-template-columns: 1fr 1fr;\r\n  gap: 60px;\r\n  align-items: center;\r\n}\r\n\r\n\/* LEFT COLUMN \u2014 INFO *\/\r\n.fr-step06-tag {\r\n  display: inline-flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border: 1px solid rgba(255, 59, 59, 0.25);\r\n  border-radius: 980px;\r\n  padding: 6px 14px;\r\n  font-size: 0.75rem;\r\n  font-weight: 700;\r\n  color: #ff3b3b;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  margin-bottom: 24px;\r\n}\r\n\r\n.fr-step06-info h2 {\r\n  font-size: 2.2rem;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 16px;\r\n  letter-spacing: -0.5px;\r\n  line-height: 1.15;\r\n}\r\n\r\n.fr-step06-info > p {\r\n  font-size: 1.05rem;\r\n  color: rgba(255, 255, 255, 0.6);\r\n  line-height: 1.7;\r\n  margin: 0 0 28px;\r\n}\r\n\r\n.fr-step06-features {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0;\r\n}\r\n\r\n.fr-step06-features li {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 12px;\r\n  padding: 10px 0;\r\n  font-size: 0.95rem;\r\n  color: rgba(255, 255, 255, 0.75);\r\n}\r\n\r\n.fr-step06-features li i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n  width: 28px;\r\n  height: 28px;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border-radius: 8px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n\/* RIGHT COLUMN \u2014 iPHONE *\/\r\n.fr-step06-phone-col {\r\n  display: flex;\r\n  justify-content: center;\r\n  position: relative;\r\n}\r\n\r\n.fr-s06-phone {\r\n  position: relative;\r\n  width: 320px;\r\n  height: 640px;\r\n  background: #000;\r\n  border-radius: 44px;\r\n  border: 4px solid #2a2a2a;\r\n  box-shadow: 0 25px 70px rgba(0,0,0,.75);\r\n  overflow: hidden;\r\n  font-family: Inter, -apple-system, Arial, sans-serif;\r\n}\r\n\r\n\/* Status Bar *\/\r\n.fr-s06-status {\r\n  position: absolute;\r\n  top: 0;\r\n  left: 0;\r\n  right: 0;\r\n  display: grid;\r\n  grid-template-columns: 48px 1fr 68px;\r\n  align-items: center;\r\n  padding: 14px 24px 0;\r\n  font-size: 10px;\r\n  color: #fff;\r\n  font-weight: 700;\r\n  z-index: 30;\r\n  background: #0d0d0d;\r\n}\r\n\r\n.fr-s06-status-right {\r\n  text-align: right;\r\n  font-weight: 600;\r\n}\r\n\r\n.fr-s06-island {\r\n  width: 140px;\r\n  height: 34px;\r\n  background: #000;\r\n  border-radius: 999px;\r\n  margin: 0 auto;\r\n  border: 1.5px solid #ff3b3b;\r\n  display: flex;\r\n  align-items: center;\r\n  padding: 0 14px;\r\n}\r\n\r\n.fr-s06-island img {\r\n  width: 18px;\r\n  height: 18px;\r\n  object-fit: contain;\r\n}\r\n\r\n\/* ALL STATES *\/\r\n.fr-s06-state {\r\n  position: absolute;\r\n  inset: 0;\r\n  opacity: 0;\r\n  transition: opacity 0.4s ease;\r\n  pointer-events: none;\r\n  overflow-y: auto;\r\n  -webkit-overflow-scrolling: touch;\r\n}\r\n\r\n.fr-s06-state::-webkit-scrollbar {\r\n  display: none;\r\n}\r\n\r\n.fr-s06-state.active {\r\n  opacity: 1;\r\n  pointer-events: auto;\r\n}\r\n\r\n\/* ==========================================\r\n   STATE 1: KNOWLEDGE HUB \u2014 ARTICLE LIST\r\n   ========================================== *\/\r\n.fr-s06-hub {\r\n  padding: 62px 18px 130px;\r\n}\r\n\r\n.fr-s06-hub-header {\r\n  margin-bottom: 18px;\r\n}\r\n\r\n.fr-s06-hub-title {\r\n  font-size: 18px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 4px;\r\n}\r\n\r\n.fr-s06-hub-sub {\r\n  font-size: 11px;\r\n  color: rgba(255,255,255,0.4);\r\n  margin: 0;\r\n}\r\n\r\n\/* Category Chips *\/\r\n.fr-s06-chips {\r\n  display: flex;\r\n  gap: 6px;\r\n  margin-bottom: 18px;\r\n  overflow-x: auto;\r\n}\r\n\r\n.fr-s06-chips::-webkit-scrollbar { display: none; }\r\n\r\n.fr-s06-chip {\r\n  padding: 6px 12px;\r\n  border-radius: 980px;\r\n  font-size: 10px;\r\n  font-weight: 700;\r\n  white-space: nowrap;\r\n  cursor: pointer;\r\n  transition: all 0.2s;\r\n  border: 1px solid rgba(255,255,255,0.08);\r\n  color: rgba(255,255,255,0.5);\r\n  background: rgba(255,255,255,0.03);\r\n}\r\n\r\n.fr-s06-chip.active {\r\n  background: rgba(255, 59, 59, 0.12);\r\n  border-color: rgba(255, 59, 59, 0.3);\r\n  color: #ff3b3b;\r\n}\r\n\r\n\/* Article Cards *\/\r\n.fr-s06-article {\r\n  background: rgba(255,255,255,0.03);\r\n  border: 1px solid rgba(255,255,255,0.06);\r\n  border-radius: 16px;\r\n  overflow: hidden;\r\n  margin-bottom: 12px;\r\n  cursor: pointer;\r\n  transition: transform 0.2s, border-color 0.2s;\r\n}\r\n\r\n.fr-s06-article:hover {\r\n  transform: scale(1.01);\r\n  border-color: rgba(255, 59, 59, 0.2);\r\n}\r\n\r\n.fr-s06-article-img {\r\n  width: 100%;\r\n  height: 100px;\r\n  object-fit: cover;\r\n  display: block;\r\n}\r\n\r\n.fr-s06-article-body {\r\n  padding: 12px 14px;\r\n}\r\n\r\n.fr-s06-article-cat {\r\n  font-size: 9px;\r\n  font-weight: 700;\r\n  color: #ff3b3b;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.4px;\r\n  margin: 0 0 4px;\r\n}\r\n\r\n.fr-s06-article-title {\r\n  font-size: 13px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 4px;\r\n  line-height: 1.3;\r\n}\r\n\r\n.fr-s06-article-meta {\r\n  font-size: 9px;\r\n  color: rgba(255,255,255,0.35);\r\n  margin: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 8px;\r\n}\r\n\r\n.fr-s06-article-meta i {\r\n  font-size: 8px;\r\n}\r\n\r\n\/* ==========================================\r\n   STATE 2: ARTICLE DETAIL VIEW\r\n   ========================================== *\/\r\n.fr-s06-detail {\r\n  padding: 62px 18px 130px;\r\n}\r\n\r\n.fr-s06-detail-header {\r\n  display: flex;\r\n  align-items: center;\r\n  gap: 10px;\r\n  margin-bottom: 16px;\r\n}\r\n\r\n.fr-s06-detail-back {\r\n  width: 30px;\r\n  height: 30px;\r\n  border-radius: 50%;\r\n  background: rgba(255,255,255,0.05);\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  color: #fff;\r\n  font-size: 11px;\r\n  cursor: pointer;\r\n}\r\n\r\n.fr-s06-detail-label {\r\n  font-size: 12px;\r\n  font-weight: 700;\r\n  color: rgba(255,255,255,0.5);\r\n  margin: 0;\r\n}\r\n\r\n.fr-s06-detail-hero {\r\n  width: 100%;\r\n  height: 130px;\r\n  border-radius: 14px;\r\n  object-fit: cover;\r\n  display: block;\r\n  margin-bottom: 16px;\r\n}\r\n\r\n.fr-s06-detail-cat {\r\n  font-size: 9px;\r\n  font-weight: 700;\r\n  color: #ff3b3b;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.4px;\r\n  margin: 0 0 6px;\r\n}\r\n\r\n.fr-s06-detail-title {\r\n  font-size: 17px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 6px;\r\n  line-height: 1.25;\r\n}\r\n\r\n.fr-s06-detail-date {\r\n  font-size: 10px;\r\n  color: rgba(255,255,255,0.35);\r\n  margin: 0 0 16px;\r\n}\r\n\r\n.fr-s06-detail-text {\r\n  font-size: 12px;\r\n  color: rgba(255,255,255,0.65);\r\n  line-height: 1.7;\r\n  margin: 0 0 16px;\r\n}\r\n\r\n.fr-s06-detail-text strong {\r\n  color: #fff;\r\n}\r\n\r\n\/* Tips List *\/\r\n.fr-s06-tips {\r\n  list-style: none;\r\n  padding: 0;\r\n  margin: 0 0 16px;\r\n}\r\n\r\n.fr-s06-tips li {\r\n  display: flex;\r\n  align-items: flex-start;\r\n  gap: 10px;\r\n  padding: 8px 0;\r\n  font-size: 11px;\r\n  color: rgba(255,255,255,0.6);\r\n  line-height: 1.5;\r\n}\r\n\r\n.fr-s06-tips li i {\r\n  color: #ff3b3b;\r\n  font-size: 10px;\r\n  margin-top: 3px;\r\n  flex-shrink: 0;\r\n}\r\n\r\n\/* Related Articles *\/\r\n.fr-s06-related-title {\r\n  font-size: 12px;\r\n  font-weight: 800;\r\n  color: #fff;\r\n  margin: 0 0 10px;\r\n}\r\n\r\n.fr-s06-related-row {\r\n  display: flex;\r\n  gap: 8px;\r\n}\r\n\r\n.fr-s06-related-card {\r\n  flex: 1;\r\n  background: rgba(255,255,255,0.03);\r\n  border: 1px solid rgba(255,255,255,0.06);\r\n  border-radius: 10px;\r\n  overflow: hidden;\r\n}\r\n\r\n.fr-s06-related-img {\r\n  width: 100%;\r\n  height: 50px;\r\n  object-fit: cover;\r\n  display: block;\r\n}\r\n\r\n.fr-s06-related-name {\r\n  font-size: 9px;\r\n  font-weight: 700;\r\n  color: rgba(255,255,255,0.7);\r\n  padding: 6px 8px;\r\n  margin: 0;\r\n}\r\n\r\n\/* Bottom Nav *\/\r\n.fr-s06-nav {\r\n  position: absolute;\r\n  left: 0;\r\n  right: 0;\r\n  bottom: 0;\r\n  height: 120px;\r\n  background-image: url('https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Nav-Menu-Full-scaled.webp');\r\n  background-repeat: no-repeat;\r\n  background-position: bottom center;\r\n  background-size: 100% auto;\r\n  z-index: 40;\r\n}\r\n\r\n.fr-s06-nav-icon {\r\n  position: absolute;\r\n  bottom: 24px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: rgba(255,255,255,0.72);\r\n  z-index: 45;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s06-nav-icon svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.5;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n.fr-s06-nav-icon.n-home { left: 30px; }\r\n.fr-s06-nav-icon.n-reports { left: 88px; }\r\n.fr-s06-nav-icon.n-articles { right: 88px; color: #ff3b3b; }\r\n.fr-s06-nav-icon.n-profile { right: 30px; }\r\n\r\n.fr-s06-nav-camera {\r\n  position: absolute;\r\n  left: 50%;\r\n  top: 58%;\r\n  transform: translate(-50%, -50%);\r\n  margin-top: -16px;\r\n  width: 26px;\r\n  height: 26px;\r\n  color: #fff;\r\n  z-index: 46;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n}\r\n\r\n.fr-s06-nav-camera svg {\r\n  width: 20px;\r\n  height: 20px;\r\n  stroke: currentColor;\r\n  fill: none;\r\n  stroke-width: 2.6;\r\n  stroke-linecap: round;\r\n  stroke-linejoin: round;\r\n}\r\n\r\n\/* RESET *\/\r\n.fr-s06-reset {\r\n  position: absolute;\r\n  top: 16px;\r\n  right: -44px;\r\n  width: 36px;\r\n  height: 36px;\r\n  background: rgba(255, 59, 59, 0.1);\r\n  border: 1px solid rgba(255, 59, 59, 0.3);\r\n  border-radius: 50%;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  cursor: pointer;\r\n  transition: background 0.2s;\r\n  z-index: 50;\r\n}\r\n\r\n.fr-s06-reset:hover {\r\n  background: rgba(255, 59, 59, 0.25);\r\n}\r\n\r\n.fr-s06-reset i {\r\n  color: #ff3b3b;\r\n  font-size: 14px;\r\n}\r\n\r\n\/* MOBILE *\/\r\n@media (max-width: 768px) {\r\n  .fr-step06 { padding: 50px 20px; }\r\n  .fr-step06-grid {\r\n    grid-template-columns: 1fr;\r\n    gap: 40px;\r\n    text-align: center;\r\n  }\r\n  .fr-step06-info h2 { font-size: 1.7rem; }\r\n  .fr-step06-features li { justify-content: center; }\r\n  .fr-s06-phone { width: 300px; height: 600px; }\r\n  .fr-s06-reset { top: auto; bottom: -44px; right: 50%; transform: translateX(50%); }\r\n}\r\n<\/style>\r\n\r\n<div class=\"fr-step06\">\r\n  <div class=\"fr-step06-grid\">\r\n\r\n    <!-- LEFT \u2014 INFO -->\r\n    <div class=\"fr-step06-info\">\r\n      <div class=\"fr-step06-tag\">\r\n        <i class=\"fas fa-book-open\"><\/i> Step 06\r\n      <\/div>\r\n      <h2>Learn from the<br>\u77e5\u8bc6\u4e2d\u5fc3<\/h2>\r\n      <p>Access peer-reviewed identification guides, treatment protocols, and biosecurity updates \u2014 all curated by entomologists and field researchers working on the eradication frontline.<\/p>\r\n      <ul class=\"fr-step06-features\">\r\n        <li><i class=\"fas fa-microscope\"><\/i> Science-backed identification guides<\/li>\r\n        <li><i class=\"fas fa-shield-alt\"><\/i> APVMA-registered treatment protocols<\/li>\r\n        <li><i class=\"fas fa-bell\"><\/i> Real-time biosecurity alerts<\/li>\r\n        <li><i class=\"fas fa-graduation-cap\"><\/i> Earn points for completing articles<\/li>\r\n      <\/ul>\r\n    <\/div>\r\n\r\n    <!-- RIGHT \u2014 iPHONE -->\r\n    <div class=\"fr-step06-phone-col\">\r\n      <div class=\"fr-s06-phone\" id=\"frS06Phone\">\r\n\r\n        <!-- Status Bar -->\r\n        <div class=\"fr-s06-status\">\r\n          <span>2:34<\/span>\r\n          <div class=\"fr-s06-island\">\r\n            <img decoding=\"async\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/antScroll-scaled.png\" alt=\"Ant\">\r\n          <\/div>\r\n          <span class=\"fr-s06-status-right\">5G  77%<\/span>\r\n        <\/div>\r\n\r\n        <!-- STATE 1: KNOWLEDGE HUB LIST -->\r\n        <div class=\"fr-s06-state fr-s06-hub active\" id=\"frS06Hub\">\r\n\r\n          <div class=\"fr-s06-hub-header\">\r\n            <p class=\"fr-s06-hub-title\">\u77e5\u8bc6\u4e2d\u5fc3<\/p>\r\n            <p class=\"fr-s06-hub-sub\">Learn to identify, report & protect<\/p>\r\n          <\/div>\r\n\r\n          <!-- Category Chips -->\r\n          <div class=\"fr-s06-chips\">\r\n            <div class=\"fr-s06-chip active\">All<\/div>\r\n            <div class=\"fr-s06-chip\">Identification<\/div>\r\n            <div class=\"fr-s06-chip\">Prevention<\/div>\r\n            <div class=\"fr-s06-chip\">Treatment<\/div>\r\n            <div class=\"fr-s06-chip\">News<\/div>\r\n          <\/div>\r\n\r\n          <!-- Article 1 -->\r\n          <div class=\"fr-s06-article\" id=\"frS06Art1\">\r\n            <img decoding=\"async\" class=\"fr-s06-article-img\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Fire Ant ID\">\r\n            <div class=\"fr-s06-article-body\">\r\n              <p class=\"fr-s06-article-cat\">Identification<\/p>\r\n              <p class=\"fr-s06-article-title\">How to Identify Red Imported Fire Ants<\/p>\r\n              <p class=\"fr-s06-article-meta\"><i class=\"fas fa-clock\"><\/i> 4 min read &nbsp;&nbsp;<i class=\"fas fa-star\"><\/i> +20 pts<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <!-- Article 2 -->\r\n          <div class=\"fr-s06-article\" id=\"frS06Art2\">\r\n            <img decoding=\"async\" class=\"fr-s06-article-img\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Treatment\">\r\n            <div class=\"fr-s06-article-body\">\r\n              <p class=\"fr-s06-article-cat\">Treatment<\/p>\r\n              <p class=\"fr-s06-article-title\">IGR Bait Application Guide<\/p>\r\n              <p class=\"fr-s06-article-meta\"><i class=\"fas fa-clock\"><\/i> 6 min read &nbsp;&nbsp;<i class=\"fas fa-star\"><\/i> +30 pts<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n          <!-- Article 3 -->\r\n          <div class=\"fr-s06-article\">\r\n            <img decoding=\"async\" class=\"fr-s06-article-img\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Prevention\">\r\n            <div class=\"fr-s06-article-body\">\r\n              <p class=\"fr-s06-article-cat\">Prevention<\/p>\r\n              <p class=\"fr-s06-article-title\">Protecting Your Property from Fire Ants<\/p>\r\n              <p class=\"fr-s06-article-meta\"><i class=\"fas fa-clock\"><\/i> 5 min read &nbsp;&nbsp;<i class=\"fas fa-star\"><\/i> +25 pts<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n        <!-- STATE 2: ARTICLE DETAIL -->\r\n        <div class=\"fr-s06-state fr-s06-detail\" id=\"frS06Detail\">\r\n\r\n          <div class=\"fr-s06-detail-header\">\r\n            <div class=\"fr-s06-detail-back\" id=\"frS06BackBtn\"><i class=\"fas fa-chevron-left\"><\/i><\/div>\r\n            <p class=\"fr-s06-detail-label\">\u77e5\u8bc6\u4e2d\u5fc3<\/p>\r\n          <\/div>\r\n\r\n          <img decoding=\"async\" class=\"fr-s06-detail-hero\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Fire Ant\">\r\n\r\n          <p class=\"fr-s06-detail-cat\">Identification<\/p>\r\n          <p class=\"fr-s06-detail-title\">How to Identify Red Imported Fire Ants<\/p>\r\n          <p class=\"fr-s06-detail-date\"><i class=\"fas fa-calendar-alt\" style=\"margin-right:4px;\"><\/i> Jun 28, 2026 &nbsp;\u00b7&nbsp; 4 min read<\/p>\r\n\r\n          <p class=\"fr-s06-detail-text\">\r\n            <strong>\u706b\u8681<\/strong> (Red Imported Fire Ants) can be distinguished from native species by several key features. RIFA workers range from 2\u20136mm in length and vary in size within the same colony \u2014 a hallmark of polymorphic species.\r\n          <\/p>\r\n\r\n          <p class=\"fr-s06-detail-text\" style=\"margin-bottom:12px;\">\r\n            <strong>Key identification markers:<\/strong>\r\n          <\/p>\r\n\r\n          <ul class=\"fr-s06-tips\">\r\n            <li><i class=\"fas fa-check-circle\"><\/i> Copper-brown head and darker abdomen<\/li>\r\n            <li><i class=\"fas fa-check-circle\"><\/i> Multiple worker sizes (2\u20136mm) in one nest<\/li>\r\n            <li><i class=\"fas fa-check-circle\"><\/i> Dome-shaped mound with no visible entry hole<\/li>\r\n            <li><i class=\"fas fa-check-circle\"><\/i> Aggressive swarming when nest is disturbed<\/li>\r\n            <li><i class=\"fas fa-check-circle\"><\/i> Painful sting producing white pustule after 24hrs<\/li>\r\n          <\/ul>\r\n\r\n          <p class=\"fr-s06-detail-text\">\r\n            If you suspect RIFA, do not disturb the nest. Use the Fire Rant camera to scan and report immediately.\r\n          <\/p>\r\n\r\n          <!-- Related -->\r\n          <p class=\"fr-s06-related-title\">Related Articles<\/p>\r\n          <div class=\"fr-s06-related-row\">\r\n            <div class=\"fr-s06-related-card\">\r\n              <img decoding=\"async\" class=\"fr-s06-related-img\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Related\">\r\n              <p class=\"fr-s06-related-name\">IGR Bait Guide<\/p>\r\n            <\/div>\r\n            <div class=\"fr-s06-related-card\">\r\n              <img decoding=\"async\" class=\"fr-s06-related-img\" src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/ChatGPT-Image-Jun-24-2026-10_16_08-PM.webp\" alt=\"Related\">\r\n              <p class=\"fr-s06-related-name\">Property Protection<\/p>\r\n            <\/div>\r\n          <\/div>\r\n\r\n        <\/div>\r\n\r\n        <!-- Bottom Nav -->\r\n        <div class=\"fr-s06-nav\">\r\n          <div class=\"fr-s06-nav-camera\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M7 7h2l1.5-2h3L15 7h2a3 3 0 0 1 3 3v7a3 3 0 0 1-3 3H7a3 3 0 0 1-3-3v-7a3 3 0 0 1 3-3z\"><\/path>\r\n              <circle cx=\"12\" cy=\"13.5\" r=\"3.2\"><\/circle>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s06-nav-icon n-home\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M3 11.5L12 4l9 7.5\"><\/path>\r\n              <path d=\"M5.5 10.5V20h5v-5h3v5h5v-9.5\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s06-nav-icon n-reports\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M8 4h8\"><\/path>\r\n              <path d=\"M9 4a3 3 0 0 0 6 0\"><\/path>\r\n              <rect x=\"5\" y=\"5\" width=\"14\" height=\"16\" rx=\"2\"><\/rect>\r\n              <path d=\"M8 11h8\"><\/path>\r\n              <path d=\"M8 15h8\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s06-nav-icon n-articles\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <path d=\"M4 5.5c2.5 0 5 .4 8 2.2v12c-3-1.8-5.5-2.2-8-2.2z\"><\/path>\r\n              <path d=\"M20 5.5c-2.5 0-5 .4-8 2.2v12c3-1.8 5.5-2.2 8-2.2z\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n          <div class=\"fr-s06-nav-icon n-profile\">\r\n            <svg viewbox=\"0 0 24 24\">\r\n              <circle cx=\"12\" cy=\"8\" r=\"3.5\"><\/circle>\r\n              <path d=\"M5 20c1.2-4 4-6 7-6s5.8 2 7 6\"><\/path>\r\n            <\/svg>\r\n          <\/div>\r\n        <\/div>\r\n\r\n        <!-- Reset -->\r\n        <div class=\"fr-s06-reset\" id=\"frS06Reset\" title=\"Reset\">\r\n          <i class=\"fas fa-redo-alt\"><\/i>\r\n        <\/div>\r\n\r\n      <\/div>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<script>\r\n(function() {\r\n  var hub = document.getElementById('frS06Hub');\r\n  var detail = document.getElementById('frS06Detail');\r\n  var art1 = document.getElementById('frS06Art1');\r\n  var art2 = document.getElementById('frS06Art2');\r\n  var backBtn = document.getElementById('frS06BackBtn');\r\n  var resetBtn = document.getElementById('frS06Reset');\r\n\r\n  function hideAll() {\r\n    hub.classList.remove('active');\r\n    detail.classList.remove('active');\r\n  }\r\n\r\n  function showState(el) {\r\n    hideAll();\r\n    el.classList.add('active');\r\n  }\r\n\r\n  art1.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(detail);\r\n  });\r\n\r\n  art2.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(detail);\r\n  });\r\n\r\n  backBtn.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(hub);\r\n  });\r\n\r\n  resetBtn.addEventListener('click', function(e) {\r\n    e.stopPropagation();\r\n    showState(hub);\r\n  });\r\n})();\r\n<\/script>\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<div class=\"elementor-element elementor-element-33ad00e elementor-widget elementor-widget-html\" data-id=\"33ad00e\" data-element_type=\"widget\" data-e-type=\"widget\" data-widget_type=\"html.default\">\n\t\t\t\t\t\r\n<!-- ============================================\r\nFIRE RANT \u2014 WEBSITE BOTTOM NAV BAR\r\nDesktop: FA-bottom-nav-Desktop-version-1-scaled.png (bottom: 38px \u2014 working)\r\nMobile: Nav-Menu-Bar-scaled.webp (bottom: 70px + red fill)\r\nFIX: JS moves nav to body so it escapes Elementor containers\r\nPaste into Elementor HTML widget\r\n============================================ -->\r\n\r\n<link rel=\"stylesheet\" href=\"https:\/\/cdnjs.cloudflare.com\/ajax\/libs\/font-awesome\/5.15.4\/css\/all.min.css\">\r\n\r\n<style>\r\n\/* Force out of any Elementor container *\/\r\n.elementor-widget-container .fr-web-nav,\r\nbody > .fr-web-nav,\r\n.fr-web-nav {\r\n  font-family: Inter, -apple-system, BlinkMacSystemFont, \"Segoe UI\", sans-serif;\r\n  position: fixed !important;\r\n  bottom: 0 !important;\r\n  left: 0 !important;\r\n  right: 0 !important;\r\n  z-index: 999999 !important;\r\n  pointer-events: none;\r\n  transform: none !important;\r\n  will-change: auto !important;\r\n}\r\n\r\n.fr-web-nav-container {\r\n  position: relative;\r\n  width: 100%;\r\n  max-width: 1920px;\r\n  margin: 0 auto;\r\n  pointer-events: none;\r\n}\r\n\r\n\/* Red fill underneath the nav image (for mobile transparency) *\/\r\n.fr-web-nav-redfill {\r\n  position: absolute;\r\n  bottom: 0;\r\n  left: 0;\r\n  right: 0;\r\n  height: 0;\r\n  background: #ff3b3b;\r\n  z-index: 1;\r\n  pointer-events: all;\r\n}\r\n\r\n\/* Nav images *\/\r\n.fr-web-nav-img {\r\n  width: 100%;\r\n  height: auto;\r\n  display: block;\r\n  pointer-events: all;\r\n  position: relative;\r\n  z-index: 5;\r\n}\r\n\r\n.fr-web-nav-img-desktop {\r\n  display: block;\r\n}\r\n\r\n.fr-web-nav-img-mobile {\r\n  display: none;\r\n}\r\n\r\n\/* Centre red dot with white home icon \u2014 DESKTOP *\/\r\n.fr-web-nav-home {\r\n  position: absolute;\r\n  left: 50%;\r\n  bottom: 38px;\r\n  transform: translateX(-50%);\r\n  width: 58px;\r\n  height: 58px;\r\n  background: #ff3b3b;\r\n  border-radius: 50%;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  box-shadow: 0 4px 20px rgba(255,59,59,0.35);\r\n  z-index: 20;\r\n  text-decoration: none;\r\n  color: #fff;\r\n  font-size: 22px;\r\n  transition: transform 0.2s, box-shadow 0.2s;\r\n  pointer-events: all;\r\n}\r\n\r\n.fr-web-nav-home:hover {\r\n  transform: translateX(-50%) scale(1.08);\r\n  box-shadow: 0 6px 28px rgba(255,59,59,0.5);\r\n}\r\n\r\n\/* Nav links overlaid *\/\r\n.fr-web-nav-links {\r\n  position: absolute;\r\n  bottom: 12px;\r\n  left: 0;\r\n  right: 0;\r\n  display: flex;\r\n  align-items: center;\r\n  justify-content: center;\r\n  gap: 0;\r\n  z-index: 15;\r\n  pointer-events: all;\r\n}\r\n\r\n.fr-web-nav-link {\r\n  display: flex;\r\n  flex-direction: column;\r\n  align-items: center;\r\n  gap: 3px;\r\n  text-decoration: none;\r\n  color: #fff;\r\n  font-size: 9px;\r\n  font-weight: 700;\r\n  text-transform: uppercase;\r\n  letter-spacing: 0.5px;\r\n  opacity: 0.9;\r\n  transition: opacity 0.2s, transform 0.2s;\r\n  width: 70px;\r\n}\r\n\r\n.fr-web-nav-link:hover {\r\n  opacity: 1;\r\n  transform: translateY(-2px);\r\n}\r\n\r\n.fr-web-nav-link i {\r\n  font-size: 18px;\r\n}\r\n\r\n\/* Spacer for centre button *\/\r\n.fr-web-nav-link-spacer {\r\n  width: 100px;\r\n}\r\n\r\n\/* Page spacer *\/\r\n.fr-web-nav-page-spacer {\r\n  height: 80px;\r\n}\r\n\r\n\/* MOBILE *\/\r\n@media (max-width: 768px) {\r\n  .fr-web-nav-img-desktop {\r\n    display: none;\r\n  }\r\n\r\n  .fr-web-nav-img-mobile {\r\n    display: block;\r\n  }\r\n\r\n  .fr-web-nav-redfill {\r\n    height: 40px;\r\n  }\r\n\r\n  .fr-web-nav-home {\r\n    width: 50px;\r\n    height: 50px;\r\n    font-size: 18px;\r\n    bottom: 70px;\r\n  }\r\n\r\n  .fr-web-nav-links {\r\n    bottom: 8px;\r\n  }\r\n\r\n  .fr-web-nav-link {\r\n    width: 55px;\r\n    font-size: 8px;\r\n  }\r\n\r\n  .fr-web-nav-link i {\r\n    font-size: 15px;\r\n  }\r\n\r\n  .fr-web-nav-link-spacer {\r\n    width: 65px;\r\n  }\r\n\r\n  .fr-web-nav-page-spacer {\r\n    height: 70px;\r\n  }\r\n}\r\n<\/style>\r\n\r\n<!-- Page spacer so content isn't hidden -->\r\n<div class=\"fr-web-nav-page-spacer\"><\/div>\r\n\r\n<!-- Fixed Bottom Nav -->\r\n<div class=\"fr-web-nav\" id=\"frWebNavBar\">\r\n  <div class=\"fr-web-nav-container\">\r\n\r\n    <!-- Red fill underneath transparent areas (mobile only) -->\r\n    <div class=\"fr-web-nav-redfill\"><\/div>\r\n\r\n    <!-- Desktop nav image -->\r\n    <img decoding=\"async\" \r\n      src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/FA-bottom-nav-Desktop-version-1-scaled.png\" \r\n      alt=\"Navigation\" \r\n      class=\"fr-web-nav-img fr-web-nav-img-desktop\"\r\n    >\r\n\r\n    <!-- Mobile nav image -->\r\n    <img decoding=\"async\" \r\n      src=\"https:\/\/firerant.com.au\/wp-content\/uploads\/2026\/06\/Nav-Menu-Bar-scaled.webp\" \r\n      alt=\"Navigation\" \r\n      class=\"fr-web-nav-img fr-web-nav-img-mobile\"\r\n    >\r\n\r\n    <!-- Centre red dot with white home icon -->\r\n    <a href=\"https:\/\/firerant.com.au\/zh\/\" class=\"fr-web-nav-home\">\r\n      <i class=\"fas fa-home\"><\/i>\r\n    <\/a>\r\n\r\n    <!-- Clickable nav links -->\r\n    <div class=\"fr-web-nav-links\">\r\n      <a href=\"https:\/\/firerant.com.au\/zh\/?page_id=573\" class=\"fr-web-nav-link\">\r\n        <i class=\"fas fa-map-marker-alt\"><\/i>\r\n        <span>\u5730\u56fe<\/span>\r\n      <\/a>\r\n      <a href=\"https:\/\/firerant.com.au\/zh\/?page_id=571\" class=\"fr-web-nav-link\">\r\n        <i class=\"fas fa-mobile-alt\"><\/i>\r\n        <span>\u5e94\u7528<\/span>\r\n      <\/a>\r\n\r\n      <!-- Spacer for centre button -->\r\n      <span class=\"fr-web-nav-link-spacer\"><\/span>\r\n\r\n      <a href=\"https:\/\/firerant.com.au\/zh\/?page_id=575\" class=\"fr-web-nav-link\">\r\n        <i class=\"fas fa-shopping-cart\"><\/i>\r\n        <span>\u5546\u5e97<\/span>\r\n      <\/a>\r\n      <a href=\"https:\/\/firerant.com.au\/zh\/?page_id=392\" class=\"fr-web-nav-link\">\r\n        <i class=\"fas fa-info-circle\"><\/i>\r\n        <span>\u5173\u4e8e<\/span>\r\n      <\/a>\r\n    <\/div>\r\n\r\n  <\/div>\r\n<\/div>\r\n\r\n<!-- FIX: Move nav to <body> to escape Elementor containers -->\r\n<script>\r\n(function() {\r\n  function moveNav() {\r\n    var nav = document.getElementById('frWebNavBar');\r\n    if (nav && nav.parentElement !== document.body) {\r\n      document.body.appendChild(nav);\r\n    }\r\n    \/\/ Also kill any transform\/filter on parent chain that breaks position:fixed\r\n    var el = nav;\r\n    while (el && el !== document.body) {\r\n      el = el.parentElement;\r\n      if (el && el !== document.body) {\r\n        var style = window.getComputedStyle(el);\r\n        if (style.transform !== 'none' || style.filter !== 'none' || style.willChange === 'transform') {\r\n          el.style.transform = 'none';\r\n          el.style.filter = 'none';\r\n          el.style.willChange = 'auto';\r\n        }\r\n      }\r\n    }\r\n  }\r\n  if (document.readyState === 'loading') {\r\n    document.addEventListener('DOMContentLoaded', moveNav);\r\n  } else {\r\n    moveNav();\r\n  }\r\n  \/\/ Backup: also try after a short delay (for Elementor lazy loading)\r\n  setTimeout(moveNav, 500);\r\n  setTimeout(moveNav, 1500);\r\n})();\r\n<\/script>\r\n\r\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>\n\t\t\t\t<\/div>",
        "protected": false
    },
    "excerpt": {
        "rendered": "<p>Map App About Shop Cart Get the App The App PHOTOGRAPH. IDENTIFY. REPORT. CITIZEN BIOSECURITY IN YOUR POCKET. AI-POWERED. GEO-TAGGED. GAMIFIED. Fire Rant turns every smartphone into a surveillance tool \u2014 real-time nest identification, evidence-grade reporting, and community-driven engagement in a single platform. Download for iOS Explore Features 85%+ AI confidence score Computer vision model [&hellip;]<\/p>",
        "protected": false
    },
    "author": 1,
    "featured_media": 0,
    "parent": 0,
    "menu_order": 0,
    "comment_status": "closed",
    "ping_status": "closed",
    "template": "",
    "meta": {
        "_angie_page": false,
        "footnotes": ""
    },
    "class_list": [
        "post-571",
        "page",
        "type-page",
        "status-publish",
        "hentry"
    ],
    "_links": {
        "self": [
            {
                "href": "https:\/\/firerant.com.au\/zh\/index.php?rest_route=\/wp\/v2\/pages\/571",
                "targetHints": {
                    "allow": [
                        "GET"
                    ]
                }
            }
        ],
        "collection": [
            {
                "href": "https:\/\/firerant.com.au\/zh\/index.php?rest_route=\/wp\/v2\/pages"
            }
        ],
        "about": [
            {
                "href": "https:\/\/firerant.com.au\/zh\/index.php?rest_route=\/wp\/v2\/types\/page"
            }
        ],
        "author": [
            {
                "embeddable": true,
                "href": "https:\/\/firerant.com.au\/zh\/index.php?rest_route=\/wp\/v2\/users\/1"
            }
        ],
        "replies": [
            {
                "embeddable": true,
                "href": "https:\/\/firerant.com.au\/zh\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=571"
            }
        ],
        "version-history": [
            {
                "count": 5,
                "href": "https:\/\/firerant.com.au\/zh\/index.php?rest_route=\/wp\/v2\/pages\/571\/revisions"
            }
        ],
        "predecessor-version": [
            {
                "id": 1343,
                "href": "https:\/\/firerant.com.au\/zh\/index.php?rest_route=\/wp\/v2\/pages\/571\/revisions\/1343"
            }
        ],
        "wp:attachment": [
            {
                "href": "https:\/\/firerant.com.au\/zh\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=571"
            }
        ],
        "curies": [
            {
                "name": "wp",
                "href": "https:\/\/api.w.org\/{rel}",
                "templated": true
            }
        ]
    }
}