462 lines
24 KiB
HTML
462 lines
24 KiB
HTML
<!DOCTYPE html>
|
||
<!--
|
||
SciFiAmbientDisplay_v3co.html
|
||
Version: v3co (co = Claude Opus 5) Base: v2cs Date: 2026-09-04
|
||
|
||
CHANGE: Per-theme OBSERVATION layer isolation.
|
||
v2cs correctly fixed the `.observation-stage svg > rect:first-child` selector that had
|
||
never matched, but the rule was GLOBAL -- uncovering the shared canvas layer stack in
|
||
nine themes at once and making every OBSERVATION display read as a variation of one.
|
||
v3co keeps the correct selector and makes canvas visibility an explicit, per-theme,
|
||
default-deny declaration: see the OBSERVATION_CANVAS manifest above class
|
||
ObservationEngine. Rollback point: SciFiAmbientDisplay_v2cs.html (untouched).
|
||
-->
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="UTF-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0">
|
||
<title>Sci-Fi Ambience Generator - Publish Build v14co</title>
|
||
<link rel="stylesheet" href="css/style.css">
|
||
</head>
|
||
<body class="theme-lcars-tng">
|
||
|
||
<!-- Header Frame with Interactive Universe Dropdown -->
|
||
<header class="lcars-header">
|
||
<div class="universe-selector-container" id="universe-selector-container">
|
||
<div class="lcars-elbow-left" id="header-universe-btn" title="Click to Change Sci-Fi Universe">
|
||
<span id="header-universe-label">STARFLIGHT</span> <span style="font-size: 0.8rem; margin-left: 4px;">▼</span>
|
||
</div>
|
||
<div class="universe-dropdown-menu" id="universe-dropdown">
|
||
<!-- Injected dynamically from UniverseRegistry -->
|
||
</div>
|
||
</div>
|
||
|
||
<div class="lcars-top-bar">
|
||
<span id="header-ship-name">USS INTERPRISE-G // MAIN BRIDGE</span>
|
||
<div class="header-volume-dock">
|
||
<button class="btn-header-mute" id="btn-header-mute" title="Toggle Mute (M)">MUTE</button>
|
||
<span class="header-vol-val" id="header-vol-val">75%</span>
|
||
</div>
|
||
<span id="header-matrix-label">STARFLIGHT SOUND MATRIX v2.9</span>
|
||
</div>
|
||
<div class="lcars-pill-end"></div>
|
||
</header>
|
||
|
||
<!-- Main Application Container -->
|
||
<main class="lcars-container">
|
||
|
||
<!-- Left Sidebar: Active Universe Presets (Purely segregated per theme) -->
|
||
<aside class="left-sidebar">
|
||
<div class="sidebar-heading" id="sidebar-title">STARSHIP PRESETS</div>
|
||
<div class="preset-list" id="preset-container">
|
||
<!-- Dynamically injected preset buttons for active universe only -->
|
||
</div>
|
||
</aside>
|
||
|
||
<!-- Center Panel: Master Controls, Presets Description & Channel Synthesizers -->
|
||
<section class="center-panel">
|
||
|
||
<!-- Master Control Card -->
|
||
<div class="panel-card">
|
||
<div class="panel-header">
|
||
<div>
|
||
<div class="panel-title" id="current-preset-title">INTERPRISE-G: MAIN BRIDGE</div>
|
||
<div class="panel-sub" id="current-preset-desc">Warm, low-frequency 50Hz hull tone with gentle ventilation and soft LCARD computer chirps.</div>
|
||
</div>
|
||
<div class="diagnostic-stats" style="width: 220px;">
|
||
<div class="stat-box">
|
||
<span class="stat-label">AUDIO ENGINE</span>
|
||
<span class="stat-value" id="stat-audio-status">STANDBY</span>
|
||
</div>
|
||
<div class="stat-box">
|
||
<span class="stat-label">CORE FREQ</span>
|
||
<span class="stat-value" id="stat-core-freq">58.0 Hz</span>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Master Transport & Actions -->
|
||
<div class="transport-bar">
|
||
<button class="btn-lcars-large" id="btn-master-play">
|
||
<span id="play-icon">▶</span> <span id="play-text">ENGAGE</span>
|
||
</button>
|
||
|
||
<div class="pill-button-group" id="universe-events-container">
|
||
<!-- Dynamically populated per universe -->
|
||
</div>
|
||
<div class="watch-experience-wrap">
|
||
<button class="btn-lcars-pill btn-observation" id="btn-observation" title="Start the full-screen procedural visual and sound experience">WATCH EXPERIENCE</button>
|
||
<div class="watch-experience-help">Full-screen procedural visuals, soundscape, telemetry, events, and optional local AI announcements.</div>
|
||
</div>
|
||
<label class="observation-hud-control" title="Toggle starship viewport window frame (ON: framed starship lounge / OFF: pure deep space)">
|
||
<span class="observation-hud-label">VIEWPORT</span>
|
||
<input type="checkbox" id="toggle-observation-viewport" checked aria-label="Toggle Observation Viewport Frame">
|
||
<span class="observation-hud-state" id="val-observation-viewport">ON</span>
|
||
</label>
|
||
<label class="observation-hud-control" title="Toggle vertical structural window pillars / mullions (OFF: unobstructed panoramic view / ON: structural posts)">
|
||
<span class="observation-hud-label">PILLARS</span>
|
||
<input type="checkbox" id="toggle-observation-pillars" aria-label="Toggle Window Pillars">
|
||
<span class="observation-hud-state" id="val-observation-pillars">OFF</span>
|
||
</label>
|
||
<div class="observation-activity-control" title="Controls how frequently and intensely Observation generates transient visual activity">
|
||
<span class="observation-activity-label">ACTIVITY</span>
|
||
<input type="range" id="slider-observation-activity" min="0" max="100" step="1" value="60" aria-label="Observation activity level">
|
||
<span class="observation-activity-value" id="val-observation-activity">60%</span>
|
||
</div>
|
||
<label class="observation-hud-control" title="Keep OBSERVATION profile/status information visible. Turn off to fade it out over 30 seconds.">
|
||
<span class="observation-hud-label">HUD HOLD</span>
|
||
<input type="checkbox" id="toggle-observation-hud" checked aria-label="Keep Observation information visible">
|
||
<span class="observation-hud-state" id="val-observation-hud">ON</span>
|
||
</label>
|
||
</div>
|
||
|
||
<!-- Dedicated Master Volume Console -->
|
||
<div class="master-volume-console">
|
||
<div class="master-vol-top">
|
||
<div class="master-vol-title-group">
|
||
<span class="master-vol-tag">MAIN MASTER VOLUME</span>
|
||
<span class="master-vol-readout" id="val-master-vol">75%</span>
|
||
<span class="master-vol-db" id="val-master-db">-2.5 dB</span>
|
||
</div>
|
||
<div class="master-vol-actions">
|
||
<button class="btn-lcars-pill btn-mute" id="btn-master-mute" title="Toggle Mute (M)">MUTE</button>
|
||
<div class="master-vol-presets">
|
||
<button class="btn-vol-step" data-vol="0.25">25%</button>
|
||
<button class="btn-vol-step" data-vol="0.50">50%</button>
|
||
<button class="btn-vol-step active" data-vol="0.75">75%</button>
|
||
<button class="btn-vol-step" data-vol="1.00">MAX</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="master-slider-row">
|
||
<button class="vol-adj-btn" id="btn-vol-down" title="Volume Down (-5% or Down Arrow)">−</button>
|
||
<div class="slider-track-container">
|
||
<input type="range" id="slider-master-vol" min="0" max="1" step="0.01" value="0.75" class="slider-master-large" aria-label="Main Volume">
|
||
<!-- Visual 10-Segment LED Level Meter -->
|
||
<div class="vol-meter-leds" id="vol-meter-leds">
|
||
<div class="led-pip active"></div>
|
||
<div class="led-pip active"></div>
|
||
<div class="led-pip active"></div>
|
||
<div class="led-pip active"></div>
|
||
<div class="led-pip active"></div>
|
||
<div class="led-pip active"></div>
|
||
<div class="led-pip active"></div>
|
||
<div class="led-pip active"></div>
|
||
<div class="led-pip"></div>
|
||
<div class="led-pip"></div>
|
||
</div>
|
||
</div>
|
||
<button class="vol-adj-btn" id="btn-vol-up" title="Volume Up (+5% or Up Arrow)">+</button>
|
||
</div>
|
||
|
||
<!-- Futuristic Noice Cancellation: deterministic comfort filtering of the three ambience beds -->
|
||
<div class="fnc-console" id="fnc-console">
|
||
<div class="fnc-top">
|
||
<div class="fnc-title-group">
|
||
<span class="fnc-title">FNC // FUTURISTIC NOICE CANCELLATION</span>
|
||
<span class="fnc-state" id="fnc-state">MONITORING</span>
|
||
</div>
|
||
<button class="btn-lcars-pill btn-fnc enabled" id="btn-fnc-enable" aria-pressed="true" title="Enable or bypass Futuristic Noice Cancellation">FNC ENABLED</button>
|
||
</div>
|
||
<div class="fnc-level-row">
|
||
<span class="fnc-level-label">FNC LEVEL</span>
|
||
<input type="range" id="slider-fnc-level" min="0" max="1" step="0.01" value="0.65" aria-label="Futuristic Noice Cancellation level">
|
||
<span class="fnc-level-value" id="val-fnc-level">65%</span>
|
||
</div>
|
||
<div class="fnc-detail" id="fnc-detail">Comfort suppression active — Life Support, Hull Drone, and Worp Core are reduced according to FNC level.</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Real-Time Frequency Spectrum Visualizer -->
|
||
<div class="panel-card">
|
||
<div class="panel-header">
|
||
<span class="panel-title">ACOUSTIC FREQUENCY SPECTRUM</span>
|
||
<span class="panel-sub">PROCEDURAL HARMONIC ANALYSIS</span>
|
||
</div>
|
||
<div class="canvas-wrapper spectrum-wrapper">
|
||
<div class="canvas-label-overlay">SPECTRUM BIN: 32 CH // REAL-TIME FFT</div>
|
||
<canvas id="spectrum-canvas"></canvas>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- 4-Channel Synthesizer Mixer Card -->
|
||
<div class="panel-card">
|
||
<div class="panel-header">
|
||
<span class="panel-title">PROCEDURAL SOUND ENGINE MIXER</span>
|
||
<span class="panel-sub">LIVE PARAMETER MODULATION</span>
|
||
</div>
|
||
|
||
<div class="mixer-grid">
|
||
<!-- Channel 1: Hull Vibration -->
|
||
<div class="channel-strip">
|
||
<div class="channel-header">
|
||
<span>1. HULL DRONE</span>
|
||
<span id="val-hull-vol">65%</span>
|
||
</div>
|
||
<div class="control-row">
|
||
<div class="control-label"><span>LEVEL</span></div>
|
||
<input type="range" id="slider-hull-vol" min="0" max="1" step="0.01" value="0.65">
|
||
</div>
|
||
<div class="control-row">
|
||
<div class="control-label"><span>BASE TONE</span><span id="val-hull-freq">50 Hz</span></div>
|
||
<input type="range" id="slider-hull-freq" min="30" max="120" step="1" value="50">
|
||
</div>
|
||
<div class="control-row">
|
||
<div class="control-label"><span>DAMPING CUTOFF</span><span id="val-hull-cutoff">105 Hz</span></div>
|
||
<input type="range" id="slider-hull-cutoff" min="50" max="300" step="5" value="105">
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Channel 2: Worp Core Pulse -->
|
||
<div class="channel-strip">
|
||
<div class="channel-header">
|
||
<span>2. WORP CORE</span>
|
||
<span id="val-warp-vol">35%</span>
|
||
</div>
|
||
<div class="control-row">
|
||
<div class="control-label"><span>LEVEL</span></div>
|
||
<input type="range" id="slider-warp-vol" min="0" max="1" step="0.01" value="0.35">
|
||
</div>
|
||
<div class="control-row">
|
||
<div class="control-label"><span>PULSE RATE (BPM)</span><span id="val-warp-bpm">48 BPM</span></div>
|
||
<input type="range" id="slider-warp-bpm" min="20" max="120" step="1" value="48">
|
||
</div>
|
||
<div class="control-row">
|
||
<div class="control-label"><span>REACTOR PITCH</span><span id="val-warp-carrier">58 Hz</span></div>
|
||
<input type="range" id="slider-warp-carrier" min="35" max="150" step="1" value="58">
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Channel 3: Life Support -->
|
||
<div class="channel-strip">
|
||
<div class="channel-header">
|
||
<span>3. LIFE SUPPORT</span>
|
||
<span id="val-air-vol">55%</span>
|
||
</div>
|
||
<div class="control-row">
|
||
<div class="control-label"><span>LEVEL</span></div>
|
||
<input type="range" id="slider-air-vol" min="0" max="1" step="0.01" value="0.55">
|
||
</div>
|
||
<div class="control-row">
|
||
<div class="control-label"><span>AIRFLOW AIR FILTER</span><span id="val-air-cutoff">1600 Hz</span></div>
|
||
<input type="range" id="slider-air-cutoff" min="500" max="4000" step="50" value="1600">
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Channel 4: Telemetry -->
|
||
<div class="channel-strip">
|
||
<div class="channel-header">
|
||
<span>4. TELEMETRY</span>
|
||
<span id="val-telemetry-vol">45%</span>
|
||
</div>
|
||
<div class="control-row">
|
||
<div class="control-label"><span>LEVEL</span></div>
|
||
<input type="range" id="slider-telemetry-vol" min="0" max="1" step="0.01" value="0.45">
|
||
</div>
|
||
<div class="control-row">
|
||
<div class="control-label"><span>BACKGROUND CHIRP DENSITY</span><span id="val-telemetry-density">65%</span></div>
|
||
<input type="range" id="slider-telemetry-density" min="0" max="1" step="0.05" value="0.65">
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
</section>
|
||
|
||
<!-- Right Sidebar: Worp Core Intermix Chamber & LCARD Soundboard -->
|
||
<aside class="right-column">
|
||
|
||
<!-- Core / Rotor Visualizer Card -->
|
||
<div class="panel-card">
|
||
<div class="panel-header">
|
||
<span class="panel-title" id="core-visualizer-title">MATTER / ANTIMATTER CORE</span>
|
||
</div>
|
||
<div class="canvas-wrapper warp-core-wrapper">
|
||
<div class="canvas-label-overlay" id="core-visualizer-label">INTERMIX CHAMBER // ACTIVE</div>
|
||
<canvas id="warp-core-canvas"></canvas>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- XZBT Generative Experience / WebLLM + Kokoro. Optional, network-gated: see agents.md. -->
|
||
<div class="panel-card ai-experience-card" id="ai-experience-card">
|
||
<div class="panel-header">
|
||
<span class="panel-title">GENERATIVE EXPERIENCE</span>
|
||
<span class="panel-sub">LOCAL WEBLLM + KOKORO TTS</span>
|
||
</div>
|
||
<div class="ai-status-line">
|
||
<span>LOCAL GENERATIVE SYSTEM</span>
|
||
<span class="ai-status-badge" id="ai-status-badge">STANDBY</span>
|
||
</div>
|
||
<div class="ai-fixed-model">
|
||
<b>LANGUAGE MODEL</b><br>
|
||
<span id="ai-model-fixed">Qwen3-1.7B-q4f16_1-MLC</span><br>
|
||
<small>Automatically prepared when the experience starts. No model selection required.</small>
|
||
</div>
|
||
<div class="ai-engine-row" style="margin-top:7px">
|
||
<div class="ai-engine-chip">WEBLLM <span id="ai-llm-state">OFF</span></div>
|
||
<div class="ai-engine-chip">KOKORO <span id="ai-tts-state">OFF</span></div>
|
||
</div>
|
||
<div class="ai-control-grid">
|
||
<button class="btn-lcars-pill" id="btn-ai-prepare">PREPARE AI</button>
|
||
<button class="btn-lcars-pill" id="btn-ai-generate" disabled>GENERATE NOW</button>
|
||
<label class="ai-toggle-row"><input type="checkbox" id="ai-auto-enabled" checked> AUTO UPDATES</label>
|
||
<label class="ai-toggle-row"><input type="checkbox" id="ai-speech-enabled" checked> SPEAK</label>
|
||
<select class="span-2" id="ai-kokoro-voice" aria-label="Kokoro voice">
|
||
<option value="af_heart">Kokoro voice loads on preparation</option>
|
||
</select>
|
||
<div class="span-2">
|
||
<div class="control-label"><span>VOICE AUTOMATION</span><span id="ai-robot-value">84%</span></div>
|
||
<input type="range" id="ai-robot-amount" min="0" max="1" step="0.01" value="0.84" aria-label="Robotic voice effect intensity">
|
||
</div>
|
||
<div class="span-2">
|
||
<div class="control-label"><span>AUTO CADENCE</span><span id="ai-cadence-value">90-180 SEC</span></div>
|
||
<input type="range" id="ai-cadence" min="30" max="240" step="15" value="90">
|
||
</div>
|
||
</div>
|
||
<div class="ai-progress" id="ai-progress">AI and neural voice models load only when needed and are cached by the browser when supported.</div>
|
||
<div class="ai-experience-output" id="ai-experience-output">GENERATIVE CHANNEL STANDBY</div>
|
||
</div>
|
||
|
||
<!-- Local MIDI Control -->
|
||
<div class="panel-card midi-card" id="midi-card">
|
||
<div class="panel-header">
|
||
<span class="panel-title">LOCAL MIDI CONTROL</span>
|
||
<span class="panel-sub">WEB MIDI / MIDI LEARN</span>
|
||
</div>
|
||
<div class="midi-device-line" id="midi-device-status">MIDI OFFLINE - permission not yet requested.</div>
|
||
<div class="ai-control-grid">
|
||
<button class="btn-lcars-pill" id="btn-midi-enable">ENABLE MIDI</button>
|
||
<button class="btn-lcars-pill" id="btn-midi-clear">CLEAR MAP</button>
|
||
<select class="span-2" id="midi-target-select" aria-label="MIDI learn target"></select>
|
||
<button class="btn-lcars-pill span-2" id="btn-midi-learn">MIDI LEARN: SELECT TARGET, THEN MOVE CONTROL</button>
|
||
</div>
|
||
<div class="midi-bindings" id="midi-bindings">NO MIDI BINDINGS</div>
|
||
</div>
|
||
|
||
<!-- TV Presentation -->
|
||
<div class="panel-card tv-mode-card" id="tv-mode-card">
|
||
<div class="panel-header">
|
||
<span class="panel-title">TV PRESENTATION</span>
|
||
<span class="panel-sub">CAST-FRIENDLY 16:9</span>
|
||
</div>
|
||
<label class="ai-toggle-row"><input type="checkbox" id="tv-aspect-lock" checked> LOCK EXPERIENCE TO 16:9</label>
|
||
<div class="control-label"><span>RENDER DENSITY</span><span id="tv-quality-value">1080P TARGET</span></div>
|
||
<select id="tv-quality">
|
||
<option value="0.667">720P PERFORMANCE</option>
|
||
<option value="1" selected>1080P STANDARD</option>
|
||
<option value="1.333">1440P HIGH</option>
|
||
<option value="2">2160P ULTRA</option>
|
||
</select>
|
||
<div class="ai-progress">The scene keeps a canonical 16:9 layout on phones, PCs, and cast displays. Chrome still negotiates the final Cast stream resolution.</div>
|
||
</div>
|
||
|
||
<!-- Sleep Timer & Auto-Fadeout Card -->
|
||
<div class="panel-card">
|
||
<div class="panel-header">
|
||
<span class="panel-title">SLEEP TIMER</span>
|
||
</div>
|
||
<div class="timer-readout" id="timer-display">TIMER INACTIVE (CONTINUOUS)</div>
|
||
<div class="pill-button-group">
|
||
<button class="btn-lcars-pill btn-timer" data-minutes="15">15M</button>
|
||
<button class="btn-lcars-pill btn-timer" data-minutes="30">30M</button>
|
||
<button class="btn-lcars-pill btn-timer" data-minutes="60">60M</button>
|
||
<button class="btn-lcars-pill btn-timer" data-minutes="0">OFF</button>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Tactical Soundboard & Console Keypad -->
|
||
<div class="panel-card">
|
||
<div class="panel-header">
|
||
<span class="panel-title" id="soundboard-title">LCARD KEYPAD</span>
|
||
</div>
|
||
<div class="telemetry-triggers" id="soundboard-container">
|
||
<!-- Dynamically populated per universe -->
|
||
</div>
|
||
</div>
|
||
|
||
</aside>
|
||
|
||
</main>
|
||
|
||
|
||
<!-- OBSERVATION: passive casting / display mode. Click background to return. -->
|
||
<section class="observation-overlay" id="observation-overlay" aria-hidden="true" aria-label="Watch Experience full-screen display">
|
||
<!-- Layer 0 & 1: 60fps Deep Celestial Canvas (Parallax 3D Stars, Warp Streaks, Nebulae, Planets, Encounters) -->
|
||
<canvas id="observation-canvas" class="observation-canvas"></canvas>
|
||
|
||
<!-- Legacy / Vector Art Stage (Preserved for compatibility and vector overlays) -->
|
||
<div class="observation-stage" id="observation-stage"></div>
|
||
<div class="observation-sim-layer" id="observation-sim-layer"></div>
|
||
<div class="observation-event-layer" id="observation-event-layer"></div>
|
||
|
||
<!-- Layer 2: Viewport Architecture & Glass (Starship Window Frames & Specular Sheen) -->
|
||
<div class="observation-viewport-frame" id="observation-viewport-frame"></div>
|
||
<div class="observation-glass-sheen"></div>
|
||
<div class="observation-scanlines"></div>
|
||
<div class="observation-vignette"></div>
|
||
|
||
<!-- Layer 3: Emergency Alert Environmental Lighting Wash -->
|
||
<div class="observation-alert-wash" id="observation-alert-wash"></div>
|
||
|
||
<!-- Layer 4: Holographic LCARD HUD & Audio Waveform Sill -->
|
||
<div class="observation-chrome">
|
||
<div class="observation-ticker" id="observation-ticker">
|
||
<span class="observation-ticker-label">SYS</span>
|
||
<div class="observation-ticker-track">
|
||
<span class="observation-ticker-text" id="observation-ticker-text">STANDBY</span>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="observation-topline">
|
||
<div>
|
||
<div class="observation-mode-label" id="observation-universe">OBSERVATION</div>
|
||
<div class="observation-profile" id="observation-profile">ACTIVE PROFILE</div>
|
||
</div>
|
||
<div class="observation-status" id="observation-status">
|
||
OBSERVATION ACTIVE<br>
|
||
PROCEDURAL AUDIO LINK: STANDBY
|
||
</div>
|
||
</div>
|
||
|
||
<!-- Holographic Audio Waveform Sill -->
|
||
<div class="observation-waveform-container" id="observation-waveform-container">
|
||
<span class="observation-waveform-label">SUBSPACE HARMONICS</span>
|
||
<canvas id="observation-waveform-canvas" width="480" height="28"></canvas>
|
||
</div>
|
||
</div>
|
||
|
||
<!-- In-Observation Quick Glass Control Dock (Auto-hides on inactivity) -->
|
||
<div class="observation-control-dock" id="observation-control-dock">
|
||
<button class="obs-dock-btn" id="obs-btn-warp" title="Toggle Warp Flight / Orbital Cruise">WARP: OFF</button>
|
||
<button class="obs-dock-btn active" id="obs-btn-frame" title="Toggle Starship Viewport Framing">VIEWPORT: ON</button>
|
||
<button class="obs-dock-btn" id="obs-btn-pillars" title="Toggle Window Pillars / Mullions">PILLARS: OFF</button>
|
||
<button class="obs-dock-btn" id="obs-btn-alert" title="Toggle Red Alert">RED ALERT</button>
|
||
<select class="obs-dock-select" id="obs-select-preset" title="Switch Preset"></select>
|
||
<button class="obs-dock-btn obs-dock-close" id="obs-btn-exit" title="Return to Main Console">RETURN ✕</button>
|
||
</div>
|
||
|
||
<div class="observation-return" id="observation-return-pill">CLICK BACKGROUND TO RETURN</div>
|
||
</section>
|
||
|
||
<!-- LCARD Footer Status -->
|
||
<footer class="lcars-footer">
|
||
<span id="footer-status-label">SYSTEM STATUS: NORMAL</span>
|
||
<span><a href="https://www.labyricorn.com/" target="_blank" rel="noopener noreferrer" style="color:inherit;text-decoration:none;">VIBE ENGINEERED BY LABYRICORN STUDIOS</a></span>
|
||
<span id="footer-hotkeys-label">SPACE: PLAY/PAUSE | M: MUTE | ↑/↓: VOLUME</span>
|
||
</footer>
|
||
|
||
<!-- All-in-One Procedural Audio Engine & UI -->
|
||
<script src="js/audio.js"></script>
|
||
<script src="js/config.js"></script>
|
||
<script src="js/core-animations.js"></script>
|
||
<script src="js/visualizer.js"></script>
|
||
<script src="js/observation-bezels.js"></script>
|
||
<script src="js/observation-engine.js"></script>
|
||
<script src="js/midi.js"></script>
|
||
<script src="js/generative-experience.js"></script>
|
||
<script src="js/app.js"></script>
|
||
</body>
|
||
</html>
|