NXT IP – Custom dApp Creations

<!DOCTYPE html>
<html lang="en">
<head>
  <meta charset="UTF-8">
  <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no">
  <title>IP Rights Academy</title>
  <style>
    /* ================================================================
       HIDE WORDPRESS CHROME (site title, logo, menu)
       ================================================================ */
    #masthead,
    .site-header,
    .site-branding,
    .site-title,
    .site-description,
    .main-navigation,
    .primary-navigation,
    .menu-toggle,
    .nav-menu,
    #primary-menu,
    .navigation-main,
    .header-image,
    .custom-logo,
    .site-logo,
    .entry-header,
    .page-header,
    .entry-title,
    .post-navigation,
    .site-footer:not(.nxtwavelabs-footer),
    #colophon {
      display: none !important;
    }

.site-content,
    #primary,
    #main,
    .content-area {
      padding: 0 !important;
      margin: 0 !important;
      max-width: 100% !important;
      width: 100% !important;
    }

/* ================================================================
       ACADEMY STYLES (full app)
       ================================================================ */
    * { box-sizing: border-box; margin: 0; padding: 0; }
    body {
      background: #010101;
      color: #e2e8f0;
      font-family: 'Segoe UI', system-ui, -apple-system, sans-serif;
      padding: 15px;
      min-height: 100vh;
      background-image: radial-gradient(circle at 50% 20%, rgba(73,251,53,0.10) 0%, transparent 60%),
                        linear-gradient(rgba(73,251,53,0.03) 1px, transparent 1px),
                        linear-gradient(90deg, rgba(73,251,53,0.03) 1px, transparent 1px);
      background-size: 100% 100%, 28px 28px, 28px 28px;
    }

#app {
      max-width: 1200px;
      margin: 0 auto;
    }

/* ---------- HEADER ---------- */
    .app-header {
      display: flex;
      justify-content: center;
      padding: 25px;
      background: rgba(1,1,1,0.95);
      backdrop-filter: blur(16px);
      border-radius: 16px;
      margin-bottom: 25px;
      border: 2px solid #49fb35;
      box-shadow: 0 0 40px rgba(73,251,53,0.2), inset 0 0 30px rgba(73,251,53,0.1);
      position: sticky;
      top: 20px;
      z-index: 100;
      animation: glow 4s infinite ease-in-out;
    }
    .app-header h1 {
      margin: 0;
      font-size: 1.8rem;
      text-transform: uppercase;
      text-align: center;
      background: linear-gradient(90deg, #49fb35 0%, #2c2c2c 25%, #49fb35 50%, #2c2c2c 75%, #49fb35 100%);
      background-size: 300% auto;
      -webkit-background-clip: text;
      -webkit-text-fill-color: transparent;
      text-shadow: 0 0 25px rgba(73,251,53,0.6);
      animation: shimmer 4s linear infinite, pulseText 2.5s ease-in-out infinite;
      letter-spacing: 3px;
      font-weight: 700;
    }
    @keyframes glow {
      0%, 100% { box-shadow: 0 0 15px rgba(73,251,53,0.6), inset 0 0 20px rgba(73,251,53,0.15); }
      50% { box-shadow: 0 0 35px rgba(73,251,53,0.6), inset 0 0 40px rgba(73,251,53,0.25); }
    }
    @keyframes shimmer {
      0% { background-position: -200% center; letter-spacing: 2px; }
      50% { letter-spacing: 4px; text-shadow: 0 0 30px rgba(73,251,53,0.6); }
      100% { background-position: 200% center; letter-spacing: 2px; }
    }
    @keyframes pulseText {
      0%, 100% { text-shadow: 0 0 6px #49fb35, 0 0 14px rgba(73,251,53,0.6); }
      50% { text-shadow: 0 0 20px #49fb35, 0 0 40px rgba(73,251,53,0.6); }
    }

/* ---------- LAYOUT ---------- */
    .academy-layout {
      display: flex;
      flex-direction: column;
      gap: 20px;
    }
    @media (min-width: 1024px) {
      .academy-layout {
        flex-direction: row;
        align-items: flex-start;
      }
      .course-sidebar {
        width: 340px;
        flex-shrink: 0;
        position: sticky;
        top: 120px;
      }
      .lesson-viewer {
        flex: 1;
        min-height: 650px;
      }
    }

/* ---------- SIDEBAR ---------- */
    .course-sidebar {
      background: rgba(5,5,5,0.85);
      border: 2px solid rgba(73,251,53,0.3);
      border-radius: 16px;
      padding: 20px;
      backdrop-filter: blur(14px);
    }
    .course-sidebar h3 {
      color: #49fb35;
      margin: 0 0 15px 0;
      font-size: 1.2rem;
      text-transform: uppercase;
      letter-spacing: 2px;
      border-bottom: 1px solid #2a2a2a;
      padding-bottom: 12px;
      display: flex;
      align-items: center;
      gap: 10px;
    }
    .progress-container {
      margin-bottom: 18px;
    }
    .progress-label {
      display: flex;
      justify-content: space-between;
      color: #8ba1c5;
      font-size: 0.8rem;
      margin-bottom: 6px;
    }
    .progress-bar {
      height: 8px;
      background: #1a1a1a;
      border-radius: 4px;
      overflow: hidden;
    }
    .progress-fill {
      height: 100%;
      background: linear-gradient(90deg, #49fb35, #2c2c2c);
      border-radius: 4px;
      transition: width 0.6s ease;
      width: 0%;
    }
    .course-nav-list {
      display: flex;
      flex-direction: column;
      gap: 6px;
      max-height: 400px;
      overflow-y: auto;
    }
    .course-nav-list::-webkit-scrollbar { width: 6px; }
    .course-nav-list::-webkit-scrollbar-track { background: #010101; }
    .course-nav-list::-webkit-scrollbar-thumb { background: #49fb35; border-radius: 4px; }

.course-nav-item {
      display: flex;
      align-items: center;
      gap: 10px;
      padding: 12px 15px;
      background: #0a0a0a;
      border: 1px solid #1a1a1a;
      border-radius: 10px;
      cursor: pointer;
      transition: all 0.3s;
      color: #8ba1c5;
      font-weight: 600;
    }
    .course-nav-item:hover {
      border-color: #49fb35;
      background: rgba(73,251,53,0.05);
      color: #fff;
      transform: translateX(4px);
    }
    .course-nav-item.active {
      border-color: #49fb35;
      background: rgba(73,251,53,0.1);
      color: #49fb35;
      box-shadow: 0 0 15px rgba(73,251,53,0.15);
    }
    .course-nav-item.completed {
      border-left: 3px solid #49fb35;
    }
    .course-nav-item .nav-icon {
      width: 28px;
      height: 28px;
      display: flex;
      align-items: center;
      justify-content: center;
      font-size: 0.9rem;
      border-radius: 50%;
      background: #1a1a1a;
      flex-shrink: 0;
    }
    .course-nav-item.completed .nav-icon {
      background: rgba(73,251,53,0.2);
      color: #49fb35;
    }
    .course-nav-item .nav-info {
      flex: 1;
    }
    .course-nav-item .nav-title {
      font-size: 0.85rem;
    }
    .course-nav-item .nav-sub {
      font-size: 0.7rem;
      color: #6a7a9a;
    }
    .course-nav-item .nav-arrow {
      color: #4a5a7a;
    }

/* ---------- LESSON VIEWER ---------- */
    .lesson-viewer {
      background: rgba(5,5,5,0.85);
      border: 2px solid rgba(73,251,53,0.3);
      border-radius: 16px;
      padding: 28px;
      backdrop-filter: blur(14px);
      animation: fadeScale 0.5s;
      min-height: 500px;
    }
    @keyframes fadeScale {
      from { opacity: 0; transform: scale(0.96); }
      to { opacity: 1; transform: scale(1); }
    }
    .lesson-header {
      border-bottom: 2px solid #2a2a2a;
      padding-bottom: 16px;
      margin-bottom: 24px;
    }
    .lesson-breadcrumb {
      color: #8ba1c5;
      font-size: 0.8rem;
      text-transform: uppercase;
      letter-spacing: 2px;
      margin-bottom: 8px;
    }
    .lesson-title {
      color: #49fb35;
      font-size: 1.6rem;
      font-weight: 700;
      text-transform: uppercase;
      letter-spacing: 2px;
      margin: 0;
      display: flex;
      align-items: center;
      gap: 15px;
      flex-wrap: wrap;
    }
    .completion-badge {
      display: inline-flex;
      align-items: center;
      gap: 6px;
      background: rgba(73,251,53,0.15);
      border: 1px solid #49fb35;
      padding: 4px 14px;
      border-radius: 20px;
      color: #49fb35;
      font-size: 0.75rem;
      font-weight: 700;
      text-transform: uppercase;
      animation: bounce 0.6s;
    }
    @keyframes bounce {
      0% { transform: scale(1); }
      25% { transform: scale(1.3); }
      50% { transform: scale(0.9); }
      75% { transform: scale(1.1); }
      100% { transform: scale(1); }
    }

.lesson-content {
      color: #e2e8f0;
      line-height: 1.9;
      font-size: 1rem;
      animation: slideRight 0.5s;
    }
    @keyframes slideRight {
      from { transform: translateX(30px); opacity: 0; }
      to { transform: translateX(0); opacity: 1; }
    }
    .lesson-content h4 {
      color: #49fb35;
      font-size: 1.2rem;
      margin-top: 25px;
      margin-bottom: 12px;
      border-left: 3px solid #49fb35;
      padding-left: 12px;
    }
    .lesson-content p { margin: 12px 0; }
    .concept-box {
      background: rgba(73,251,53,0.05);
      border: 1px solid rgba(73,251,53,0.2);
      border-radius: 10px;
      padding: 18px;
      margin: 18px 0;
    }
    .concept-box h5 {
      color: #49fb35;
      margin: 0 0 8px 0;
      font-size: 1rem;
    }
    .example-box {
      background: rgba(251,191,36,0.05);
      border: 1px solid rgba(251,191,36,0.3);
      border-radius: 10px;
      padding: 18px;
      margin: 18px 0;
    }
    .example-box h5 {
      color: #fbbf24;
      margin: 0 0 8px 0;
      font-size: 1rem;
    }
    .warning-box {
      background: rgba(255,0,60,0.05);
      border: 1px solid rgba(255,0,60,0.3);
      border-radius: 10px;
      padding: 18px;
      margin: 18px 0;
    }
    .warning-box h5 {
      color: #ff003c;
      margin: 0 0 8px 0;
      font-size: 1rem;
    }

/* ---------- QUIZ ---------- */
    .quiz-container {
      background: #0a0a0a;
      border: 1px solid #2a2a2a;
      border-radius: 10px;
      padding: 20px;
      margin: 20px 0;
    }
    .quiz-question {
      color: #fbbf24;
      font-weight: 700;
      margin-bottom: 15px;
      font-size: 1.05rem;
    }
    .quiz-option {
      display: block;
      padding: 10px 15px;
      margin: 8px 0;
      background: #1a1a1a;
      border: 1px solid #2a2a2a;
      border-radius: 8px;
      cursor: pointer;
      transition: all 0.2s;
      color: #e2e8f0;
    }
    .quiz-option:hover {
      border-color: #49fb35;
      background: rgba(73,251,53,0.05);
    }
    .quiz-option.selected { border-color: #49fb35; background: rgba(73,251,53,0.15); color: #49fb35; }
    .quiz-option.correct { border-color: #49fb35; background: rgba(73,251,53,0.2); color: #49fb35; }
    .quiz-option.incorrect { border-color: #ff003c; background: rgba(255,0,60,0.1); color: #ff003c; }
    .quiz-feedback {
      margin-top: 12px;
      padding: 12px;
      border-radius: 8px;
      font-weight: 600;
    }
    .quiz-feedback.correct { background: rgba(73,251,53,0.1); color: #49fb35; }
    .quiz-feedback.incorrect { background: rgba(255,0,60,0.1); color: #ff003c; }

/* ---------- FOOTER BUTTONS ---------- */
    .lesson-footer {
      display: flex;
      justify-content: space-between;
      align-items: center;
      margin-top: 30px;
      padding-top: 20px;
      border-top: 1px solid #2a2a2a;
      gap: 12px;
      flex-wrap: wrap;
    }
    .lesson-btn {
      padding: 14px 28px;
      border-radius: 10px;
      font-weight: 700;
      cursor: pointer;
      text-transform: uppercase;
      font-size: 0.9rem;
      letter-spacing: 2px;
      transition: all 0.3s;
      border: none;
      font-family: inherit;
      background: #1a1a1a;
      color: #8ba1c5;
      border: 1px solid #2a2a2a;
    }
    .lesson-btn:hover:not(:disabled) {
      border-color: #49fb35;
      color: #fff;
    }
    .lesson-btn:disabled {
      opacity: 0.3;
      cursor: not-allowed;
    }
    .lesson-btn.next {
      background: linear-gradient(45deg, #49fb35, #2c2c2c);
      color: #010101;
      border: none;
    }
    .lesson-btn.next:hover:not(:disabled) {
      box-shadow: 0 0 25px rgba(73,251,53,0.6);
    }
    .lesson-btn.complete {
      background: #49fb35;
      color: #010101;
      border: none;
      animation: pulse 1.5s infinite;
    }
    .lesson-btn.complete:hover {
      box-shadow: 0 0 30px rgba(73,251,53,0.8);
    }
    @keyframes pulse {
      0%, 100% { transform: scale(1); }
      50% { transform: scale(1.05); }
    }

/* ---------- TOAST ---------- */
    .toast-container {
      position: fixed;
      top: 20px;
      left: 50%;
      transform: translateX(-50%);
      z-index: 10000;
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 8px;
      width: 90%;
      max-width: 500px;
      pointer-events: none;
    }
    .toast {
      background: rgba(10,16,30,0.97);
      backdrop-filter: blur(12px);
      border: 2px solid #49fb35;
      border-radius: 12px;
      padding: 14px 24px;
      color: #e2e8f0;
      font-weight: 600;
      text-align: center;
      width: 100%;
      box-shadow: 0 10px 40px rgba(1,1,1,0.9);
      animation: slideDown 0.3s cubic-bezier(0.23,1,0.32,1);
      display: flex;
      align-items: center;
      justify-content: center;
      gap: 12px;
      pointer-events: auto;
    }
    .toast.success { border-color: #49fb35; background: rgba(5,20,5,0.97); }
    .toast.warning { border-color: #fbbf24; background: rgba(35,25,10,0.97); }
    .toast.fade-out { animation: fadeOut 0.5s forwards; }
    @keyframes slideDown {
      from { transform: translateY(-40px); opacity: 0; }
      to { transform: translateY(0); opacity: 1; }
    }
    @keyframes fadeOut {
      from { opacity: 1; }
      to { opacity: 0; }
    }

/* ---------- FOOTER ---------- */
    .nxtwavelabs-footer {
      padding: 32px 20px;
      text-align: center;
      font-size: 0.78rem;
      color: #8ba1c5;
      border-top: 2px solid #2a2a2a;
      margin-top: 45px;
      text-transform: uppercase;
      letter-spacing: 2.5px;
      cursor: pointer;
      transition: color 0.3s;
    }
    .nxtwavelabs-footer:hover { color: #49fb35; }

/* ---------- MODAL ---------- */
    .powered-modal {
      position: fixed;
      inset: 0;
      background: rgba(1,1,1,0.92);
      display: none;
      align-items: center;
      justify-content: center;
      z-index: 10001;
      backdrop-filter: blur(10px);
    }
    .powered-modal.show { display: flex; }
    .powered-modal-content {
      background: #080808;
      border: 3px solid #49fb35;
      border-radius: 18px;
      width: 92%;
      max-width: 620px;
      max-height: 88vh;
      overflow-y: auto;
      box-shadow: 0 0 60px rgba(73,251,53,0.35);
      padding: 0;
    }
    .powered-header {
      padding: 24px 28px;
      border-bottom: 2px solid #2a2a2a;
      display: flex;
      justify-content: space-between;
      align-items: center;
    }
    .powered-header h3 {
      color: #49fb35;
      font-size: 1.35rem;
      font-weight: 800;
      letter-spacing: 2px;
      margin: 0;
    }
    .powered-close {
      font-size: 2rem;
      color: #8ba1c5;
      cursor: pointer;
      transition: color 0.2s;
      line-height: 1;
    }
    .powered-close:hover { color: #ff003c; }
    .powered-body { padding: 28px; }
    .powered-section {
      background: #1a1a1a;
      border: 1px solid #2a2a2a;
      border-radius: 12px;
      padding: 20px;
      margin-bottom: 18px;
    }
    .powered-section h4 {
      color: #49fb35;
      font-size: 1.05rem;
      font-weight: 700;
      letter-spacing: 1.5px;
      margin-bottom: 10px;
      display: flex;
      align-items: center;
      gap: 8px;
    }
    .powered-section p {
      color: #8ba1c5;
      font-size: 0.92rem;
      line-height: 1.6;
      margin: 0;
    }
    .powered-footer {
      padding: 18px 28px;
      background: #010101;
      border-top: 1px solid #2a2a2a;
      text-align: center;
      font-size: 0.75rem;
      color: #49fb35;
      font-family: monospace;
    }
  </style>
</head>
<body data-rsssl=1>

<div id="app">
    <header class="app-header"><h1>IP RIGHTS ACADEMY</h1></header>

<div class="academy-layout">
      <aside class="course-sidebar" id="sidebar">
        <h3>🎓 COURSES</h3>
        <div class="progress-container">
          <div class="progress-label"><span>Overall Progress</span><span id="progressPercent">0%</span></div>
          <div class="progress-bar"><div class="progress-fill" id="progressFill"></div></div>
        </div>
        <div class="course-nav-list" id="navList"></div>
      </aside>

<div class="nxtwavelabs-footer" id="footerBtn">© 2026 NXT WAVE LABS • CREATED BY WILLIAM SIMMONS</div>
  </div>

<div class="toast-container" id="toastContainer"></div>

<div class="powered-modal" id="poweredModal">
    <div class="powered-modal-content">
      <div class="powered-header">
        <h3>⚡ SYSTEM ARCHITECTURE</h3>
        <span class="powered-close" id="modalClose">✕</span>
      </div>
      <div class="powered-body">
        <div class="powered-section"><h4>🎮 THE ENTITY</h4><p>NXT Wave represents the convergence of high‑frequency trading infrastructure and decentralized social consensus.</p></div>
        <div class="powered-section"><h4>⌨ THE CREATOR</h4><p>Architected and deployed by <span style="color:#49fb35;font-weight:700;">William Simmons</span>.</p></div>
        <div class="powered-section"><h4>🌐 THE IP RIGHTS</h4><p>Created exclusively for <span style="color:#49fb35;font-weight:700;">NXT Wave Labs</span>.</p></div>
      </div>
      <div class="powered-footer">NXT WAVE LABS SOVEREIGN CREATOR SUITE</div>
    </div>
  </div>

<script>
    (function() {
      "use strict";

// ===== NUCLEAR DOM OVERRIDE =====
      // Moves the app container to the body to escape WordPress wrappers.
      function applyNuclearOverride() {
        var app = document.getElementById('app');
        if (app && app.parentNode !== document.body) {
          document.body.appendChild(app);
        }
        // Move toast container if it exists and is not already in body
        var toast = document.getElementById('toastContainer');
        if (toast && toast.parentNode !== document.body) {
          document.body.appendChild(toast);
        }
        // Move modal if it exists and is not already in body
        var modal = document.getElementById('poweredModal');
        if (modal && modal.parentNode !== document.body) {
          document.body.appendChild(modal);
        }
        // Hide any leftover WordPress elements
        var wpSelectors = [
          '#masthead', '.site-header', '.site-branding', '.site-title',
          '.site-description', '.main-navigation', '.primary-navigation',
          '.menu-toggle', '.nav-menu', '#primary-menu', '.navigation-main',
          '.header-image', '.custom-logo', '.site-logo', '.entry-header',
          '.page-header', '.entry-title', '.post-navigation',
          '.site-footer:not(.nxtwavelabs-footer)', '#colophon'
        ];
        wpSelectors.forEach(function(sel) {
          var els = document.querySelectorAll(sel);
          for (var i = 0; i < els.length; i++) {
            els[i].style.display = 'none';
          }
        });
      }

// ===== DATA =====
      var courses = [
        { id: 'intro', title: 'Course 1: What is Intellectual Property?', icon: '💡', lessons: [
          { id: 'intro-1', title: '1.1: Welcome to IP - The Big Idea', content: '<p>Imagine you draw a picture of a dragon. You spent hours on it. You used your own crayons, your own paper, and your own imagination. The drawing is yours because <strong>you made it</strong>.</p><div class="concept-box"><h5>💡 THE BIG IDEA</h5><p>Intellectual Property (or "IP") is the rule that says: <strong>"If you create something with your mind, it belongs to you."</strong></p></div><p>IP is everywhere: cereal logos, songs, apps, cartoons.</p>', quiz: null },
          { id: 'intro-2', title: '1.2: The Two Main Flavors of IP', content: '<p>IP comes in two buckets:</p><h4>Bucket 1: Registered IP</h4><p>Patents, trademarks, registered designs – you tell the government.</p><h4>Bucket 2: Unregistered IP</h4><p>Copyright, trade secrets, unregistered design rights – automatic.</p><div class="example-box"><h5>🍎 REAL WORLD EXAMPLE</h5><p>Apple uses all types: trademark (logo), patent (iPhone tech), copyright (iOS code), trade secret (glass formula), design (product shape).</p></div>', quiz: { question: 'Which type of IP do you get AUTOMATICALLY without filling out any forms?', options: ['Patent', 'Trademark', 'Copyright', 'Registered Design'], correct: 2, explanation: 'Copyright is automatic the moment you create something original.' } },
          { id: 'intro-3', title: '1.3: Why Does IP Matter to YOU?', content: '<p>Everything you interact with daily is IP-protected. Without IP, anyone could copy your creations and give you nothing.</p>', quiz: { question: 'What is the main purpose of IP protection?', options: ['To make lawyers rich', 'To stop others from copying and profiting from your creations', 'To make everything free', 'To make products expensive'], correct: 1, explanation: 'IP protection lets creators control and profit from their work.' } }
        ] },
        { id: 'copyright', title: 'Course 2: Copyright Deep Dive', icon: '©', lessons: [
          { id: 'copyright-1', title: '2.1: What Exactly is Copyright?', content: '<p>Copyright is the right to control copies. It protects creative works (books, music, software) but NOT ideas.</p><div class="example-box"><h5>💡 IDEA vs. EXPRESSION</h5><p>Idea: boy wizard school. Expression: Harry Potter books.</p></div>', quiz: null },
          { id: 'copyright-2', title: '2.2: How Do You Get Copyright? (It\'s Automatic!)', content: '<p>Copyright is free and automatic upon creation and fixation (writing, recording, saving). No registration needed.</p>', quiz: { question: 'When does copyright protection begin?', options: ['When you register', 'When you add ©', 'The moment you create and fix the work', 'After 30 days'], correct: 2, explanation: 'Copyright is automatic upon creation and fixation.' } },
          { id: 'copyright-3', title: '2.3: What Rights Does Copyright Give You?', content: '<p>Bundle of rights: reproduce, distribute, derivative works, public performance, display, digital transmission. You can license each separately.</p>', quiz: null },
          { id: 'copyright-4', title: '2.4: How Long Does Copyright Last?', content: '<p>Life of creator + 70 years. Then public domain.</p>', quiz: { question: 'What happens after copyright expires?', options: ['Destroyed', 'More expensive', 'Enters public domain', 'Automatically renews'], correct: 2, explanation: 'Works enter the public domain and can be used freely.' } },
          { id: 'copyright-5', title: '2.5: Copyright and NFTs', content: '<p>Buying an NFT ≠ buying copyright. You only own the token unless rights are explicitly granted.</p>', quiz: { question: 'What does an NFT buyer automatically get?', options: ['Full copyright', 'Right to make merchandise', 'Ownership of the blockchain token', 'Derivative work rights'], correct: 2, explanation: 'Buying an NFT only gives ownership of the token.' } }
        ] },
        { id: 'trademark', title: 'Course 3: Trademarks Explained', icon: '™', lessons: [
          { id: 'trademark-1', title: '3.1: What is a Trademark?', content: '<p>A sign (word, logo, slogan, sound) that identifies source and prevents confusion.</p>', quiz: null },
          { id: 'trademark-2', title: '3.2: How to Get a Trademark', content: '<p>Unregistered (™) gives local protection; registered (®) gives nationwide protection and legal presumption. Search database first!</p>', quiz: { question: 'Main advantage of a registered trademark?', options: ['Lasts forever', 'Nationwide protection and legal presumption', 'Free', 'Prevents all mentions'], correct: 1, explanation: 'Registration provides nationwide protection and easier enforcement.' } },
          { id: 'trademark-3', title: '3.3: Trademarks and NFTs', content: '<p>Trademark your NFT project name/logo to prevent copycats. Avoid famous brand names.</p>', quiz: null }
        ] },
        { id: 'patent', title: 'Course 4: Patents for Beginners', icon: '⚗', lessons: [
          { id: 'patent-1', title: '4.1: What is a Patent?', content: '<p>A patent is a 20‑year monopoly on a new, useful, non‑obvious invention in exchange for public disclosure.</p>', quiz: { question: 'What is the patent deal?', options: ['Pay to keep secret', 'Public disclosure for 20‑year monopoly', 'Free use of all inventions', 'Automatic ownership of future versions'], correct: 1, explanation: 'You teach the invention, get a temporary monopoly.' } },
          { id: 'patent-2', title: '4.2: Patents and NFTs/Software', content: '<p>Patents protect technology, not art. Novel blockchain protocols might be patentable.</p>', quiz: null }
        ] },
        { id: 'trade-secret', title: 'Course 5: Trade Secrets', icon: '🕵', lessons: [
          { id: 'secret-1', title: '5.1: What is a Trade Secret?', content: '<p>Confidential business information (Coca‑Cola formula). Protection by keeping it secret; no registration.</p>', quiz: { question: 'Weakness of trade secret protection?', options: ['Expires after 20 years', 'Expensive registration', 'No protection against independent discovery or reverse engineering', 'US only'], correct: 2, explanation: 'Only protects against misappropriation.' } },
          { id: 'secret-2', title: '5.2: Trade Secrets in NFT Projects', content: '<p>Art generation algorithms, rarity formulas – keep secret with NDAs, limited access, confidential marking.</p>', quiz: null }
        ] },
        { id: 'enforcement', title: 'Course 6: Protecting Your IP', icon: '🛡', lessons: [
          { id: 'enforce-1', title: '6.1: What to Do When Someone Steals Your IP', content: '<p>Steps: document, cease & desist, DMCA takedown, platform reporting, lawsuit as last resort.</p>', quiz: null },
          { id: 'enforce-2', title: '6.2: Licensing Your IP to Others', content: '<p>Licensing = renting your IP while keeping ownership. Define who, what, where, how long, how much.</p>', quiz: { question: 'Difference between selling and licensing IP?', options: ['No difference', 'Selling transfers ownership; licensing grants permission while you keep ownership', 'Licensing is always free', 'Selling is temporary'], correct: 1, explanation: 'Selling = you give up ownership; licensing = you keep ownership with conditions.' } },
          { id: 'enforce-3', title: '6.3: Fair Use and IP Exceptions', content: '<p>Fair use (US) allows limited use for criticism, news, education, parody without permission.</p>', quiz: null }
        ] },
        { id: 'international', title: 'Course 7: IP Around the World', icon: '🌍', lessons: [
          { id: 'intl-1', title: '7.1: The Problem of Borders', content: '<p>IP is territorial – a US trademark only works in the US. International treaties help but you must apply in each country.</p>', quiz: { question: 'Does a US trademark protect you worldwide?', options: ['Yes', 'Only in English‑speaking countries', 'No, IP is territorial', 'Yes, for a fee'], correct: 2, explanation: 'IP rights are territorial.' } },
          { id: 'intl-2', title: '7.2: NFTs Across Borders', content: '<p>Blockchain is global but IP law stops at borders. Register in key markets, specify governing law, use DMCA.</p>', quiz: null }
        ] },
        { id: 'final', title: 'Course 8: Final Exam & Certification', icon: '🏆', lessons: [
          { id: 'final-1', title: '8.1: Comprehensive Knowledge Check', content: '<p>Congratulations! You now understand copyright, trademarks, patents, trade secrets, licensing, enforcement, international IP. Protect your creations.</p><p style="text-align:center;color:#49fb35;font-weight:700;font-size:1.2rem;">🎉 YOU HAVE COMPLETED THE IP RIGHTS ACADEMY 🎉</p>', quiz: { question: 'Which IP type requires government registration for strongest protection?', options: ['Copyright', 'Trade Secret', 'Trademark', 'All of the above'], correct: 2, explanation: 'Trademarks get strongest protection through registration.' } }
        ] }
      ];

// ===== STATE =====
      var state = {
        completed: {},
        quizAnswered: {},
        courseIdx: 0,
        lessonIdx: 0
      };

// ===== DOM REFS (after nuclear override) =====
      var viewer, navList, progressFill, progressPercent, toastContainer, modal, modalClose, footerBtn;

function initDomRefs() {
        viewer = document.getElementById('viewer');
        navList = document.getElementById('navList');
        progressFill = document.getElementById('progressFill');
        progressPercent = document.getElementById('progressPercent');
        toastContainer = document.getElementById('toastContainer');
        modal = document.getElementById('poweredModal');
        modalClose = document.getElementById('modalClose');
        footerBtn = document.getElementById('footerBtn');
      }

// ===== HELPERS =====
      function loadState() {
        try {
          var raw = localStorage.getItem('ip_academy_progress');
          if (raw) {
            var parsed = JSON.parse(raw);
            state.completed = parsed.completed || {};
            state.quizAnswered = parsed.quizAnswered || {};
          }
        } catch (_) {}
      }
      function saveState() {
        try {
          localStorage.setItem('ip_academy_progress', JSON.stringify({
            completed: state.completed,
            quizAnswered: state.quizAnswered
          }));
        } catch (_) {}
      }

// ===== TOAST =====
      function showToast(msg, type, dur) {
        type = type || 'info';
        dur = dur || 3000;
        var el = document.createElement('div');
        el.className = 'toast ' + type;
        var icon = type === 'success' ? '✅' : (type === 'warning' ? '⚠️' : 'ℹ️');
        el.innerHTML = '<span>' + icon + '</span><span>' + msg + '</span>';
        if (toastContainer) {
          toastContainer.appendChild(el);
          setTimeout(function() {
            el.classList.add('fade-out');
            setTimeout(function() { el.remove(); }, 500);
          }, dur);
        }
      }

// ===== RENDER FUNCTIONS =====
      function renderNav() {
        if (!navList) return;
        var html = '';
        courses.forEach(function(co, i) {
          var comp = courseCompleted(i);
          var tot = co.lessons.length;
          var active = (i === state.courseIdx) ? ' active' : '';
          var done = (comp === tot && tot > 0) ? ' completed' : '';
          var icon = (comp === tot && tot > 0) ? '✅' : co.icon;
          html += '<div class="course-nav-item' + active + done + '" data-idx="' + i + '">';
          html += '<div class="nav-icon">' + icon + '</div>';
          html += '<div class="nav-info"><div class="nav-title">' + co.title + '</div>';
          html += '<div class="nav-sub">' + comp + '/' + tot + ' lessons complete</div></div>';
          html += '<div class="nav-arrow">▶</div></div>';
        });
        navList.innerHTML = html;
        // click handlers
        var items = navList.querySelectorAll('.course-nav-item');
        items.forEach(function(item) {
          item.addEventListener('click', function() {
            var idx = parseInt(this.getAttribute('data-idx'));
            state.courseIdx = idx;
            state.lessonIdx = 0;
            renderAll();
          });
        });
      }

function renderLesson() {
        if (!viewer) return;
        var co = courses[state.courseIdx];
        if (!co) return;
        var lesson = co.lessons[state.lessonIdx];
        if (!lesson) return;

var done = isLessonDone(lesson.id);
        var total = co.lessons.length;
        var isFirst = (state.lessonIdx === 0);
        var isLast = (state.lessonIdx === total - 1);

// build quiz HTML
        var quizHTML = '';
        if (lesson.quiz) {
          var answered = isQuizDone(lesson.id);
          quizHTML = '<div class="quiz-container" id="quizContainer"><div class="quiz-question">❓ ' + lesson.quiz.question + '</div>';
          lesson.quiz.options.forEach(function(opt, idx) {
            var cls = 'quiz-option';
            if (answered) {
              cls += (idx === lesson.quiz.correct) ? ' correct' : ' incorrect';
            }
            quizHTML += '<div class="' + cls + '" data-optidx="' + idx + '">' + opt + '</div>';
          });
          if (answered) {
            quizHTML += '<div class="quiz-feedback correct">' + lesson.quiz.explanation + '</div>';
          }
          quizHTML += '</div>';
        }

var badge = done ? '<span class="completion-badge">✅ COMPLETED</span>' : '';
        var completeBtn = done ? '' : '<button class="lesson-btn complete" id="completeBtn">✅ MARK COMPLETE</button>';
        var prevBtn = '<button class="lesson-btn prev" ' + (isFirst ? 'disabled' : '') + ' id="prevBtn">◀ PREVIOUS</button>';
        var nextBtn = '<button class="lesson-btn next" ' + (isLast ? 'disabled' : '') + ' id="nextBtn">NEXT ▶</button>';

viewer.innerHTML =
          '<div class="lesson-header">' +
          '  <div class="lesson-breadcrumb">' + co.title + ' • Lesson ' + (state.lessonIdx + 1) + ' of ' + total + '</div>' +
          '  <div class="lesson-title">' + lesson.title + ' ' + badge + '</div>' +
          '</div>' +
          '<div class="lesson-content">' + lesson.content + quizHTML + '</div>' +
          '<div class="lesson-footer">' +
          '  ' + prevBtn +
          '  <div>' + completeBtn + '</div>' +
          '  ' + nextBtn +
          '</div>';

// event listeners (use getElementById because they are fresh)
        var prevEl = document.getElementById('prevBtn');
        var nextEl = document.getElementById('nextBtn');
        var compEl = document.getElementById('completeBtn');
        if (prevEl) {
          prevEl.addEventListener('click', function() {
            if (state.lessonIdx > 0) { state.lessonIdx--; renderAll(); }
          });
        }
        if (nextEl) {
          nextEl.addEventListener('click', function() {
            if (state.lessonIdx < total - 1) { state.lessonIdx++; renderAll(); }
          });
        }
        if (compEl) {
          compEl.addEventListener('click', function() {
            if (isLessonDone(lesson.id)) return;
            if (lesson.quiz && !isQuizDone(lesson.id)) {
              showToast('⚠️ Please answer the quiz first!', 'warning', 3000);
              return;
            }
            markLessonDone(lesson.id);
            showToast('✅ Lesson completed! Great work!', 'success', 3000);
            if (state.lessonIdx < total - 1) {
              state.lessonIdx++;
            }
            renderAll();
          });
        }

// quiz logic
        if (lesson.quiz && !isQuizDone(lesson.id)) {
          var opts = viewer.querySelectorAll('.quiz-option');
          opts.forEach(function(opt) {
            opt.addEventListener('click', function() {
              var idx = parseInt(this.getAttribute('data-optidx'));
              var correct = lesson.quiz.correct;
              // disable all
              opts.forEach(function(o) { o.style.pointerEvents = 'none'; });
              this.classList.add('selected');
              if (idx === correct) {
                this.classList.add('correct');
                markQuizDone(lesson.id);
                showToast('✅ Correct! ' + lesson.quiz.explanation, 'success', 4000);
              } else {
                this.classList.add('incorrect');
                opts[correct].classList.add('correct');
                showToast('⚠️ Not quite. Correct answer highlighted.', 'warning', 3000);
              }
              // show explanation
              var fb = document.createElement('div');
              fb.className = 'quiz-feedback ' + (idx === correct ? 'correct' : 'incorrect');
              fb.innerText = lesson.quiz.explanation;
              var qc = document.getElementById('quizContainer');
              if (qc) qc.appendChild(fb);
              // re-render after a moment to show the correct state
              setTimeout(function() {
                if (isQuizDone(lesson.id)) {
                  renderAll();
                }
              }, 500);
            });
          });
        }
      }

function updateProgress() {
        if (!progressFill || !progressPercent) return;
        var total = totalLessons();
        var done = completedCount();
        var pct = total > 0 ? Math.round((done / total) * 100) : 0;
        progressFill.style.width = pct + '%';
        progressPercent.innerText = pct + '%';
      }

function renderAll() {
        renderNav();
        renderLesson();
        updateProgress();
      }

// ===== MODAL =====
      function openModal() { if (modal) modal.classList.add('show'); }
      function closeModal() { if (modal) modal.classList.remove('show'); }
      if (modalClose) {
        modalClose.addEventListener('click', closeModal);
      }
      if (modal) {
        modal.addEventListener('click', function(e) { if (e.target === modal) closeModal(); });
      }
      if (footerBtn) {
        footerBtn.addEventListener('click', openModal);
      }

// ===== INIT =====
      function init() {
        applyNuclearOverride();
        initDomRefs();
        loadState();
        renderAll();
        // welcome toast
        setTimeout(function() {
          showToast('🚀 Welcome to IP Rights Academy!', 'success', 3500);
        }, 600);
      }

// Run when DOM is ready
      if (document.readyState === 'loading') {
        document.addEventListener('DOMContentLoaded', init);
      } else {
        init();
      }

})();
  </script>
</body>
<script>'undefined'=== typeof _trfq || (window._trfq = []);'undefined'=== typeof _trfd && (window._trfd=[]),_trfd.push({'tccl.baseHost':'secureserver.net'},{'ap':'cpbh-mt'},{'server':'p3plmcpnl498541'},{'dcenter':'p3'},{'cp_id':'6507419'},{'cp_cache':''},{'cp_cl':'8'}) // Monitoring performance to make your website faster. If you want to opt-out, please contact web hosting support.</script><script src='https://img1.wsimg.com/traffic-assets/js/tccl.min.js'></script></html>