technology software

documentation technical

adult content

entertainment media

English

The domain name 'kakao-84n.pages.dev' uses the developer-focused generic top-level domain (.dev); it also runs on subdomain 'kakao-84n'. The second-level label 'pages' is 5 characters long containing two vowels alongside three consonants. Word splitting yields one word: pages. No strong language cues emerged from the frequency lists.

html/04/2c/042c9c2b-7c51-46fd-bec6-80958b6f5950.html.gz

default-src 'none'; style-src 'unsafe-inline'; sandbox

attachment; filename="calming-rain-257596.mp3"

attachment; filename="snowing-on-a-windscreen-cover-148033.mp3"

attachment; filename="030822_leaves-rustling-in-wind-79518.mp3"

require-trusted-types-for 'script'; report-uri https://csp.withgoogle.com/csp/apps-themes

176e894661aa9cdc9a5cba6c720044cbbf7b8bd80d1c9a142a7c24b1b6c50d15

9274bbcec8d96168626c732b5d31c775aa8cfb7eaa0599bec0c175908a2c1ce2

3ed40678f4e0b3c2cc99c7982e2b80f339c055d09467ab4bfca225649eb48e3e

6bf3c5aaee571e819c5cf10951041de98de4c9342a06b4d8e01871276e579f00

6f5aa819d1e9ac1a5067537f8f78d8d0947ee669401875a21616c6fe8090ade1

65fd4f7add23de4e18f54decd26e6452f27e7a1eabafd75a4c9c40b33a947749

7dbf6552ff6cd7b803ba98ce9355904b0e942ce8a05b262ba04198e4efba0673

4a3b1efdac0ce249a7344cac79ebc8e035ee9ff1053ae9ccf2de47cc088853f3

45481d21285babae4b76219d01c8866b47c2b02702a730430c71c9ca775eb553

0f0204368febc1057b456b4ebb712e830becfe8c3114f113b6e0820cb5e1f76a

7f1cd54173e942a96ed5d12c54c5443c206a2c2c0eecadc229d209f09c338630

096173f4ddfe79b396efd33e123910d0bd3df04f8b0ad0cd24e5b493b24472a6

8125e6970bc13355bbe4b7a3d6adb51fae6d1d67fbeab1a3188ecc87ea9f8e10

6021e63fa538c38d39cd1fe4101d29726ad39bfd276fabea5c2fd62e2389289f

viewport

default-src 'none'; style-src 'unsafe-inline'; img-src data:;

Abuse Team

CloudFlare, Inc.

pages.dev

Cloudflare Abuse Contact

MNT-CLOUDFLARE

Cloudflare Technical Contact

CLOUDFLARENET-EU


/* ==========================================================
 🎤 REALTIME AUDIO FRAME ENGINE (LOW LATENCY)
 ========================================================== */
window.LiveAudioEngine = (() => {
  let audioCtx, workletNode, source, stream;
  let onFrame = null;

  async function start(callback) {
    onFrame = callback;

    audioCtx = new (window.AudioContext || window.webkitAudioContext)({
      latencyHint: "interactive"
    });

    stream = await navigator.mediaDevices.getUserMedia({
      audio: {
        echoCancellation: true,
        noiseSuppression: true,
        autoGainControl: true
      }
    });

    await audioCtx.audioWorklet.addModule("pcm-worklet.js");

    source = audioCtx.createMediaStreamSource(stream);
    workletNode = new AudioWorkletNode(audioCtx, "pcm-processor");

    workletNode.port.onmessage = e => {
      if (onFrame) onFrame(e.data);
    };

    source.connect(workletNode);
  }

  function stop() {
    if (stream) stream.getTracks().forEach(t => t.stop());
    if (audioCtx) audioCtx.close();
    stream = audioCtx = workletNode = source = null;
  }

  return { start, stop };
})();



/* ==========================================================
 🧠 LIVE VOICE ENERGY → TEXT SPEED MAPPER
 ========================================================== */
window.LiveVoiceTyper = (() => {
  let active = false;
  let energyAvg = 0;

  function rms(frame) {
    let sum = 0;
    for (let i = 0; i < frame.length; i++) sum += frame[i] * frame[i];
    return Math.sqrt(sum / frame.length);
  }

  function start(onSpeak) {
    active = true;
    energyAvg = 0;

    LiveAudioEngine.start(frame => {
      if (!active) return;

      const energy = rms(frame);
      energyAvg = energyAvg * 0.9 + energy * 0.1;

      // 🔇 Noise gate
      if (energyAvg < 0.015) return;

      // 🔥 Speed multiplier (fast voice = fast text)
      const speed = Math.min(5, Math.max(1, energyAvg * 120));

      onSpeak(speed);
    });
  }

  function stop() {
    active = false;
    LiveAudioEngine.stop();
  }

  return { start, stop };
})();



/*
 * =======================================================
 * MODULAR NARRATIVE ENGINE - SPEECH SERVICE (Final Stable)
 * Works locally + GitHub Pages + HTTPS
 * =======================================================
 */

const NarratorEngine = (function () {
  let voices = [];
  let mediaRecorder = null;
  let audioChunks = [];
  let stream = null;
  let isRecording = false;
  let currentUtterance = null;

  // 🟢 Load voices reliably (cross-browser + GitHub Pages safe)
  async function loadVoices(onComplete) {
    function getVoicesPromise() {
      return new Promise((resolve) => {
        let v = speechSynthesis.getVoices();
        if (v.length) return resolve(v);
        speechSynthesis.onvoiceschanged = () => {
          v = speechSynthesis.getVoices();
          resolve(v);
        };
      });
    }
    voices = await getVoicesPromise();
    if (onComplete) onComplete(voices);
  }

  function getAvailableVoices() {
    return voices;
  }

  function pickVoice(requested, lang = "en") {
  if (!voices || !voices.length) return null;
  if (!requested) requested = "default";

  const req = requested.toLowerCase();

  const maleName = narrVoiceSelect.dataset.maleVoice || "";
  const femaleName = narrVoiceSelect.dataset.femaleVoice || "";

  if (req === "female" && femaleName) {
    return voices.find(v => v.name === femaleName);
  }

  if (req === "male" && maleName) {
    return voices.find(v => v.name === maleName);
  }

  let exact = voices.find(v => v.name.toLowerCase() === req);
  if (exact) return exact;

  let langVoices = voices.filter(v =>
    v.lang && v.lang.toLowerCase().startsWith(lang.toLowerCase())
  );

  if (langVoices.length) return langVoices[0];
  return voices[0];
}


  // 🗣️ Speak Function (with accurate word boundaries + fallback)
  function speak(text, options = {}, onBoundaryWord, onEnd = () => {}) {
    window.speechSynthesis.cancel();
    if (!text) {
      onEnd();
      return;
    }

    const utter = new SpeechSynthesisUtterance(text);
    currentUtterance = utter;

    const voice = pickVoice(options.voiceName, options.lang || "en");
    if (voice) {
      utter.voice = voice;
      utter.lang = voice.lang;
    } else {
      utter.lang = options.lang || "en-US";
    }

    utter.rate = options.rate || 1.0;
    utter.pitch = options.pitch || 1.0;

    switch (options.tone) {
      case "calm":
        utter.rate *= 0.9;
        utter.pitch *= 0.8;
        break;
      case "energetic":
        utter.rate *= 1.2;
        utter.pitch *= 1.2;
        break;
      case "deep":
        utter.pitch *= 0.7;
        break;
      case "friendly":
        utter.pitch *= 1.1;
        break;
      case "formal":
        utter.rate *= 0.95;
        break;
      case "narrative":
        utter.rate *= 0.85;
        utter.pitch *= 0.9;
        break;
      case "whisper":
        utter.volume = 0.4;
        utter.pitch *= 1.3;
        break;
    }

    let boundaryFired = false;
    let _simTimer = null;

    utter.onboundary = (event) => {
      if (!onBoundaryWord) return;
      boundaryFired = true;

      if (event.name === "word" || typeof event.charIndex === "number") {
        const start = event.charIndex;
        const nextSpace = text.indexOf(" ", start);
        const word = text.slice(
          start,
          nextSpace > -1 ? nextSpace : text.length
        ).trim();
        onBoundaryWord(event.charIndex, word);
      }
    };

    // 🩹 Simulated boundary fallback for browsers with no word events
    utter.onstart = () => {
      if (!onBoundaryWord) return;
      boundaryFired = false;

      _simTimer = setTimeout(() => {
        if (!boundaryFired) {
          console.warn(
            "⚠️ No onboundary events detected — using simulated typewriter fallback."
          );
          // realistic simulated fallback (WPM-based)
// base WPM at rate=1.0 (adjustable): typical conversational speech ~150 WPM
const BASE_WPM = 150;
const words = text.split(/\s+/).filter(Boolean);
const totalWords = words.length;

// compute ms per word from WPM and utter.rate, clamp to sane bounds
const msPerWord = Math.round(60000 / (BASE_WPM * (utter.rate || 1.0)));
const MIN_MS = 120;   // don't go faster than ~120ms/word
const MAX_MS = 1200;  // don't go slower than ~1200ms/word
const stepTime = Math.min(MAX_MS, Math.max(MIN_MS, msPerWord));

let progress = 0;
const simTimer = setInterval(() => {
  progress++;
  // call with a safe charIndex so consumers that expect charIndex still work
  const partialWordsCount = Math.min(progress, totalWords);
  const partialText = words.slice(0, partialWordsCount).join(" ");
  const charIndex = partialText.length;
  onBoundaryWord(charIndex, words[partialWordsCount - 1] || { simulated: true });
  if (progress >= totalWords) clearInterval(simTimer);
}, stepTime);
        }
        _simTimer = null;
      }, 500);
    };

    utter.onend = () => {
      if (_simTimer) clearTimeout(_simTimer);
      currentUtterance = null;
      onEnd();
    };

    utter.onerror = (e) => {
      console.error("SpeechSynthesis Error:", e && e.error);
      currentUtterance = null;
      onEnd();
    };

    window.speechSynthesis.speak(utter);
  }

  function stopSpeech() {
    if (currentUtterance) {
      window.speechSynthesis.cancel();
      currentUtterance = null;
    }
  }

  // 🎤 Recorder Logic (secure + error handled)
  // 🎤 Live Recording + Real-time Speech-to-Text
async function startRecording(onTranscribe, onComplete) {
  if (isRecording) return false;

  try {
    stream = await navigator.mediaDevices.getUserMedia({ audio: true });
    mediaRecorder = new MediaRecorder(stream);
    audioChunks = [];

    mediaRecorder.ondataavailable = (e) => audioChunks.push(e.data);
    mediaRecorder.start();
    isRecording = true;
    return true;
  } catch (err) {
    console.error("🎤 Microphone access denied:", err);
    alert("Please allow microphone access.");
    return false;
  }
}

function stopRecording(onComplete) {
  if (!isRecording) return;

  // --- Prepare conversion handler BEFORE stopping recorder ---
  if (mediaRecorder) {
    mediaRecorder.onstop = () => {
      const audioBlob = new Blob(audioChunks, { type: "audio/webm" });
      const reader = new FileReader();
      reader.onloadend = () => {
        const base64data = reader.result;
        isRecording = false;
        if (stream) {
          stream.getTracks().forEach((t) => t.stop());
          stream = null;
        }
        if (onComplete) onComplete(base64data); // ✅ Now fires reliably
      };
      reader.readAsDataURL(audioBlob);
    };
  }

  // --- Stop the recorder safely ---
  if (mediaRecorder && mediaRecorder.state !== "inactive") {
    mediaRecorder.stop();
  }

  isRecording = false;
}

  function playAudio(base64Data, onEnd) {
    const audio = new Audio(base64Data);
    audio.onended = onEnd;
    audio.play();
    return audio;
  }

  return {
    init: loadVoices,
    speak,
    stopSpeech,
    getAvailableVoices,
    startRecording,
    stopRecording,
    playAudio,
    isRecording: () => isRecording,
  };

// 🟢 Initialize Narrator Engine and globally dispatch voices
// 🟢 Initialize Narrator Engine only when unlocked by observer
if (!window.NME_LOCKED) {
  NarratorEngine.init((voices) => {
    window.narratorVoices = voices;
    document.dispatchEvent(
      new CustomEvent("narratorVoicesLoaded", { detail: voices })
    );
  });
} else {
  console.log("🔒 NarratorEngine init deferred until observer trigger.");
  window.NME_DEFERRED_INIT = () => {
    NarratorEngine.init((voices) => {
      window.narratorVoices = voices;
      document.dispatchEvent(
        new CustomEvent("narratorVoicesLoaded", { detail: voices })
      );
    });
  };
}

// ✅ Ensure voice loading works on GitHub Pages (fallback loader)
if (speechSynthesis.onvoiceschanged !== undefined) {
  speechSynthesis.onvoiceschanged = () => {
    if (!window.narratorVoices || !window.narratorVoices.length) {
      const v = speechSynthesis.getVoices();
      window.narratorVoices = v;
      document.dispatchEvent(
        new CustomEvent("narratorVoicesLoaded", { detail: v })
      );
    }
  };
}
})();



/* ==========================================================
 🎧 LIVE VOICE TYPEWRITER SYNC ENGINE — PRODUCTION EDITION
 Fully adaptive, lock-aware, resource-safe
 ========================================================== */
window.LiveSyncEngine = (function () {
  let audioCtx, analyser, dataArray, source, rafId;
  let isAnalyzing = false;
  let onWordTrigger = null;
  let syncMap = [];
  let startTime = 0;
  let currentWord = 0;

  const STATE = {
    lastActive: false,
    lastTriggerTime: 0,
    adaptiveThreshold: 0.03,
    calibrated: false,
    calibrationSamples: [],
  };

  // ------------------------------------------------------
  // 🧠 Start analysing microphone stream for speech bursts
  // ------------------------------------------------------
  function startAnalyser(stream, onTrigger) {
    stopAnalyser(); // reset any old session

    // Respect the global NME_LOCKED flag
    if (window.NME_LOCKED) {
      console.log("🔒 LiveSyncEngine locked — waiting for observer unlock.");
      return { stop: stopAnalyser, getSyncMap: () => [] };
    }

    onWordTrigger = onTrigger;
    audioCtx = new (window.AudioContext || window.webkitAudioContext)();
    source = audioCtx.createMediaStreamSource(stream);
    analyser = audioCtx.createAnalyser();
    analyser.fftSize = 1024;
    dataArray = new Uint8Array(analyser.fftSize);
    source.connect(analyser);

    syncMap = [];
    currentWord = 0;
    startTime = audioCtx.currentTime;
    isAnalyzing = true;
    STATE.lastTriggerTime = 0;
    STATE.lastActive = false;
    STATE.calibrated = false;
    STATE.calibrationSamples = [];
    STATE.adaptiveThreshold = 0.03;

    const SILENCE_MS = 150;     // minimal gap between speech bursts
    const CALIBRATION_MS = 300; // sample ambient noise for first 300 ms
    const MIN_TRIGGER_GAP = 0.08; // 80 ms debounce

    function analyze() {
      if (!isAnalyzing || window.NME_LOCKED) return; // pause while locked
      analyser.getByteTimeDomainData(dataArray);

      // Compute RMS
      let sum = 0;
      for (let i = 0; i < dataArray.length; i++) {
        const v = (dataArray[i] - 128) / 128;
        sum += v * v;
      }
      const rms = Math.sqrt(sum / dataArray.length);

      // Calibration — first few frames
      if (!STATE.calibrated) {
        STATE.calibrationSamples.push(rms);
        const elapsed = (audioCtx.currentTime - startTime) * 1000;
        if (elapsed >= CALIBRATION_MS) {
          const avg = STATE.calibrationSamples.reduce((a,b)=>a+b,0)/STATE.calibrationSamples.length;
          STATE.adaptiveThreshold = Math.max(avg * 2.5, 0.02);
          STATE.calibrated = true;
          console.log(`🎚️ LiveSync calibrated threshold → ${STATE.adaptiveThreshold.toFixed(4)}`);
        }
      }

      const speechActive = rms > STATE.adaptiveThreshold;
      const now = audioCtx.currentTime;

      // Rising edge detection
      if (
        speechActive &&
        !STATE.lastActive &&
        now - STATE.lastTriggerTime > SILENCE_MS / 1000 &&
        now - STATE.lastTriggerTime > MIN_TRIGGER_GAP
      ) {
        if (typeof onWordTrigger === "function") {
          onWordTrigger(currentWord++);
          syncMap.push({ time: now - startTime, wordIndex: currentWord });
        }
        STATE.lastTriggerTime = now;
      }

      STATE.lastActive = speechActive;
      if (isAnalyzing) rafId = requestAnimationFrame(analyze);
    }

    analyze();
    return { stop: stopAnalyser, getSyncMap: () => syncMap };
  }

  // ------------------------------------------------------
  // 🛑 Stop analyser and release audio resources
  // ------------------------------------------------------
  function stopAnalyser() {
    isAnalyzing = false;
    if (rafId) cancelAnimationFrame(rafId);
    try { if (source) source.disconnect(); } catch {}
    try { if (audioCtx && audioCtx.state !== "closed") audioCtx.close(); } catch {}
    audioCtx = analyser = dataArray = source = null;
  }

  return { startAnalyser, stopAnalyser };
})();



/* =======================================================
   🛑 NARRATOR ENGINE LAUNCH LOCK (Prevents any early TTS)
   ======================================================= */
window.NME_LOCKED = true;
window.NME_DEFERRED_INIT = null;

(function waitForEngine() {
  const NE = window.NarratorEngine;
  if (!NE) {
    // NarratorEngine not yet defined; retry shortly
    return setTimeout(waitForEngine, 50);
  }

  // --- Backup original init() ---
  const originalInit = NE.init;
  NE.init = function (callback) {
    if (window.NME_LOCKED) {
      console.log("🔒 NarratorEngine init deferred (waiting for observer trigger)");
      // Store for later
      window.NME_DEFERRED_INIT = () => originalInit.call(NE, callback);
      return;
    }
    // Run normally
    return originalInit.call(NE, callback);
  };

  // --- Backup speak() ---
  const originalSpeak = NE.speak;
  NE.speak = function (...args) {
    if (window.NME_LOCKED) {
      console.log("🔒 NarratorEngine speak blocked (locked)");
      return;
    }
    return originalSpeak.apply(NE, args);
  };
})();



// Simple async IndexedDB wrapper
const VideoDB = {
    db: null,

    async init() {
        return new Promise((resolve) => {
            const request = indexedDB.open("BubbleVideosDB", 1);
            request.onupgradeneeded = function(e) {
                const db = e.target.result;
                db.createObjectStore("videos", { keyPath: "id" });
            };
            request.onsuccess = function(e) {
                VideoDB.db = e.target.result;
                resolve();
            };
        });
    },

    async saveVideo(id, blob) {
        return new Promise((resolve) => {
            const tx = VideoDB.db.transaction("videos", "readwrite");
            tx.objectStore("videos").put({ id, blob });
            tx.oncomplete = resolve;
        });
    },

    async loadVideo(id) {
        return new Promise((resolve) => {
            const tx = VideoDB.db.transaction("videos", "readonly");
            const req = tx.objectStore("videos").get(id);
            req.onsuccess = () => resolve(req.result?.blob || null);
        });
    }
};



    (function() {
    // --- CORE VARIABLES AND CONSTANTS ---
    const EDITOR_PASSWORD = "12345NME09876";
    const MAX_ALLOWED_BUBBLES = 50; 
    let isEditorActive = false; 
    let currentElement


/* ==========================================================
   VFX UI TOGGLE ON BACKGROUND CLICK (Now independent)
   ========================================================== */
(function () {
    const root = document.getElementById('narrative-engine-root');
    const vfxControls = document.getElementById('ui-controls');

    if (!root || !vfxControls) return;

    // Start hidden
    vfxControls.style.display = 'none';
    vfxControls.classList.remove('editor-mode-only');

    root.addEventListener('click', function (event) {
        const isBackgroundClick =
            event.target.id === 'vfx-container' ||
            event.target.classList.contains('background-ui') ||
            event.target.closest('#vfx-container');

        if (isBackgroundClick) {
            event.stopPropagation();
            vfxControls.style.display =
                vfxControls.style.display === 'none' ? 'block' : 'none';
        }
    });
})();



/* ==========================================================
   🧠 INTELLIGENT OBSERVATION WRAPPER FOR NARRATOR ENGINE
   ========================================================== */
/* ==========================================================
   🧠 INTELLIGENT OBSERVATION WRAPPER FOR NARRATOR ENGINE
   ========================================================== */
(function () {
    // --- Global State & Observer (Refactored) ---
    
    // 🎯 FIX 1 & 4: Refactor global flag for initial engine launch and introduce per-section tracking
    let engineLaunched = false; // Controls the one-time launch of the visual engine
    const triggeredSections = new Set(); // Tracks sections that have been processed
    const VISIBILITY_THRESHOLD = 0.5; 
    const MIN_RELEVANCE_SCORE = 0.3; 
    let observer = null;

    // New function to handle the per-section trigger
    // This function ensures the main engine launches only once, but tracks all triggered sections.
    function handleSectionTrigger(element, score) {
        if (triggeredSections.has(element)) {
            return; // Goal: Only narrate/trigger once per section
        }

        triggeredSections.add(element);

        if (!engineLaunched) {
            console.log(`✅ Initial Engine Launch Trigger (Score: ${score}, Section: ${element.id || element.tagName})`);
            engineLaunched = true;
            // Existing function is now properly called
            handleNarrativeLaunch(element); 
        } else {
            // Goal: Section-specific narration/bubble animation for subsequent visible sections
            console.log(`💬 Section Narrative Triggered (Score: ${score}, Section: ${element.id || element.tagName}). Engine is already running.`);
            // Future code would be here: NarratorEngine.narrateSection(element);
        }
    }
    
    // 1️⃣ Initial setup and Freeze
    document.addEventListener("DOMContentLoaded", () => {
        try {
            // Freeze engine if not already done, and prevent immediate bubble creation
            window.NME_LOCKED = true; 

            if (window.NarratorEngine && typeof NarratorEngine.speak === "function") {
                // Freeze speech synthesis until unlocked
                NarratorEngine.speak = function () { console.log("🔒 NarratorEngine speak blocked (DOM not ready/locked)"); };
            }
            // Stop any background analysis that might trigger the old logic
            if (window.LiveSyncEngine && typeof LiveSyncEngine.stopAnalyser === "function") {
                LiveSyncEngine.stopAnalyser();
            }
            if (window.SSEController && typeof SSEController.disconnect === "function") {
                SSEController.disconnect();
            }
        } catch (err) {
            console.warn("Initial freeze:", err);
        }
        setupObserver();
    });

    // 2️⃣ Intelligent Intersection Observer
    function setupObserver() {
        const sections = document.querySelectorAll("section, article, div[id]"); 
        if (!sections.length) {
            console.warn("⚠️ No sections found for observer.");
            return;
        }
        console.log("🛰️ Observer scanning sections:", sections.length);
        
        // 🎯 FIX 2: Use 50% threshold (0.5)
        observer = new IntersectionObserver(onIntersect, {
            root: null,
            rootMargin: "0px",
            threshold: VISIBILITY_THRESHOLD
        });
        
        sections.forEach((sec) => {
            observer.observe(sec);
            console.log("👁️ Watching:", sec.id || sec.className || sec.tagName);
        });
    }

    async function onIntersect(entries) {
        for (const entry of entries) {
            // 🎯 Check for 50% visibility AND if the section has already triggered
            if (entry.intersectionRatio < VISIBILITY_THRESHOLD || triggeredSections.has(entry.target)) {
                 continue; 
            }

            // Analyze relevance score
            const score = await analyzeContext(entry.target);
            if (score > MIN_RELEVANCE_SCORE) {
                
                // Trigger the engine launch
                handleSectionTrigger(entry.target, score);
            }
        }
    }

    // 3️⃣ Light-weight relevance analyzer
    async function analyzeContext(section) {
        const text = (section.innerText || section.textContent || "").toLowerCase();
        if (text.length < 50) return 0;
        console.log("🔍 Checking:", section.id || section.className || section.tagName);
        console.log("📄 Text sample:", text.slice(0, 80) + "...");
        const keywords = [
          "marketing","product","service","pricing","business",
          "about","solution","learn","demo","offer","strategy","customer"
        ];
        let hits = 0;
        keywords.forEach(k => { if (text.includes(k)) hits++; });
        const ratio = hits / keywords.length;
        return Math.min(1, ratio * 2); // normalized relevance
    }

    // 4️⃣ Controlled Activation (RENAMED and SLIGHTLY MODIFIED)
    function handleNarrativeLaunch(section) {
        // Renamed from triggerNarrative, called only once via handleSectionTrigger

        console.log("🎬 Intelligent observer triggered at:", section.id || section.className);

        try {
            // Unlock the narration gate
            window.NME_LOCKED = false;

            // Fade in root
            const root = document.getElementById("narrative-engine-root");
            if (root) {
                root.style.display = "flex";
                root.style.opacity = "0";
                root.style.transition = "opacity 1s ease";
                setTimeout(() => (root.style.opacity = "1"), 100);
            }

            // Launch deferred NarratorEngine init (safely runs TTS setup)
            if (window.NME_DEFERRED_INIT && typeof window.NME_DEFERRED_INIT === "function") {
                window.NME_DEFERRED_INIT();
                window.NME_DEFERRED_INIT = null;
            }

            // Safe double-check and run NarratorEngine.init
            if (window.NarratorEngine && typeof NarratorEngine.init === "function") {
                try {
                    NarratorEngine.init(() => {
                        console.log("🔊 NarratorEngine initialized after observer trigger.");
                    });
                } catch (e) {
                    console.warn("Init retry failed:", e);
                }
            }

            // Start LiveSyncEngine if applicable
            if (window.LiveSyncEngine && window.currentStream) {
                LiveSyncEngine.startAnalyser(window.currentStream, () => console.log("🎧 Live Analyser started."));
            }

            // 🎯 FIX: DELAY THE VISUAL ENGINE START 
            setTimeout(() => {
                if (typeof createBubble === "function") {
                    createBubble(0); // Start the bubble cycle
                }
                if (typeof createParticles === "function") {
                    createParticles(); // Start the particle generation
                }
            }, 1200); 

        } catch (e) {
            console.error("Narrative Engine trigger failed:", e);
        }
    }
})();



/* ==========================================================
   🧠 INTELLIGENT OBSERVATION WRAPPER (Production-Grade)
   ========================================================== */
(function () {
    // 🎯 STEP 1: GLOBAL CONFIGURATION & PERSISTENCE
    const NME_EDITOR_MODE = true; 
    const CONFIG_STORAGE_KEY = 'NME_USER_SETTINGS';
    
    const DEFAULT_CONFIG = {
        triggerSectionId: null,     
        delaySeconds: 0,            
        engineRootHeight: '100vh',  // Renamed for clarity
        bubbleWrapperHeight: '80vh', // NEW DEFAULT SETTING
    };

    let NME_CONFIG = { ...DEFAULT_CONFIG };
    
    // Function to load config
    function loadNMEConfig() {
        try {
            const storedConfig = localStorage.getItem(CONFIG_STORAGE_KEY);
            if (storedConfig) {
                // Correctly merge stored configuration over defaults
                const parsedConfig = JSON.parse(storedConfig);
                NME_CONFIG = { ...DEFAULT_CONFIG, ...parsedConfig };
            }
        } catch (e) {
            console.error("Configuration load failed. Using defaults.", e);
            NME_CONFIG = { ...DEFAULT_CONFIG };
        }
    }
    
    // Function to save config
    function saveNMEConfig() {
        try {
            localStorage.setItem(CONFIG_STORAGE_KEY, JSON.stringify(NME_CONFIG));
            // Apply settings and re-initialize the observer
            reinitializeEngineLogic();
            console.log("⚙️ NME Settings saved and applied.", NME_CONFIG);
        } catch (e) {
            console.error("Failed to save NME settings:", e);
        }
    }

    // --- Global State & Observer ---
    let engineLaunched = false;
    const triggeredSections = new Set();
    const VISIBILITY_THRESHOLD = 0.5; 
    const MIN_RELEVANCE_SCORE = 0.3; 
    let observer = null;
    let isSelectingElement = false;
    
    // --- Utility Functions ---

    // Helper to update UI inputs based on config
    function updateUIDisplay() {
        if (!NME_EDITOR_MODE) return;
        const idDisplay = document.getElementById('nme-selected-id-display');
        const delayInput = document.getElementById('nme-delay-input');
        const rootHeightInput = document.getElementById('nme-root-height-input');
        const bubbleHeightInput = document.getElementById('nme-bubble-height-input'); // NEW

        if (idDisplay) idDisplay.textContent = `Current ID: ${NME_CONFIG.triggerSectionId || 'N/A (Auto-Discovery)'}`;
        if (delayInput) delayInput.value = NME_CONFIG.delaySeconds;
        if (rootHeightInput) rootHeightInput.value = NME_CONFIG.engineRootHeight;
        if (bubbleHeightInput) bubbleHeightInput.value = NME_CONFIG.bubbleWrapperHeight; // NEW
    }
    
    // Sanitize and apply height
    function sanitizeHeight(height, defaultVal) {
        return (typeof height === 'string' && (height.endsWith('px') || height.endsWith('vh') || height.endsWith('%'))) ? height : defaultVal;
    }

    // Apply Root height immediately in editor mode
    function applyEngineRootHeight(height) {
        const root = document.getElementById("narrative-engine-root");
        if (root) {
            const safeHeight = sanitizeHeight(height, '100vh');
            root.style.height = safeHeight;
            NME_CONFIG.engineRootHeight = safeHeight; 
        }
    }

    // NEW: Apply Bubble Wrapper height
    function applyBubbleWrapperHeight(height) {
        const wrapper = document.getElementById("bubblesWrapper");
        if (wrapper) {
            const safeHeight = sanitizeHeight(height, '80vh');
            wrapper.style.height = safeHeight;
            NME_CONFIG.bubbleWrapperHeight = safeHeight; 
        }
    }

    // New function to handle the per-section trigger
    function handleSectionTrigger(element, score) {
        if (triggeredSections.has(element)) {
            return; 
        }

        const isTargetMatch = !NME_CONFIG.triggerSectionId || element.id === NME_CONFIG.triggerSectionId;
        
        if (!isTargetMatch) {
            return;
        }

        triggeredSections.add(element);

        if (!engineLaunched) {
            console.log(`✅ Initial Engine Launch Trigger (Score: ${score}, Section: ${element.id || element.tagName})`);
            engineLaunched = true;
            handleNarrativeLaunch(element); 
        } else {
            console.log(`💬 Section Narrative Triggered (Score: ${score}, Section: ${element.id || element.tagName}). Engine is already running.`);
        }
    }
    
    // --- UI/Editor Mode Logic ---

    function initEditorUI() {
        const icon = document.getElementById('nme-settings-icon');
        const panel = document.getElementById('nme-settings-panel');
        const selectBtn = document.getElementById('nme-select-trigger-btn');
        const delayInput = document.getElementById('nme-delay-input');
        const rootHeightInput = document.getElementById('nme-root-height-input'); // Renamed
        const bubbleHeightInput = document.getElementById('nme-bubble-height-input'); // NEW
        const overlay = document.getElementById('nme-selection-overlay');

        if (!icon || !panel) return;
        icon.style.display = 'none';
        updateUIDisplay();

        // 1. Toggle UI visibility and click-outside dismissal (kept as is)
        icon.onclick = (e) => {
            e.stopPropagation();
            panel.style.display = panel.style.display === 'block' ? 'none' : 'block';
        };

        document.addEventListener('click', (e) => {
            if (panel.style.display === 'block' && !panel.contains(e.target) && e.target !== icon) {
                panel.style.display = 'none';
            }
        });

        // 2. Control handlers for Delay and Root Height
        delayInput.onchange = () => {
            NME_CONFIG.delaySeconds = parseFloat(delayInput.value) || 0;
            saveNMEConfig();
        };

        rootHeightInput.onchange = () => {
            NME_CONFIG.engineRootHeight = rootHeightInput.value || '100vh';
            saveNMEConfig();
        };

        // NEW 3. Control handler for Bubble Wrapper Height
        bubbleHeightInput.onchange = () => {
            NME_CONFIG.bubbleWrapperHeight = bubbleHeightInput.value || '80vh';
            saveNMEConfig();
        };

        // 4. Element Selection Logic (kept as is)
        selectBtn.onclick = (e) => {
            e.stopPropagation();
            startElementSelection(overlay, selectBtn, panel);
        };
        
        document.addEventListener('keydown', (e) => {
            if (isSelectingElement && e.key === 'Escape') {
                cancelElementSelection(overlay, selectBtn, panel);
            }
        });
        
        // Final click handler for selection
        overlay.addEventListener('click', (e) => {
            if (!isSelectingElement) return;

            e.preventDefault();
            e.stopImmediatePropagation();
            
            let targetElement = e.target;
            while (targetElement && targetElement.tagName !== 'BODY') {
                if (targetElement.id) break;
                targetElement = targetElement.parentElement;
            }

            if (targetElement && targetElement.id) {
                NME_CONFIG.triggerSectionId = targetElement.id;
            } else {
                NME_CONFIG.triggerSectionId = null; 
            }

            finishElementSelection(overlay, selectBtn, panel);
            saveNMEConfig();
        });

        // Hover effect for selection mode
        overlay.addEventListener('mousemove', (e) => {
            if (!isSelectingElement) return;

            document.querySelectorAll('.nme-hover-target').forEach(el => el.classList.remove('nme-hover-target'));

            if (e.target && e.target.id && e.target.tagName !== 'BODY') {
                e.target.classList.add('nme-hover-target');
            }
        });
    }

    // Selection helper functions (kept as is)
    function startElementSelection(overlay, selectBtn, panel) {
        isSelectingElement = true;
        panel.style.display = 'none';
        overlay.style.display = 'block';
        document.body.classList.add('nme-selection-active');
        selectBtn.textContent = 'Selecting... (Click or Press ESC)';
    }

    function cancelElementSelection(overlay, selectBtn, panel) {
        isSelectingElement = false;
        overlay.style.display = 'none';
        document.body.classList.remove('nme-selection-active');
        document.querySelectorAll('.nme-hover-target').forEach(el => el.classList.remove('nme-hover-target'));
        selectBtn.textContent = 'Select Page Element';
        panel.style.display = 'block';
    }
    
    function finishElementSelection(overlay, selectBtn, panel) {
        isSelectingElement = false;
        overlay.style.display = 'none';
        document.body.classList.remove('nme-selection-active');
        document.querySelectorAll('.nme-hover-target').forEach(el => el.classList.remove('nme-hover-target'));
        selectBtn.textContent = 'Select Page Element';
        panel.style.display = 'block';
    }


    // --- Engine Initialization ---

    // Resets engine state and observer (used after config change)
    function reinitializeEngineLogic() {
        engineLaunched = false;
        triggeredSections.clear();
        if (observer) observer.disconnect();
        setupObserver();
        applyEngineRootHeight(NME_CONFIG.engineRootHeight); // Re-apply height settings
        applyBubbleWrapperHeight(NME_CONFIG.bubbleWrapperHeight); // Re-apply new height setting
    }
    
    document.addEventListener("DOMContentLoaded", () => {
        loadNMEConfig(); 
        
        // Initial engine freeze (kept as is)
        try {
            window.NME_LOCKED = true; 
            if (window.NarratorEngine && typeof NarratorEngine.speak === "function") {
                NarratorEngine.speak = function () { console.log("🔒 NarratorEngine speak blocked (DOM not ready/locked)"); };
            }
            if (window.LiveSyncEngine && typeof LiveSyncEngine.stopAnalyser === "function") {
                LiveSyncEngine.stopAnalyser();
            }
            if (window.SSEController && typeof SSEController.disconnect === "function") {
                SSEController.disconnect();
            }
        } catch (err) {
            console.warn("Initial freeze:", err);
        }
        
        // Initialize UI and apply initial height
        if (NME_EDITOR_MODE) {
            initEditorUI();
            applyEngineRootHeight(NME_CONFIG.engineRootHeight);
            applyBubbleWrapperHeight(NME_CONFIG.bubbleWrapperHeight); // Apply on load
        }
        
        setupObserver();
    });

    // 2️⃣ Intelligent Intersection Observer (Kept as is)
    function setupObserver() {
        let sections = [];
        
        if (NME_CONFIG.triggerSectionId) {
            const el = document.getElementById(NME_CONFIG.triggerSectionId);
            if (el) {
                sections = [el];
                console.log(`🛰️ Observer configured to watch specific section: #${NME_CONFIG.triggerSectionId}`);
            } else {
                sections = document.querySelectorAll("section, article, div[id]");
                console.warn(`⚠️ Configured ID #${NME_CONFIG.triggerSectionId} not found. Reverting to auto-discovery.`);
            }
        } else {
            sections = document.querySelectorAll("section, article, div[id]"); 
            console.log("🛰️ Observer running in Auto-Discovery Mode.");
        }

        if (sections.length === 0) {
            console.warn("⚠️ No sections found for observer.");
            return;
        }

        if (observer) observer.disconnect();
        
        console.log("🛰️ Observer scanning sections:", sections.length);
        
        observer = new IntersectionObserver(onIntersect, {
            root: null,
            rootMargin: "0px",
            threshold: VISIBILITY_THRESHOLD
        });
        
        sections.forEach((sec) => {
            observer.observe(sec);
            console.log("👁️ Watching:", sec.id || sec.className || sec.tagName);
        });
    }

    async function onIntersect(entries) {
        for (const entry of entries) {
            if (entry.intersectionRatio < VISIBILITY_THRESHOLD || triggeredSections.has(entry.target)) {
                 continue; 
            }

            let score = 1;
            if (!NME_CONFIG.triggerSectionId) {
                score = await analyzeContext(entry.target);
            }
            
            if (score > MIN_RELEVANCE_SCORE) {
                handleSectionTrigger(entry.target, score);
            }
        }
    }

    // 3️⃣ Light-weight relevance analyzer (Kept as is)
    async function analyzeContext(section) {
        const text = (section.innerText || section.textContent || "").toLowerCase();
        if (text.length < 50) return 0;
        console.log("🔍 Checking:", section.id || section.className || section.tagName);
        console.log("📄 Text sample:", text.slice(0, 80) + "...");
        const keywords = [
          "marketing","product","service","pricing","business",
          "about","solution","learn","demo","offer","strategy","customer"
        ];
        let hits = 0;
        keywords.forEach(k => { if (text.includes(k)) hits++; });
        const ratio = hits / keywords.length;
        return Math.min(1, ratio * 2); 
    }

    // 4️⃣ Controlled Activation
    function handleNarrativeLaunch(section) {
        console.log("🎬 Intelligent observer triggered at:", section.id || section.className);

        try {
            window.NME_LOCKED = false;
            
            // Apply custom heights
            const root = document.getElementById("narrative-engine-root");
            if (root) {
                applyEngineRootHeight(NME_CONFIG.engineRootHeight); 
                root.style.display = "flex";
                root.style.opacity = "0";
                root.style.transition = "opacity 1s ease";
                setTimeout(() => (root.style.opacity = "1"), 100);
            }
            // Apply bubble height on launch
            applyBubbleWrapperHeight(NME_CONFIG.bubbleWrapperHeight); 


            // Engine Initialization (kept as is)
            if (window.NME_DEFERRED_INIT && typeof window.NME_DEFERRED_INIT === "function") {
                window.NME_DEFERRED_INIT();
                window.NME_DEFERRED_INIT = null;
            }

            if (window.NarratorEngine && typeof NarratorEngine.init === "function") {
                try {
                    NarratorEngine.init(() => {
                        console.log("🔊 NarratorEngine initialized after observer trigger.");
                    });
                } catch (e) {
                    console.warn("Init retry failed:", e);
                }
            }

            if (window.LiveSyncEngine && window.currentStream) {
                LiveSyncEngine.startAnalyser(window.currentStream, () => console.log("🎧 Live Analyser started."));
            }

            // Appearance Delay Logic (verified as correct)
            const baseDelay = 1200; 
            const customDelay = NME_CONFIG.delaySeconds * 1000;
            
            // Uses custom delay if > 0, otherwise uses base delay for smooth transitions.
            const finalDelay = customDelay > 0 ? customDelay : baseDelay;
            console.log(`⏱️ Engine visuals starting in ${finalDelay}ms.`);

            setTimeout(() => {
                if (typeof createBubble === "function") {
                    createBubble(0); 
                }
                if (typeof createParticles === "function") {
                    createParticles(); 
                }
            }, finalDelay); 

        } catch (e) {
            console.error("Narrative Engine trigger failed:", e);
        }
    }
})();


Requests	IP Address	Location	AS Autonomous System
8	185.199.111.133	United States	AS54113Fastly, Inc.
1	104.17.24.14	United States	AS13335Cloudflare, Inc.
1	192.163.208.117	United States	AS46606Unified Layer
1	104.26.3.143	United States	AS13335Cloudflare, Inc.
1	172.64.147.160	United States	AS13335Cloudflare, Inc.
1	188.114.96.3	United States	AS13335Cloudflare, Inc.
1	142.251.110.95	United States	AS15169Google LLC
1	142.251.14.94	United States	AS15169Google LLC
15	8	-	-

Security Scan Report: kakao-84n.pages.dev

Summary

AI Security Verdict

High Risk

Risk Factors

Details

Screenshot

Page Load Overview

Language Analysis

Primary Language

Detection Details

Website Classification

Primary Category

All Detected Categories

Detected Features

Domain & IP Information

Detected Technologies4

Content Similarity HashesFor malware variant detection

TLSH (Trend Micro Locality Sensitive Hash)

ssdeep (Context Triggered Piecewise Hashing)

sdhash (Similarity Digest Hashing)

Image Hashes

Perceptual Hashes

Other Hashes

Scan History