1408 lines
82 KiB
HTML
1408 lines
82 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="en">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<meta name="viewport" content="width=device-width, initial-scale=1">
|
||
<title>Tarot Time!</title>
|
||
<link rel="icon" href="data:,">
|
||
<link rel="stylesheet" href="node_modules/@toast-ui/calendar/dist/toastui-calendar.min.css?v=20260309-home-calendar-fix">
|
||
<link rel="stylesheet" href="node_modules/@fontsource/noto-sans-hebrew/hebrew-400.css">
|
||
<link rel="stylesheet" href="node_modules/@fontsource/noto-sans-hebrew/hebrew-700.css">
|
||
<link rel="stylesheet" href="node_modules/@fontsource/noto-serif/greek-400.css">
|
||
<link rel="stylesheet" href="node_modules/@fontsource/noto-serif/greek-700.css">
|
||
<link rel="stylesheet" href="node_modules/@fontsource/noto-serif/greek-ext-400.css">
|
||
<link rel="stylesheet" href="node_modules/@fontsource/noto-serif/greek-ext-700.css">
|
||
<link rel="stylesheet" href="node_modules/@fontsource/noto-sans-phoenician/phoenician-400.css">
|
||
<link rel="stylesheet" href="node_modules/@fontsource/amiri/arabic-400.css">
|
||
<link rel="stylesheet" href="node_modules/@fontsource/amiri/arabic-700.css">
|
||
<link rel="stylesheet" href="node_modules/@fontsource/noto-naskh-arabic/arabic-400.css">
|
||
<link rel="stylesheet" href="app/styles.css?v=20260603-detail-text-scale-01">
|
||
</head>
|
||
<body>
|
||
<div class="topbar">
|
||
<button id="open-home" class="topbar-home-button" type="button" aria-pressed="true">Tarot Time!</button>
|
||
<button id="topbar-menu-toggle" class="topbar-menu-toggle" type="button" aria-expanded="false" aria-controls="topbar-actions" aria-label="Open navigation menu">Menu</button>
|
||
<button id="open-settings" class="topbar-menu-toggle topbar-settings-toggle" type="button" aria-pressed="false">Settings</button>
|
||
<div id="topbar-actions" class="topbar-actions">
|
||
<div class="topbar-dropdown" aria-label="Alphabet menu">
|
||
<button id="open-alphabet" class="settings-trigger" type="button" aria-pressed="false" aria-haspopup="menu" aria-controls="alphabet-subpages" aria-expanded="false">Alphabet ▾</button>
|
||
<div id="alphabet-subpages" class="topbar-dropdown-menu" role="menu" aria-label="Alphabet subpages">
|
||
<button id="open-alphabet-word" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Word</button>
|
||
<button id="open-alphabet-letters" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Letter</button>
|
||
<button id="open-alphabet-text" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Text</button>
|
||
</div>
|
||
</div>
|
||
<div class="topbar-dropdown" aria-label="Astronomy menu">
|
||
<button id="open-astronomy" class="settings-trigger" type="button" aria-pressed="false" aria-haspopup="menu" aria-controls="astronomy-subpages" aria-expanded="false">Astronomy ▾</button>
|
||
<div id="astronomy-subpages" class="topbar-dropdown-menu" role="menu" aria-label="Astronomy subpages">
|
||
<button id="open-cycles" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Cycles</button>
|
||
<button id="open-natal" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Natal Chart</button>
|
||
<button id="open-planets" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Planet</button>
|
||
<button id="open-zodiac" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Zodiac</button>
|
||
</div>
|
||
</div>
|
||
<div class="topbar-dropdown" aria-label="Audio menu">
|
||
<button id="open-audio" class="settings-trigger" type="button" aria-pressed="false" aria-haspopup="menu" aria-controls="audio-subpages" aria-expanded="false">Audio ▾</button>
|
||
<div id="audio-subpages" class="topbar-dropdown-menu" role="menu" aria-label="Audio subpages">
|
||
<button id="open-audio-circle" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Circle</button>
|
||
<button id="open-audio-notes" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Notes</button>
|
||
</div>
|
||
</div>
|
||
<div class="topbar-dropdown" aria-label="Calendar menu">
|
||
<button id="open-calendar" class="settings-trigger" type="button" aria-pressed="false" aria-haspopup="menu" aria-controls="calendar-subpages" aria-expanded="false">Calendar ▾</button>
|
||
<div id="calendar-subpages" class="topbar-dropdown-menu" role="menu" aria-label="Calendar subpages">
|
||
<button id="open-holidays" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Holidays</button>
|
||
<button id="open-calendar-months" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Months</button>
|
||
<button id="open-calendar-timeline" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Timeline</button>
|
||
</div>
|
||
</div>
|
||
<button id="open-elements" class="settings-trigger" type="button" aria-pressed="false">Elements</button>
|
||
<button id="open-enochian" class="settings-trigger" type="button" aria-pressed="false">Enochian</button>
|
||
<button id="open-gods" class="settings-trigger" type="button" aria-pressed="false">Gods</button>
|
||
<button id="open-iching" class="settings-trigger" type="button" aria-pressed="false">I Ching</button>
|
||
<div class="topbar-dropdown" aria-label="Kabbalah menu">
|
||
<button id="open-kabbalah" class="settings-trigger" type="button" aria-pressed="false" aria-haspopup="menu" aria-controls="kabbalah-subpages" aria-expanded="false">Kabbalah ▾</button>
|
||
<div id="kabbalah-subpages" class="topbar-dropdown-menu" role="menu" aria-label="Kabbalah subpages">
|
||
<button id="open-kabbalah-sephirot" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Sefirot</button>
|
||
<button id="open-kabbalah-worlds" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Qabalistic Worlds</button>
|
||
<button id="open-kabbalah-paths" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Paths</button>
|
||
<button id="open-kabbalah-cross" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Rosicrucian Cross</button>
|
||
<button id="open-kabbalah-tree" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Tree</button>
|
||
<button id="open-kabbalah-cube" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Cube</button>
|
||
</div>
|
||
</div>
|
||
<button id="open-numbers" class="settings-trigger" type="button" aria-pressed="false">Numbers</button>
|
||
<button id="open-quiz" class="settings-trigger" type="button" aria-pressed="false">Quiz</button>
|
||
<div class="topbar-dropdown" aria-label="Tarot menu">
|
||
<button id="open-tarot" class="settings-trigger" type="button" aria-pressed="false" aria-haspopup="menu" aria-controls="tarot-subpages" aria-expanded="false">Tarot ▾</button>
|
||
<div id="tarot-subpages" class="topbar-dropdown-menu" role="menu" aria-label="Tarot subpages">
|
||
<button id="open-tarot-cards" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Cards</button>
|
||
<button id="open-tarot-spread" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Draw Spread</button>
|
||
<button id="open-tarot-frame" class="settings-trigger topbar-sub-trigger" type="button" role="menuitem">Frame</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div id="connection-gate" class="connection-gate" hidden>
|
||
<div class="connection-gate-card" role="dialog" aria-modal="true" aria-labelledby="connection-gate-title">
|
||
<div class="connection-gate-eyebrow">API Connection Required</div>
|
||
<h1 id="connection-gate-title" class="connection-gate-title">Connect TaroTime to its API</h1>
|
||
<p class="connection-gate-copy">This client stays in shell mode until it has a reachable API URL and, if required by the server, a valid API key.</p>
|
||
<div class="connection-gate-fields">
|
||
<label class="settings-field settings-field-full" for="connection-gate-base-url">API Base URL
|
||
<input id="connection-gate-base-url" type="url" inputmode="url" placeholder="http://localhost:3100">
|
||
</label>
|
||
<label class="settings-field settings-field-full" for="connection-gate-api-key">API Key
|
||
<input id="connection-gate-api-key" type="password" autocomplete="off" placeholder="Leave blank only if your API does not require a key">
|
||
</label>
|
||
</div>
|
||
<div id="connection-gate-status" class="connection-gate-status" aria-live="polite">Enter your API details to continue.</div>
|
||
<div class="connection-gate-actions">
|
||
<button id="connection-gate-connect" type="button">Save And Connect</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<section id="settings-section" hidden>
|
||
<div class="settings-page-shell">
|
||
<div class="settings-page-hero">
|
||
<div>
|
||
<div class="settings-page-eyebrow">Configuration</div>
|
||
<h1 class="settings-page-title">Settings</h1>
|
||
<p class="settings-page-copy">A dedicated page for app behavior, deck caching, and API connection settings. This stays scrollable and leaves room for more controls later.</p>
|
||
</div>
|
||
<button id="close-settings" class="settings-page-back" type="button">Back</button>
|
||
</div>
|
||
<div class="settings-page-layout">
|
||
<section id="settings-tarot-panel" class="settings-panel">
|
||
<div class="settings-panel-head">
|
||
<strong>Location And Time</strong>
|
||
<span>Controls calendar rendering, the Now panel, and optional sky background.</span>
|
||
</div>
|
||
<div class="settings-grid">
|
||
<label class="settings-field">Latitude
|
||
<input id="lat" type="number" step="0.0001" value="51.5074">
|
||
</label>
|
||
<label class="settings-field">Longitude
|
||
<input id="lng" type="number" step="0.0001" value="-0.1278">
|
||
</label>
|
||
<label class="settings-field settings-field-full">Time Format
|
||
<select id="time-format">
|
||
<option value="minutes" selected>Minutes (default)</option>
|
||
<option value="hours">Hours</option>
|
||
<option value="seconds">Seconds</option>
|
||
</select>
|
||
</label>
|
||
<label class="settings-field settings-field-full">Birth Date
|
||
<input id="birth-date" type="date">
|
||
</label>
|
||
</div>
|
||
<div class="settings-panel-actions">
|
||
<button id="use-location" type="button">Use My Location</button>
|
||
</div>
|
||
</section>
|
||
<section class="settings-panel">
|
||
<div class="settings-panel-head">
|
||
<strong>Tarot And Assets</strong>
|
||
<span>Choose the active deck and monitor local browser cache warmup for card images.</span>
|
||
</div>
|
||
<div class="settings-grid">
|
||
<label class="settings-field settings-field-full">Tarot Deck
|
||
<select id="tarot-deck">
|
||
<option value="ceremonial-magick" selected>Loading deck manifests...</option>
|
||
</select>
|
||
<div class="settings-cache-progress-wrap" aria-hidden="true">
|
||
<progress id="tarot-deck-cache-progress" class="settings-cache-progress" max="100" value="0"></progress>
|
||
<span id="tarot-deck-cache-progress-label" class="settings-cache-progress-label">0%</span>
|
||
</div>
|
||
<small id="tarot-deck-cache-status" class="settings-field-hint settings-cache-status" aria-live="polite">Deck cache idle.</small>
|
||
</label>
|
||
<label class="settings-field settings-field-full settings-toggle-field" for="stellarium-background">
|
||
<span>Stellarium Background</span>
|
||
<span class="settings-toggle-row">
|
||
<input id="stellarium-background" type="checkbox">
|
||
<span>Enable live sky background</span>
|
||
</span>
|
||
<small id="stellarium-background-hint" class="settings-field-hint">Enter a location or use My Location before enabling the live sky background.</small>
|
||
</label>
|
||
</div>
|
||
</section>
|
||
<section class="settings-panel settings-panel-wide">
|
||
<div class="settings-panel-head">
|
||
<strong>Detail Text</strong>
|
||
<span>Adjust the font size used by tarot detail panes and alphabet readers.</span>
|
||
</div>
|
||
<div class="settings-grid">
|
||
<label class="settings-field settings-field-full settings-range-field">Font Size
|
||
<div class="settings-range-row">
|
||
<input id="detail-text-scale" class="settings-range-input" type="range" min="85" max="135" step="5" value="100">
|
||
<span id="detail-text-scale-value" class="settings-range-value">100%</span>
|
||
</div>
|
||
<small class="settings-field-hint">Lower values fit more text; higher values make detail panes and alphabet content easier to read.</small>
|
||
</label>
|
||
</div>
|
||
</section>
|
||
<section class="settings-panel settings-panel-wide">
|
||
<div class="settings-panel-head">
|
||
<strong>API Connection</strong>
|
||
<span>Set the API base URL and key used by this client shell.</span>
|
||
</div>
|
||
<div class="settings-grid">
|
||
<label class="settings-field settings-field-full">API Base URL
|
||
<input id="api-base-url" type="url" inputmode="url" placeholder="http://localhost:3100">
|
||
</label>
|
||
<label class="settings-field settings-field-full">API Key
|
||
<input id="api-key" type="password" autocomplete="off" placeholder="Optional unless the API requires one">
|
||
</label>
|
||
</div>
|
||
<div id="api-connection-summary" class="settings-connection-summary" data-tone="neutral" aria-live="polite">
|
||
<div class="settings-connection-summary-row">
|
||
<span class="settings-connection-summary-label">Status</span>
|
||
<span id="api-connection-summary-state" class="settings-connection-summary-value">Not checked yet.</span>
|
||
</div>
|
||
<div class="settings-connection-summary-row">
|
||
<span class="settings-connection-summary-label">Client</span>
|
||
<span id="api-connection-summary-client" class="settings-connection-summary-value">No authenticated API identity.</span>
|
||
</div>
|
||
<div class="settings-connection-summary-row">
|
||
<span class="settings-connection-summary-label">Access</span>
|
||
<span id="api-connection-summary-access" class="settings-connection-summary-value">Unknown</span>
|
||
</div>
|
||
<div class="settings-connection-summary-row">
|
||
<span class="settings-connection-summary-label">Permissions</span>
|
||
<span id="api-connection-summary-permissions" class="settings-connection-summary-value">Save settings to validate this API key.</span>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
<div class="settings-actions settings-page-actions">
|
||
<div id="settings-page-status" class="settings-page-status" data-tone="neutral" aria-live="polite">
|
||
<span id="settings-page-status-text" class="settings-page-status-text">Settings ready.</span>
|
||
<span id="settings-page-status-time" class="settings-page-status-time" hidden></span>
|
||
</div>
|
||
<button id="save-settings" type="button">Save Settings</button>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section id="calendar-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong id="calendar-list-title">Calendar > Months</strong>
|
||
<span id="calendar-month-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="dataset-search-wrap" id="calendar-type-wrap">
|
||
<label for="calendar-type-select">Calendar System</label>
|
||
<select id="calendar-type-select" class="quiz-category-select" aria-label="Select calendar system">
|
||
<option value="gregorian">Gregorian Calendar</option>
|
||
<option value="hebrew">Hebrew Calendar</option>
|
||
<option value="islamic">Islamic Calendar</option>
|
||
<option value="wheel-of-year">Wheel of the Year</option>
|
||
</select>
|
||
</div>
|
||
<div class="dataset-search-wrap calendar-year-control" id="calendar-year-wrap">
|
||
<label for="calendar-year-input">Year for month facts</label>
|
||
<input id="calendar-year-input" type="number" min="1900" max="2500" step="1" value="2026">
|
||
</div>
|
||
<div class="dataset-search-wrap">
|
||
<input id="calendar-search-input" class="dataset-search-input" type="search" placeholder="Search months and events" aria-label="Search calendar months and events">
|
||
<button id="calendar-search-clear" class="dataset-search-clear" type="button" aria-label="Clear calendar search" disabled>×</button>
|
||
</div>
|
||
<div id="calendar-month-list" class="planet-card-list" role="listbox" aria-label="Calendar months"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="calendar-detail-name">--</h2>
|
||
<div id="calendar-detail-sub" class="planet-detail-type">Select a month to explore</div>
|
||
<div class="detail-sequence-nav" aria-label="Browse months">
|
||
<button id="calendar-detail-prev" class="detail-sequence-btn" type="button" aria-label="Previous month">Back</button>
|
||
<div id="calendar-detail-position" class="detail-sequence-position" aria-live="polite">--</div>
|
||
<button id="calendar-detail-next" class="detail-sequence-btn" type="button" aria-label="Next month">Next</button>
|
||
</div>
|
||
</div>
|
||
<div id="calendar-detail-body"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
<section id="holiday-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Holiday Repository</strong>
|
||
<span id="holiday-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="dataset-search-wrap calendar-holiday-filter">
|
||
<label for="holiday-source-select">Holiday Source</label>
|
||
<select id="holiday-source-select" class="quiz-category-select" aria-label="Filter holidays by source calendar">
|
||
<option value="all">All Calendars</option>
|
||
<option value="gregorian">Gregorian</option>
|
||
<option value="hebrew">Hebrew</option>
|
||
<option value="islamic">Islamic</option>
|
||
<option value="wheel-of-year">Wheel of the Year</option>
|
||
</select>
|
||
</div>
|
||
<div class="dataset-search-wrap calendar-year-control">
|
||
<label for="holiday-year-input">Reference Year</label>
|
||
<input id="holiday-year-input" type="number" min="1900" max="2500" step="1" value="2026">
|
||
</div>
|
||
<div class="dataset-search-wrap">
|
||
<input id="holiday-search-input" class="dataset-search-input" type="search" placeholder="Search holidays, calendars, date equivalents" aria-label="Search holiday repository">
|
||
<button id="holiday-search-clear" class="dataset-search-clear" type="button" aria-label="Clear holiday search" disabled>×</button>
|
||
</div>
|
||
<div id="holiday-list" class="planet-card-list" role="listbox" aria-label="Holidays"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="holiday-detail-name">--</h2>
|
||
<div id="holiday-detail-sub" class="planet-detail-type">Select a holiday to explore</div>
|
||
<div class="detail-sequence-nav" aria-label="Browse holidays">
|
||
<button id="holiday-detail-prev" class="detail-sequence-btn" type="button" aria-label="Previous holiday">Back</button>
|
||
<div id="holiday-detail-position" class="detail-sequence-position" aria-live="polite">--</div>
|
||
<button id="holiday-detail-next" class="detail-sequence-btn" type="button" aria-label="Next holiday">Next</button>
|
||
</div>
|
||
</div>
|
||
<div id="holiday-detail-body"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
<section id="tarot-section" hidden>
|
||
<div id="tarot-browse-view">
|
||
<div class="tarot-layout">
|
||
<aside class="tarot-list-panel">
|
||
<div class="tarot-list-header">
|
||
<strong>Tarot Database</strong>
|
||
<span id="tarot-card-count" class="tarot-list-count">--</span>
|
||
</div>
|
||
<div class="dataset-search-wrap">
|
||
<input id="tarot-search-input" class="dataset-search-input" type="search" placeholder="Search cards, keywords, relations" aria-label="Search tarot cards">
|
||
<button id="tarot-search-clear" class="dataset-search-clear" type="button" aria-label="Clear tarot search" disabled>×</button>
|
||
</div>
|
||
<div id="tarot-card-list" class="tarot-card-list" role="listbox" aria-label="Tarot cards"></div>
|
||
</aside>
|
||
<section class="tarot-detail-panel" aria-live="polite">
|
||
<div class="tarot-detail-top">
|
||
<div class="tarot-detail-heading">
|
||
<h2 id="tarot-detail-name">--</h2>
|
||
<div id="tarot-detail-type" class="tarot-detail-type">--</div>
|
||
<div class="detail-sequence-nav" aria-label="Browse tarot cards">
|
||
<button id="tarot-detail-prev" class="detail-sequence-btn" type="button" aria-label="Previous tarot card">Back</button>
|
||
<div id="tarot-detail-position" class="detail-sequence-position" aria-live="polite">--</div>
|
||
<button id="tarot-detail-next" class="detail-sequence-btn" type="button" aria-label="Next tarot card">Next</button>
|
||
</div>
|
||
<div id="tarot-detail-summary" class="tarot-detail-summary">--</div>
|
||
</div>
|
||
</div>
|
||
<div class="tarot-meanings">
|
||
<div class="tarot-meaning-card">
|
||
<strong>Upright</strong>
|
||
<div id="tarot-detail-upright">--</div>
|
||
</div>
|
||
<div class="tarot-meaning-card">
|
||
<strong>Reversed</strong>
|
||
<div id="tarot-detail-reversed">--</div>
|
||
</div>
|
||
</div>
|
||
<div class="tarot-meta-grid">
|
||
<div id="tarot-meta-deck-gallery-card" class="tarot-meta-card tarot-deck-gallery-card" hidden>
|
||
<strong>Deck Variants</strong>
|
||
<div id="tarot-detail-deck-gallery" class="tarot-deck-gallery"></div>
|
||
</div>
|
||
<div id="tarot-meta-meaning-card" class="tarot-meta-card" hidden>
|
||
<strong>Traditional Meaning</strong>
|
||
<div id="tarot-detail-meaning" class="planet-text">--</div>
|
||
</div>
|
||
<div class="tarot-meta-card">
|
||
<strong>Keywords</strong>
|
||
<div id="tarot-detail-keywords" class="tarot-keywords"></div>
|
||
</div>
|
||
<div id="tarot-meta-planet-card" class="tarot-meta-card" hidden>
|
||
<strong>Planet</strong>
|
||
<ul id="tarot-detail-planet" class="tarot-relations"></ul>
|
||
</div>
|
||
<div id="tarot-meta-element-card" class="tarot-meta-card" hidden>
|
||
<strong>Element</strong>
|
||
<ul id="tarot-detail-element" class="tarot-relations"></ul>
|
||
</div>
|
||
<div id="tarot-meta-tetragrammaton-card" class="tarot-meta-card" hidden>
|
||
<strong>Tetragrammaton</strong>
|
||
<ul id="tarot-detail-tetragrammaton" class="tarot-relations"></ul>
|
||
</div>
|
||
<div id="tarot-meta-zodiac-card" class="tarot-meta-card" hidden>
|
||
<strong>Zodiac</strong>
|
||
<ul id="tarot-detail-zodiac" class="tarot-relations"></ul>
|
||
</div>
|
||
<div id="tarot-meta-courtdate-card" class="tarot-meta-card" hidden>
|
||
<strong>Court Date Window</strong>
|
||
<ul id="tarot-detail-courtdate" class="tarot-relations"></ul>
|
||
</div>
|
||
<div id="tarot-meta-hebrew-card" class="tarot-meta-card" hidden>
|
||
<strong>Hebrew Letter</strong>
|
||
<ul id="tarot-detail-hebrew" class="tarot-relations"></ul>
|
||
</div>
|
||
<div id="tarot-meta-cube-card" class="tarot-meta-card" hidden>
|
||
<strong>Cube of Space</strong>
|
||
<ul id="tarot-detail-cube" class="tarot-relations"></ul>
|
||
</div>
|
||
<div id="tarot-meta-iching-card" class="tarot-meta-card" hidden>
|
||
<strong>I Ching</strong>
|
||
<ul id="tarot-detail-iching" class="tarot-relations"></ul>
|
||
</div>
|
||
<div id="tarot-meta-calendar-card" class="tarot-meta-card" hidden>
|
||
<strong>Calendar Months</strong>
|
||
<ul id="tarot-detail-calendar" class="tarot-relations"></ul>
|
||
</div>
|
||
</div>
|
||
<div id="tarot-kab-path" class="tarot-kab-path-card" hidden></div>
|
||
</section>
|
||
</div>
|
||
</div>
|
||
<div id="tarot-spread-view" hidden>
|
||
<div class="tarot-spread-toolbar">
|
||
<button id="tarot-spread-back" class="tarot-spread-back-btn" type="button">← Card Browser</button>
|
||
<div class="tarot-spread-type-controls" role="group" aria-label="Spread type">
|
||
<button id="tarot-spread-btn-three" class="tarot-spread-type-btn" type="button">3 Card</button>
|
||
<button id="tarot-spread-btn-celtic" class="tarot-spread-type-btn" type="button">Celtic Cross</button>
|
||
</div>
|
||
<button id="tarot-spread-reveal-all" class="tarot-spread-redraw-btn" type="button">Reveal All</button>
|
||
<button id="tarot-spread-redraw" class="tarot-spread-redraw-btn" type="button">⟳ Redraw</button>
|
||
</div>
|
||
<div id="tarot-spread-meanings" class="tarot-spread-meanings" aria-live="polite"></div>
|
||
<div id="tarot-spread-board" class="tarot-spread-board" aria-live="polite"></div>
|
||
</div>
|
||
</section>
|
||
<section id="tarot-frame-section" hidden>
|
||
<div id="tarot-frame-view" class="tarot-frame-view">
|
||
<div class="tarot-frame-shell">
|
||
<div class="tarot-frame-header">
|
||
<div>
|
||
<h2 class="tarot-frame-title">Tarot Frame</h2>
|
||
<p class="tarot-frame-copy">Arrange all 78 tarot cards inside one master 14x14 grid, then switch between the Frames and House of Cards presets without leaving the page. On desktop, Ctrl/Cmd-click builds a multi-card selection and dragging any selected card moves the whole group. On touch screens, long-press a card and choose Select Multiple, then drag any selected card to move the set; two-finger pan still moves around the board. Use Full Screen when you want an uncluttered board view for panning and placement.</p>
|
||
</div>
|
||
<div class="tarot-frame-actions">
|
||
<button id="tarot-frame-selection-chip" class="tarot-frame-selection-chip" type="button" hidden>0 Selected</button>
|
||
<button id="tarot-frame-pan-toggle" class="tarot-frame-action-btn" type="button" aria-pressed="false">Pan Grid</button>
|
||
<button id="tarot-frame-focus-toggle" class="tarot-frame-action-btn" type="button" aria-pressed="false">Full Screen</button>
|
||
<button id="tarot-frame-settings-toggle" class="tarot-frame-action-btn tarot-frame-settings-toggle" type="button" aria-haspopup="dialog" aria-expanded="false" aria-controls="tarot-frame-settings-panel">Settings</button>
|
||
<button id="tarot-frame-layout-toggle" class="tarot-frame-action-btn" type="button" aria-haspopup="menu" aria-expanded="false" aria-controls="tarot-frame-layout-panel">Layout: Frames</button>
|
||
<div id="tarot-frame-layout-panel" class="tarot-frame-layout-panel" role="menu" aria-label="Tarot Frame layouts" hidden>
|
||
<button class="tarot-frame-layout-option" type="button" data-layout-preset-id="frames" role="menuitemradio" aria-checked="true">
|
||
<strong>Frames</strong>
|
||
<span>The current master frame with top-row extras and nested chronological rings.</span>
|
||
</button>
|
||
<button class="tarot-frame-layout-option" type="button" data-layout-preset-id="house" role="menuitemradio" aria-checked="false">
|
||
<strong>House of Cards</strong>
|
||
<span>The legacy house composition rebuilt inside the 18x18 snap grid.</span>
|
||
</button>
|
||
</div>
|
||
<div id="tarot-frame-settings-panel" class="tarot-frame-settings-panel" role="dialog" aria-label="Tarot Frame settings" hidden>
|
||
<label class="tarot-frame-field" for="tarot-frame-grid-zoom">
|
||
<span>Grid Zoom</span>
|
||
<select id="tarot-frame-grid-zoom">
|
||
<option value="0">100%</option>
|
||
<option value="1">120%</option>
|
||
<option value="2">140%</option>
|
||
<option value="3">170%</option>
|
||
<option value="4">200%</option>
|
||
<option value="5">240%</option>
|
||
<option value="6">300%</option>
|
||
<option value="7">360%</option>
|
||
<option value="8">420%</option>
|
||
<option value="9">520%</option>
|
||
<option value="10">640%</option>
|
||
<option value="11">800%</option>
|
||
<option value="12">1000%</option>
|
||
<option value="13">1200%</option>
|
||
<option value="14">1400%</option>
|
||
</select>
|
||
</label>
|
||
<label class="tarot-frame-toggle" for="tarot-frame-show-info">
|
||
<input id="tarot-frame-show-info" type="checkbox" checked>
|
||
<span>Display Info</span>
|
||
</label>
|
||
<div id="tarot-frame-house-settings" class="tarot-frame-settings-group">
|
||
<div class="tarot-frame-settings-heading">Card Display Settings</div>
|
||
<div class="tarot-frame-settings-note">These controls apply to every Frame layout. Top settings affect major arcana, and lower settings affect minor and court cards.</div>
|
||
<label class="tarot-frame-toggle" for="tarot-frame-house-top-cards-visible">
|
||
<input id="tarot-frame-house-top-cards-visible" type="checkbox" checked>
|
||
<span>Show top card images</span>
|
||
</label>
|
||
<div class="tarot-frame-settings-subheading">Top Info</div>
|
||
<div class="tarot-frame-checkbox-grid">
|
||
<label class="tarot-frame-check" for="tarot-frame-house-top-info-hebrew"><input id="tarot-frame-house-top-info-hebrew" type="checkbox" checked><span>Hebrew</span></label>
|
||
<label class="tarot-frame-check" for="tarot-frame-house-top-info-planet"><input id="tarot-frame-house-top-info-planet" type="checkbox" checked><span>Planet</span></label>
|
||
<label class="tarot-frame-check" for="tarot-frame-house-top-info-zodiac"><input id="tarot-frame-house-top-info-zodiac" type="checkbox" checked><span>Zodiac</span></label>
|
||
<label class="tarot-frame-check" for="tarot-frame-house-top-info-trump"><input id="tarot-frame-house-top-info-trump" type="checkbox" checked><span>Trump</span></label>
|
||
<label class="tarot-frame-check" for="tarot-frame-house-top-info-path"><input id="tarot-frame-house-top-info-path" type="checkbox" checked><span>Path</span></label>
|
||
<label class="tarot-frame-check" for="tarot-frame-house-top-info-date"><input id="tarot-frame-house-top-info-date" type="checkbox"><span>Date</span></label>
|
||
</div>
|
||
<label class="tarot-frame-toggle" for="tarot-frame-house-bottom-cards-visible">
|
||
<input id="tarot-frame-house-bottom-cards-visible" type="checkbox" checked>
|
||
<span>Show lower card images</span>
|
||
</label>
|
||
<div class="tarot-frame-settings-subheading">Lower Info</div>
|
||
<div class="tarot-frame-checkbox-grid">
|
||
<label class="tarot-frame-check" for="tarot-frame-house-bottom-info-zodiac"><input id="tarot-frame-house-bottom-info-zodiac" type="checkbox" checked><span>Zodiac</span></label>
|
||
<label class="tarot-frame-check" for="tarot-frame-house-bottom-info-decan"><input id="tarot-frame-house-bottom-info-decan" type="checkbox" checked><span>Decan</span></label>
|
||
<label class="tarot-frame-check" for="tarot-frame-house-bottom-info-month"><input id="tarot-frame-house-bottom-info-month" type="checkbox" checked><span>Month</span></label>
|
||
<label class="tarot-frame-check" for="tarot-frame-house-bottom-info-ruler"><input id="tarot-frame-house-bottom-info-ruler" type="checkbox" checked><span>Ruler</span></label>
|
||
<label class="tarot-frame-check" for="tarot-frame-house-bottom-info-date"><input id="tarot-frame-house-bottom-info-date" type="checkbox"><span>Date</span></label>
|
||
</div>
|
||
</div>
|
||
<div class="tarot-frame-settings-actions">
|
||
<button id="tarot-frame-clear-grid" class="tarot-frame-action-btn tarot-frame-clear-btn" type="button">Clear Grid</button>
|
||
<button id="tarot-frame-export-webp" class="tarot-frame-action-btn tarot-frame-export-btn" type="button">Export WebP</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<div id="tarot-frame-overview" class="tarot-frame-overview-host"></div>
|
||
<div id="tarot-frame-status" class="tarot-frame-status" aria-live="polite">Loading tarot cards...</div>
|
||
<button id="tarot-frame-focus-exit" class="tarot-frame-focus-exit" type="button" hidden>Exit Full Screen</button>
|
||
<div id="tarot-frame-board" class="tarot-frame-board-grid"></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
<section id="tarot-house-section" hidden>
|
||
<div id="tarot-house-view" class="tarot-house-view">
|
||
<section class="tarot-misc-section tarot-section-house-top tarot-section-house-page" aria-label="Tarot house of cards">
|
||
<div class="tarot-meta-card tarot-house-card">
|
||
<div class="tarot-house-card-head">
|
||
<strong>House of Cards</strong>
|
||
<div class="tarot-house-card-actions">
|
||
<button id="tarot-house-settings-toggle" class="tarot-house-action-btn tarot-house-settings-toggle" type="button" aria-haspopup="dialog" aria-expanded="false" aria-controls="tarot-house-settings-panel">Settings</button>
|
||
</div>
|
||
<div id="tarot-house-settings-panel" class="tarot-house-settings-panel" role="dialog" aria-label="House of Cards settings" hidden>
|
||
<label class="tarot-house-toggle" for="tarot-house-top-cards-visible">
|
||
<input id="tarot-house-top-cards-visible" type="checkbox" checked>
|
||
<span>Show Top Cards</span>
|
||
</label>
|
||
<fieldset class="tarot-house-filter-group">
|
||
<legend>Top Info</legend>
|
||
<label class="tarot-house-mini-toggle" for="tarot-house-top-info-hebrew">
|
||
<input id="tarot-house-top-info-hebrew" type="checkbox" checked>
|
||
<span>Hebrew</span>
|
||
</label>
|
||
<label class="tarot-house-mini-toggle" for="tarot-house-top-info-planet">
|
||
<input id="tarot-house-top-info-planet" type="checkbox" checked>
|
||
<span>Planet</span>
|
||
</label>
|
||
<label class="tarot-house-mini-toggle" for="tarot-house-top-info-zodiac">
|
||
<input id="tarot-house-top-info-zodiac" type="checkbox" checked>
|
||
<span>Zodiac</span>
|
||
</label>
|
||
<label class="tarot-house-mini-toggle" for="tarot-house-top-info-trump">
|
||
<input id="tarot-house-top-info-trump" type="checkbox" checked>
|
||
<span>Trump</span>
|
||
</label>
|
||
<label class="tarot-house-mini-toggle" for="tarot-house-top-info-path">
|
||
<input id="tarot-house-top-info-path" type="checkbox" checked>
|
||
<span>Path</span>
|
||
</label>
|
||
<label class="tarot-house-mini-toggle" for="tarot-house-top-info-date">
|
||
<input id="tarot-house-top-info-date" type="checkbox">
|
||
<span>Date</span>
|
||
</label>
|
||
</fieldset>
|
||
<label class="tarot-house-toggle" for="tarot-house-bottom-cards-visible">
|
||
<input id="tarot-house-bottom-cards-visible" type="checkbox" checked>
|
||
<span>Show Bottom Cards</span>
|
||
</label>
|
||
<fieldset class="tarot-house-filter-group">
|
||
<legend>Bottom Info</legend>
|
||
<label class="tarot-house-mini-toggle" for="tarot-house-bottom-info-zodiac">
|
||
<input id="tarot-house-bottom-info-zodiac" type="checkbox" checked>
|
||
<span>Sign</span>
|
||
</label>
|
||
<label class="tarot-house-mini-toggle" for="tarot-house-bottom-info-decan">
|
||
<input id="tarot-house-bottom-info-decan" type="checkbox" checked>
|
||
<span>Decan</span>
|
||
</label>
|
||
<label class="tarot-house-mini-toggle" for="tarot-house-bottom-info-month">
|
||
<input id="tarot-house-bottom-info-month" type="checkbox" checked>
|
||
<span>Month</span>
|
||
</label>
|
||
<label class="tarot-house-mini-toggle" for="tarot-house-bottom-info-ruler">
|
||
<input id="tarot-house-bottom-info-ruler" type="checkbox" checked>
|
||
<span>Ruler</span>
|
||
</label>
|
||
<label class="tarot-house-mini-toggle" for="tarot-house-bottom-info-date">
|
||
<input id="tarot-house-bottom-info-date" type="checkbox">
|
||
<span>Date</span>
|
||
</label>
|
||
</fieldset>
|
||
<button id="tarot-house-export-webp" class="tarot-house-action-btn" type="button">Export WebP</button>
|
||
</div>
|
||
</div>
|
||
<div id="tarot-house-of-cards" class="tarot-house-layout" aria-live="polite"></div>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
<section id="planet-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Planet Database</strong>
|
||
<span id="planet-card-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="dataset-search-wrap">
|
||
<input id="planet-search-input" class="dataset-search-input" type="search" placeholder="Search planets, class, correspondence" aria-label="Search planets">
|
||
<button id="planet-search-clear" class="dataset-search-clear" type="button" aria-label="Clear planet search" disabled>×</button>
|
||
</div>
|
||
<div id="planet-card-list" class="planet-card-list" role="listbox" aria-label="Planets"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="planet-detail-name">--</h2>
|
||
<div id="planet-detail-type" class="planet-detail-type">--</div>
|
||
<div class="detail-sequence-nav" aria-label="Browse planets">
|
||
<button id="planet-detail-prev" class="detail-sequence-btn" type="button" aria-label="Previous planet">Back</button>
|
||
<div id="planet-detail-position" class="detail-sequence-position" aria-live="polite">--</div>
|
||
<button id="planet-detail-next" class="detail-sequence-btn" type="button" aria-label="Next planet">Next</button>
|
||
</div>
|
||
<div id="planet-detail-summary" class="planet-detail-summary">--</div>
|
||
</div>
|
||
<div class="planet-meta-grid">
|
||
<div class="planet-meta-card">
|
||
<strong>Science Facts</strong>
|
||
<div id="planet-detail-facts" class="planet-facts-list"></div>
|
||
</div>
|
||
<div class="planet-meta-card">
|
||
<strong>Atmosphere</strong>
|
||
<p id="planet-detail-atmosphere" class="planet-text">--</p>
|
||
</div>
|
||
<div class="planet-meta-card">
|
||
<strong>Notable Facts</strong>
|
||
<ul id="planet-detail-notable" class="planet-notes"></ul>
|
||
</div>
|
||
<div class="planet-meta-card">
|
||
<strong>Tarot / Weekday Relation</strong>
|
||
<div id="planet-detail-correspondence" class="planet-text">--</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
<section id="cycles-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Cycles Dataset</strong>
|
||
<span id="cycles-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="dataset-search-wrap">
|
||
<input id="cycles-search-input" class="dataset-search-input" type="search" placeholder="Search cycles, periods, categories" aria-label="Search astronomy cycles">
|
||
<button id="cycles-search-clear" class="dataset-search-clear" type="button" aria-label="Clear cycles search" disabled>×</button>
|
||
</div>
|
||
<div id="cycles-list" class="planet-card-list" role="listbox" aria-label="Astronomy cycles"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="cycles-detail-name">--</h2>
|
||
<div id="cycles-detail-type" class="planet-detail-type">Select a cycle to explore</div>
|
||
<div id="cycles-detail-summary" class="planet-detail-summary">--</div>
|
||
</div>
|
||
<div id="cycles-detail-body" class="planet-meta-grid"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
<section id="elements-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Classical Elements</strong>
|
||
<span id="elements-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="dataset-search-wrap">
|
||
<input id="elements-search-input" class="dataset-search-input" type="search" placeholder="Search elements, symbols, tarot ace" aria-label="Search classical elements">
|
||
<button id="elements-search-clear" class="dataset-search-clear" type="button" aria-label="Clear elements search" disabled>×</button>
|
||
</div>
|
||
<div id="elements-list" class="planet-card-list" role="listbox" aria-label="Classical elements"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="elements-detail-name">--</h2>
|
||
<div id="elements-detail-sub" class="planet-detail-type">Select an element to explore</div>
|
||
</div>
|
||
<div id="elements-detail-body"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
<section id="audio-notes-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Audio > Notes</strong>
|
||
<span id="audio-note-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="audio-note-intro planet-text">Browse the 12 equal-tempered pitch classes with reference frequencies anchored to A4 = 440 Hz.</div>
|
||
<div class="dataset-search-wrap">
|
||
<input id="audio-note-search-input" class="dataset-search-input" type="search" placeholder="Search note names, aliases, intervals" aria-label="Search audio notes">
|
||
<button id="audio-note-search-clear" class="dataset-search-clear" type="button" aria-label="Clear audio note search" disabled>×</button>
|
||
</div>
|
||
<div id="audio-note-list" class="planet-card-list" role="listbox" aria-label="Audio notes"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="audio-note-detail-name">--</h2>
|
||
<div id="audio-note-detail-sub" class="planet-detail-type">Select a note to explore</div>
|
||
<div id="audio-note-detail-summary" class="planet-detail-summary">--</div>
|
||
</div>
|
||
<div id="audio-note-detail-body" class="audio-note-detail-stack"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
<section id="audio-circle-section" hidden>
|
||
<div class="audio-circle-layout">
|
||
<aside class="audio-circle-stage-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Audio > Circle</strong>
|
||
<span class="planet-list-count">12 Keys</span>
|
||
</div>
|
||
<div class="audio-circle-intro planet-text">The Circle of Fifths orders keys by perfect fifth motion. Tap any key to hear its tonic and inspect its clockwise and counter-clockwise neighbors.</div>
|
||
<div id="audio-circle-stage" class="audio-circle-stage" aria-label="Circle of Fifths"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel audio-circle-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="audio-circle-detail-name">Circle of Fifths</h2>
|
||
<div id="audio-circle-detail-sub" class="planet-detail-type">Select a key to explore its tonic, relative minor, and neighbors</div>
|
||
<div id="audio-circle-detail-summary" class="planet-detail-summary">--</div>
|
||
</div>
|
||
<div id="audio-circle-detail-body" class="audio-circle-detail-stack"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
<section id="iching-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>I Ching Database</strong>
|
||
<span id="iching-card-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="dataset-search-wrap">
|
||
<input id="iching-search-input" class="dataset-search-input" type="search" placeholder="Search hexagrams, trigrams, keywords" aria-label="Search I Ching hexagrams">
|
||
<button id="iching-search-clear" class="dataset-search-clear" type="button" aria-label="Clear I Ching search" disabled>×</button>
|
||
</div>
|
||
<div id="iching-card-list" class="planet-card-list" role="listbox" aria-label="I Ching hexagrams"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="iching-detail-name">--</h2>
|
||
<div id="iching-detail-type" class="planet-detail-type">--</div>
|
||
<div id="iching-detail-summary" class="planet-detail-summary">--</div>
|
||
</div>
|
||
<div class="planet-meta-grid">
|
||
<div class="planet-meta-card">
|
||
<strong>Oracle Text</strong>
|
||
<p id="iching-detail-judgement" class="planet-text">--</p>
|
||
<p id="iching-detail-image" class="planet-text">--</p>
|
||
</div>
|
||
<div class="planet-meta-card">
|
||
<strong>Binary Pattern</strong>
|
||
<p id="iching-detail-binary" class="planet-text">--</p>
|
||
<div id="iching-detail-line" class="iching-diagram">--</div>
|
||
</div>
|
||
<div class="planet-meta-card">
|
||
<strong>Keywords</strong>
|
||
<div id="iching-detail-keywords" class="tarot-keywords"></div>
|
||
</div>
|
||
<div class="planet-meta-card">
|
||
<strong>Planetary Influence</strong>
|
||
<p id="iching-detail-planet" class="planet-text">--</p>
|
||
</div>
|
||
<div class="planet-meta-card">
|
||
<strong>Tarot Correspondences</strong>
|
||
<div id="iching-detail-tarot" class="planet-text iching-tarot-text">--</div>
|
||
</div>
|
||
<div class="planet-meta-card">
|
||
<strong>Calendar Months</strong>
|
||
<div id="iching-detail-calendar" class="alpha-nav-btns"></div>
|
||
</div>
|
||
<div class="planet-meta-card">
|
||
<strong>Trigrams</strong>
|
||
<div id="iching-detail-trigrams" class="iching-trigram-grid"></div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="astronomy-section" hidden>
|
||
<div class="kabbalah-placeholder">
|
||
<div class="kabbalah-placeholder-card">
|
||
<strong>Astronomy</strong>
|
||
<div class="planet-text">This Astronomy landing page is intentionally blank for now. Use the Astronomy menu to open Planet, Zodiac, or Natal Chart.</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="natal-section" hidden>
|
||
<div class="kabbalah-placeholder">
|
||
<div class="kabbalah-placeholder-card">
|
||
<strong>Natal Chart</strong>
|
||
<div class="planet-text">Natal chart scaffolding and anchor summary.</div>
|
||
<pre id="natal-chart-summary" class="planet-text natal-chart-summary">Natal Chart Scaffold: --</pre>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="quiz-section" hidden>
|
||
<div class="quiz-layout">
|
||
<div class="quiz-card">
|
||
<div class="planet-detail-heading">
|
||
<h2>Correspondence Quiz</h2>
|
||
<div class="planet-detail-type">Random correspondence questions with real-value options only</div>
|
||
</div>
|
||
<div class="quiz-toolbar">
|
||
<label class="quiz-category-label" for="quiz-category">Category</label>
|
||
<select id="quiz-category" class="quiz-category-select" aria-label="Quiz category">
|
||
<option value="random">Random</option>
|
||
<option value="all">All</option>
|
||
</select>
|
||
<label class="quiz-difficulty-label" for="quiz-difficulty">Difficulty</label>
|
||
<select id="quiz-difficulty" class="quiz-difficulty-select" aria-label="Quiz difficulty">
|
||
<option value="easy">Easy</option>
|
||
<option value="normal" selected>Normal</option>
|
||
<option value="hard">Hard</option>
|
||
</select>
|
||
</div>
|
||
<div class="quiz-score-grid" aria-live="polite">
|
||
<div class="quiz-score-item">
|
||
<div class="quiz-score-label">Correct</div>
|
||
<div id="quiz-score-correct" class="quiz-score-value">0</div>
|
||
</div>
|
||
<div class="quiz-score-item">
|
||
<div class="quiz-score-label">Answered</div>
|
||
<div id="quiz-score-answered" class="quiz-score-value">0</div>
|
||
</div>
|
||
<div class="quiz-score-item">
|
||
<div class="quiz-score-label">Accuracy</div>
|
||
<div id="quiz-score-accuracy" class="quiz-score-value">0%</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
|
||
<div class="quiz-card" aria-live="polite">
|
||
<div id="quiz-question-type" class="planet-detail-type">--</div>
|
||
<p id="quiz-question" class="quiz-question">Loading question…</p>
|
||
<div id="quiz-options" class="quiz-options"></div>
|
||
<div id="quiz-feedback" class="planet-text">Choose the best answer.</div>
|
||
<div class="quiz-actions">
|
||
<button id="quiz-reset" class="settings-trigger" type="button">Reset Score</button>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="kabbalah-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Sefirot</strong>
|
||
<span id="kab-browser-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="kab-browser-intro planet-text">Browse the 11 sefiroth, including Daath, in a dedicated detail browser. Use Paths for the Rosicrucian Cross and Tree for the diagram.</div>
|
||
<div id="kab-browser-list" class="planet-card-list" role="listbox" aria-label="Kabbalah sefirot"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="kab-browser-detail-name">Kabbalah Sefirot</h2>
|
||
<div id="kab-browser-detail-sub" class="planet-detail-type">Select a sephira or path to explore</div>
|
||
<div class="detail-sequence-nav" aria-label="Browse Kabbalah sefirot">
|
||
<button id="kab-browser-detail-prev" class="detail-sequence-btn" type="button" aria-label="Previous Kabbalah sephirah">Back</button>
|
||
<div id="kab-browser-detail-position" class="detail-sequence-position" aria-live="polite">--</div>
|
||
<button id="kab-browser-detail-next" class="detail-sequence-btn" type="button" aria-label="Next Kabbalah sephirah">Next</button>
|
||
</div>
|
||
</div>
|
||
<div id="kab-browser-detail-body" class="planet-meta-grid"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="kabbalah-worlds-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Qabalistic Worlds</strong>
|
||
<span id="kab-worlds-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="kab-browser-intro planet-text">Browse the four Qabalistic Worlds and their corresponding soul layers as a dedicated page.</div>
|
||
<div id="kab-worlds-list" class="planet-card-list" role="listbox" aria-label="Qabalistic worlds"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="kab-worlds-detail-name">Qabalistic Worlds</h2>
|
||
<div id="kab-worlds-detail-sub" class="planet-detail-type">Select a world layer to explore</div>
|
||
<div class="detail-sequence-nav" aria-label="Browse Qabalistic Worlds">
|
||
<button id="kab-worlds-detail-prev" class="detail-sequence-btn" type="button" aria-label="Previous Qabalistic world">Back</button>
|
||
<div id="kab-worlds-detail-position" class="detail-sequence-position" aria-live="polite">--</div>
|
||
<button id="kab-worlds-detail-next" class="detail-sequence-btn" type="button" aria-label="Next Qabalistic world">Next</button>
|
||
</div>
|
||
</div>
|
||
<div id="kab-worlds-detail-body" class="planet-meta-grid"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="kabbalah-paths-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Paths</strong>
|
||
<span id="kab-paths-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="kab-browser-intro planet-text">Browse the 22 Hebrew letter paths as their own entry page. Use Rosicrucian Cross for the petal view.</div>
|
||
<div id="kab-paths-list" class="planet-card-list" role="listbox" aria-label="Kabbalah paths"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="kab-paths-detail-name">Kabbalah Paths</h2>
|
||
<div id="kab-paths-detail-sub" class="planet-detail-type">Select a path to explore</div>
|
||
<div class="detail-sequence-nav" aria-label="Browse Kabbalah paths">
|
||
<button id="kab-paths-detail-prev" class="detail-sequence-btn" type="button" aria-label="Previous Kabbalah path">Back</button>
|
||
<div id="kab-paths-detail-position" class="detail-sequence-position" aria-live="polite">--</div>
|
||
<button id="kab-paths-detail-next" class="detail-sequence-btn" type="button" aria-label="Next Kabbalah path">Next</button>
|
||
</div>
|
||
</div>
|
||
<div id="kab-paths-detail-body" class="planet-meta-grid"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="kabbalah-cross-section" hidden>
|
||
<div class="kab-rose-layout">
|
||
<aside class="kab-rose-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Rosicrucian Cross</strong>
|
||
<span class="planet-list-count">22 Hebrew Letter Petals</span>
|
||
</div>
|
||
<div class="kab-rose-intro planet-text">Browse the Rosicrucian Cross as its own page. Click a Hebrew letter petal to explore the linked path from the cross view.</div>
|
||
<div id="kab-rose-cross-container" class="kab-rose-cross-container"></div>
|
||
</aside>
|
||
<section class="kab-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="kab-rose-detail-name">Rosicrucian Cross</h2>
|
||
<div id="kab-rose-detail-sub" class="planet-detail-type">Select a Hebrew letter petal to explore the path</div>
|
||
<div class="detail-sequence-nav" aria-label="Browse Rosicrucian Cross paths">
|
||
<button id="kab-rose-detail-prev" class="detail-sequence-btn" type="button" aria-label="Previous Rosicrucian Cross path">Back</button>
|
||
<div id="kab-rose-detail-position" class="detail-sequence-position" aria-live="polite">--</div>
|
||
<button id="kab-rose-detail-next" class="detail-sequence-btn" type="button" aria-label="Next Rosicrucian Cross path">Next</button>
|
||
</div>
|
||
</div>
|
||
<div id="kab-rose-detail-body" class="planet-meta-grid"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="kabbalah-tree-section" hidden>
|
||
<div class="kab-layout">
|
||
<aside class="kab-tree-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Tree of Life</strong>
|
||
<span class="planet-list-count">32 Paths</span>
|
||
</div>
|
||
<div class="kab-path-toggle-wrap">
|
||
<label class="kab-path-toggle-control" for="kab-path-letter-toggle">
|
||
<input id="kab-path-letter-toggle" type="checkbox" checked>
|
||
<span>Show path letters</span>
|
||
</label>
|
||
<label class="kab-path-toggle-control" for="kab-path-number-toggle">
|
||
<input id="kab-path-number-toggle" type="checkbox" checked>
|
||
<span>Show path numbers</span>
|
||
</label>
|
||
<label class="kab-path-toggle-control" for="kab-path-tarot-toggle">
|
||
<input id="kab-path-tarot-toggle" type="checkbox">
|
||
<span>Show Tarot cards on paths</span>
|
||
</label>
|
||
<button id="kab-tree-export-webp" class="kab-export-btn" type="button">Export WebP</button>
|
||
</div>
|
||
<div id="kab-tree-container" class="kab-tree-container"></div>
|
||
</aside>
|
||
<section class="kab-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="kab-detail-name">Kabbalah Tree of Life</h2>
|
||
<div id="kab-detail-sub" class="planet-detail-type">Select a sephira or path to explore</div>
|
||
<div class="detail-sequence-nav" aria-label="Browse Kabbalah nodes">
|
||
<button id="kab-detail-prev" class="detail-sequence-btn" type="button" aria-label="Previous Kabbalah node">Back</button>
|
||
<div id="kab-detail-position" class="detail-sequence-position" aria-live="polite">--</div>
|
||
<button id="kab-detail-next" class="detail-sequence-btn" type="button" aria-label="Next Kabbalah node">Next</button>
|
||
</div>
|
||
</div>
|
||
<div id="kab-detail-body" class="planet-meta-grid"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="alphabet-section" hidden>
|
||
<div class="alpha-lookup-shell">
|
||
<section class="alpha-special-top" aria-label="Alphabet special tools">
|
||
<div class="planet-meta-card alpha-gematria-card">
|
||
<strong>Word Lookup</strong>
|
||
<div class="alpha-gematria-toolbar">
|
||
<fieldset class="alpha-tool-mode-group" aria-label="Alphabet tool mode">
|
||
<label class="alpha-tool-mode-option" for="alpha-tool-mode-gematria">
|
||
<input id="alpha-tool-mode-gematria" name="alpha-tool-mode" type="radio" value="forward" checked>
|
||
<span>Gematria</span>
|
||
</label>
|
||
<label class="alpha-tool-mode-option" for="alpha-tool-mode-reverse">
|
||
<input id="alpha-tool-mode-reverse" name="alpha-tool-mode" type="radio" value="reverse">
|
||
<span>Reverse Lookup</span>
|
||
</label>
|
||
<label class="alpha-tool-mode-option" for="alpha-tool-mode-dictionary">
|
||
<input id="alpha-tool-mode-dictionary" name="alpha-tool-mode" type="radio" value="dictionary">
|
||
<span>Dictionary</span>
|
||
</label>
|
||
<label class="alpha-tool-mode-option" for="alpha-tool-mode-anagram">
|
||
<input id="alpha-tool-mode-anagram" name="alpha-tool-mode" type="radio" value="anagram">
|
||
<span>Anagram Maker</span>
|
||
</label>
|
||
</fieldset>
|
||
</div>
|
||
<div class="alpha-gematria-controls">
|
||
<div class="alpha-gematria-field alpha-gematria-field-cipher">
|
||
<span id="alpha-gematria-cipher-label">Cipher</span>
|
||
<select id="alpha-gematria-cipher" class="alpha-gematria-cipher" aria-label="Gematria cipher"></select>
|
||
<div id="alpha-gematria-reverse-ciphers" class="alpha-gematria-reverse-ciphers" role="group" aria-label="Reverse lookup ciphers" hidden></div>
|
||
<div id="alpha-gematria-reverse-cipher-hint" class="alpha-gematria-reverse-cipher-hint" hidden>Select one or more ciphers to narrow reverse lookup results.</div>
|
||
</div>
|
||
<label class="alpha-gematria-field" for="alpha-gematria-input">
|
||
<span id="alpha-gematria-input-label">Text</span>
|
||
<textarea id="alpha-gematria-input" class="alpha-gematria-input" placeholder="Type or paste text"></textarea>
|
||
</label>
|
||
</div>
|
||
<div id="alpha-gematria-result" class="alpha-gematria-result">Total: --</div>
|
||
<div id="alpha-gematria-breakdown" class="alpha-gematria-breakdown">Type text to calculate.</div>
|
||
<div id="alpha-gematria-matches" class="alpha-gematria-matches" aria-live="polite" hidden></div>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="alphabet-letters-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Alphabet Letter Database</strong>
|
||
<span id="alpha-letter-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="alpha-tabs">
|
||
<button id="alpha-tab-all" class="alpha-tab-btn alpha-tab-active" data-alpha="all">All</button>
|
||
<button id="alpha-tab-hebrew" class="alpha-tab-btn" data-alpha="hebrew">Hebrew</button>
|
||
<button id="alpha-tab-greek" class="alpha-tab-btn" data-alpha="greek">Greek (Classical/Koine)</button>
|
||
<button id="alpha-tab-greek-archaic" class="alpha-tab-btn" data-alpha="greekArchaic">Greek (Archaic)</button>
|
||
<button id="alpha-tab-english" class="alpha-tab-btn" data-alpha="english">English</button>
|
||
<button id="alpha-tab-arabic" class="alpha-tab-btn" data-alpha="arabic">Arabic</button>
|
||
<button id="alpha-tab-enochian" class="alpha-tab-btn" data-alpha="enochian">Enochian</button>
|
||
</div>
|
||
<div class="dataset-search-wrap alpha-filter-search-wrap">
|
||
<input id="alpha-search-input" class="dataset-search-input" type="search" placeholder="Search letters, meanings, transliteration, or position (e.g., 13)" aria-label="Search alphabet letters">
|
||
<button id="alpha-search-clear" class="dataset-search-clear" type="button" aria-label="Clear alphabet search" disabled>×</button>
|
||
</div>
|
||
<div class="alpha-filter-type-wrap">
|
||
<label for="alpha-type-filter">Class</label>
|
||
<select id="alpha-type-filter" class="alpha-type-filter" aria-label="Filter by letter class">
|
||
<option value="">All</option>
|
||
<option value="mother">Mother</option>
|
||
<option value="double">Double</option>
|
||
<option value="simple">Simple</option>
|
||
</select>
|
||
</div>
|
||
<div id="alpha-letter-list" class="planet-card-list" role="listbox" aria-label="Letters"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="alpha-detail-name">--</h2>
|
||
<div id="alpha-detail-sub" class="planet-detail-type">Select a letter to explore</div>
|
||
</div>
|
||
<div id="alpha-detail-body" class="planet-meta-grid"></div>
|
||
</div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="alphabet-text-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Alphabet > Text</strong>
|
||
<span id="alpha-text-source-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<form id="alpha-text-global-search-form" class="alpha-text-search-controls alpha-text-search-controls--sidebar">
|
||
<label class="alpha-text-control" for="alpha-text-global-search-input">
|
||
<span>Search All Texts</span>
|
||
</label>
|
||
<div class="alpha-text-search-inline">
|
||
<input id="alpha-text-global-search-input" class="alpha-text-search-input" type="search" placeholder="Search across every text source" aria-label="Search all texts">
|
||
<button id="alpha-text-global-search-submit" class="alpha-nav-btn alpha-text-search-submit-inline" type="submit">Search</button>
|
||
<button id="alpha-text-global-search-clear" class="alpha-nav-btn alpha-text-search-submit-inline" type="button">Clear</button>
|
||
</div>
|
||
</form>
|
||
<div id="alpha-text-source-list" class="planet-card-list" role="listbox" aria-label="Text sources"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading alpha-text-detail-heading">
|
||
<div class="alpha-text-heading-main">
|
||
<h2 id="alpha-text-detail-name">--</h2>
|
||
<div id="alpha-text-detail-sub" class="planet-detail-type">Select a text source to begin reading</div>
|
||
</div>
|
||
<div class="alpha-text-heading-tools">
|
||
<div class="alpha-text-controls alpha-text-controls--heading">
|
||
<label class="alpha-text-control" for="alpha-text-translation-select" hidden>
|
||
<span>Translation</span>
|
||
<select id="alpha-text-translation-select" class="alpha-text-select" aria-label="Select text translation"></select>
|
||
</label>
|
||
<div id="alpha-text-compare-toggle-control" class="alpha-text-control alpha-text-control--toggle" hidden>
|
||
<span>Compare</span>
|
||
<button id="alpha-text-compare-toggle" class="alpha-nav-btn alpha-text-compare-toggle" type="button" aria-pressed="false">Off</button>
|
||
</div>
|
||
<label class="alpha-text-control" for="alpha-text-compare-select" hidden>
|
||
<span>Compare With</span>
|
||
<select id="alpha-text-compare-select" class="alpha-text-select" aria-label="Select comparison translation"></select>
|
||
</label>
|
||
<label class="alpha-text-control" for="alpha-text-work-select">
|
||
<span>Work</span>
|
||
<select id="alpha-text-work-select" class="alpha-text-select" aria-label="Select text work"></select>
|
||
</label>
|
||
<label class="alpha-text-control" for="alpha-text-section-select">
|
||
<span>Section</span>
|
||
<select id="alpha-text-section-select" class="alpha-text-select" aria-label="Select text section"></select>
|
||
</label>
|
||
<div class="alpha-text-control alpha-text-control--toggle alpha-text-reader-toggle-control">
|
||
<span>Reader</span>
|
||
<label class="alpha-text-reader-toggle" for="alpha-text-show-verse-heads">
|
||
<input id="alpha-text-show-verse-heads" type="checkbox" checked>
|
||
<span>Show headings and letter/word stats</span>
|
||
</label>
|
||
</div>
|
||
</div>
|
||
<form id="alpha-text-local-search-form" class="alpha-text-search-controls alpha-text-search-controls--detail alpha-text-search-controls--heading">
|
||
<label class="alpha-text-control" for="alpha-text-local-search-input">
|
||
<span>Search This Source</span>
|
||
</label>
|
||
<div class="alpha-text-search-inline">
|
||
<input id="alpha-text-local-search-input" class="alpha-text-search-input" type="search" placeholder="Search within the selected source" aria-label="Search current text source">
|
||
<button id="alpha-text-local-search-submit" class="alpha-nav-btn alpha-text-search-submit-inline" type="submit">Search</button>
|
||
<button id="alpha-text-local-search-clear" class="alpha-nav-btn alpha-text-search-submit-inline" type="button">Clear</button>
|
||
</div>
|
||
</form>
|
||
</div>
|
||
</div>
|
||
<div id="alpha-text-detail-body" class="alpha-text-detail-body"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="cube-section" hidden>
|
||
<div id="cube-layout" class="kab-layout">
|
||
<aside class="kab-tree-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Cube of Space</strong>
|
||
<span class="planet-list-count">6 Walls · 12 Edges</span>
|
||
</div>
|
||
<div id="cube-rotation-controls" class="cube-rotation-controls" aria-label="Rotate cube">
|
||
<button id="cube-rotate-left" class="cube-rotation-btn" type="button" title="Rotate left">←</button>
|
||
<button id="cube-rotate-right" class="cube-rotation-btn" type="button" title="Rotate right">→</button>
|
||
<button id="cube-rotate-up" class="cube-rotation-btn" type="button" title="Rotate up">↑</button>
|
||
<button id="cube-rotate-down" class="cube-rotation-btn" type="button" title="Rotate down">↓</button>
|
||
<button id="cube-rotate-reset" class="cube-rotation-btn" type="button" title="Reset rotation">Reset</button>
|
||
<button id="cube-focus-toggle" class="cube-rotation-btn cube-focus-toggle" type="button" aria-pressed="false">Focus Cube</button>
|
||
<button id="cube-export-webp" class="cube-rotation-btn cube-export-btn" type="button">Export WebP</button>
|
||
<div class="cube-marker-mode-control">
|
||
<label for="cube-marker-mode" class="cube-marker-mode-label">Marker display</label>
|
||
<select id="cube-marker-mode" class="cube-marker-mode-select" aria-label="Cube marker display mode">
|
||
<option value="both" selected>Letter + Astrology</option>
|
||
<option value="letter">Letter only</option>
|
||
<option value="astro">Astrology only</option>
|
||
<option value="tarot">Tarot Cards</option>
|
||
</select>
|
||
</div>
|
||
<label class="cube-connector-toggle-control" for="cube-connector-toggle">
|
||
<input id="cube-connector-toggle" type="checkbox" checked>
|
||
<span>Show mother connector lines</span>
|
||
</label>
|
||
<label class="cube-primal-toggle-control" for="cube-primal-toggle">
|
||
<input id="cube-primal-toggle" type="checkbox" checked>
|
||
<span>Show primal point</span>
|
||
</label>
|
||
<div id="cube-rotation-readout" class="cube-rotation-readout">X 0° · Y 0°</div>
|
||
</div>
|
||
<div id="cube-view-container" class="kab-tree-container"></div>
|
||
</aside>
|
||
<section class="kab-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="cube-detail-name">Cube of Space</h2>
|
||
<div id="cube-detail-sub" class="planet-detail-type">Select a wall or edge to explore</div>
|
||
</div>
|
||
<div id="cube-detail-body" class="planet-meta-grid"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="zodiac-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Zodiac Signs</strong>
|
||
<span id="zodiac-sign-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="dataset-search-wrap">
|
||
<input id="zodiac-search-input" class="dataset-search-input" type="search" placeholder="Search signs, element, modality" aria-label="Search zodiac signs">
|
||
<button id="zodiac-search-clear" class="dataset-search-clear" type="button" aria-label="Clear zodiac search" disabled>×</button>
|
||
</div>
|
||
<div id="zodiac-sign-list" class="planet-card-list" role="listbox" aria-label="Zodiac signs"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="zodiac-detail-name" class="zod-detail-name">--</h2>
|
||
<div id="zodiac-detail-sub" class="planet-detail-type">Select a sign to explore</div>
|
||
</div>
|
||
<div id="zodiac-detail-body"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
</section>
|
||
|
||
<section id="gods-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Divine Pantheons</strong>
|
||
<span id="gods-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div id="gods-tabs" class="gods-tabs"></div>
|
||
<div class="dataset-search-wrap">
|
||
<input id="gods-search-input" class="dataset-search-input" type="search" placeholder="Search gods, sephiroth, paths…" aria-label="Search divine names">
|
||
<button id="gods-search-clear" class="dataset-search-clear" type="button" aria-label="Clear search" disabled>×</button>
|
||
</div>
|
||
<div id="gods-list" class="planet-card-list" role="listbox" aria-label="Divine correspondences"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="gods-detail-name">--</h2>
|
||
<div id="gods-detail-sub" class="planet-detail-type">Select a deity to explore</div>
|
||
</div>
|
||
<div id="gods-detail-body"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="enochian-section" hidden>
|
||
<div class="planet-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Enochian Tablets</strong>
|
||
<span id="enochian-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div class="dataset-search-wrap">
|
||
<input id="enochian-search-input" class="dataset-search-input" type="search" placeholder="Search tablets, elements, letters" aria-label="Search Enochian tablets">
|
||
<button id="enochian-search-clear" class="dataset-search-clear" type="button" aria-label="Clear Enochian search" disabled>×</button>
|
||
</div>
|
||
<div id="enochian-list" class="planet-card-list" role="listbox" aria-label="Enochian tablets"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="enochian-detail-name">--</h2>
|
||
<div id="enochian-detail-sub" class="planet-detail-type">Select a tablet to explore</div>
|
||
</div>
|
||
<div id="enochian-detail-body"></div>
|
||
</section>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="numbers-section" hidden>
|
||
<div class="kab-layout numbers-layout">
|
||
<aside id="numbers-special-panel" class="numbers-special-panel" aria-label="4 card arrangement"></aside>
|
||
<div class="planet-layout numbers-main-layout">
|
||
<aside class="planet-list-panel">
|
||
<div class="planet-list-header">
|
||
<strong>Numbers (Digital Root)</strong>
|
||
<span id="numbers-count" class="planet-list-count">--</span>
|
||
</div>
|
||
<div id="numbers-list" class="planet-card-list" role="listbox" aria-label="Numbers 0 through 9"></div>
|
||
</aside>
|
||
<section class="planet-detail-panel" aria-live="polite">
|
||
<div class="planet-detail-heading">
|
||
<h2 id="numbers-detail-name">--</h2>
|
||
<div id="numbers-detail-type" class="planet-detail-type">--</div>
|
||
<div id="numbers-detail-summary" class="planet-detail-summary">--</div>
|
||
</div>
|
||
<div id="numbers-detail-body" class="numbers-detail-body"></div>
|
||
</section>
|
||
</div>
|
||
</div>
|
||
</section>
|
||
|
||
<section id="timeline-section" hidden>
|
||
<div id="month-strip" aria-hidden="true"></div>
|
||
<div id="calendar"></div>
|
||
</section>
|
||
|
||
<div id="now-panel">
|
||
<iframe id="now-sky-layer" aria-hidden="true" scrolling="no" allow="geolocation"></iframe>
|
||
<div class="now-panel-controls">
|
||
<label class="now-panel-toggle" for="now-overlay-toggle">
|
||
<input id="now-overlay-toggle" type="checkbox" checked />
|
||
<span>Show Overlay</span>
|
||
</label>
|
||
</div>
|
||
<div class="now-panel-square">
|
||
<div class="now-section now-section-hour">
|
||
<div class="now-title">Current Planetary Hour</div>
|
||
<img id="now-hour-card" class="now-card" alt="Current planetary hour card" />
|
||
<div id="now-hour" class="now-primary now-primary-hour">--</div>
|
||
<div id="now-hour-tarot" class="now-tarot">--</div>
|
||
<div class="now-countdown-row">
|
||
<span id="now-countdown" class="now-countdown-value">--</span>
|
||
<span id="now-hour-next" class="now-countdown-next">> --</span>
|
||
</div>
|
||
</div>
|
||
<div class="now-section now-section-moon">
|
||
<div class="now-title">Moon Phase</div>
|
||
<img id="now-moon-card" class="now-card" alt="Current moon phase card" />
|
||
<div id="now-moon" class="now-primary now-primary-moon">--</div>
|
||
<div id="now-moon-tarot" class="now-tarot">--</div>
|
||
<div class="now-countdown-row">
|
||
<span id="now-moon-countdown" class="now-countdown-value">--</span>
|
||
<span id="now-moon-next" class="now-countdown-next">> --</span>
|
||
</div>
|
||
</div>
|
||
<div class="now-section now-section-decan">
|
||
<div class="now-title">Current Decan (Sun)</div>
|
||
<img id="now-decan-card" class="now-card" alt="Current decan card" />
|
||
<div id="now-decan" class="now-primary now-primary-decan">--</div>
|
||
<div id="now-decan-tarot" class="now-tarot">--</div>
|
||
<div class="now-countdown-row">
|
||
<span id="now-decan-countdown" class="now-countdown-value">--</span>
|
||
<span id="now-decan-next" class="now-countdown-next">> --</span>
|
||
</div>
|
||
</div>
|
||
<div class="now-stats-section">
|
||
<div class="now-stats-title">Planet Positions</div>
|
||
<div id="now-stats-planets" class="now-stats-planets">--</div>
|
||
<div id="now-stats-sabian" class="now-stats-sabian">--</div>
|
||
</div>
|
||
</div>
|
||
</div>
|
||
<script src="node_modules/@toast-ui/calendar/dist/toastui-calendar.min.js"></script>
|
||
<script src="node_modules/suncalc/suncalc.js"></script>
|
||
<script src="node_modules/astronomy-engine/astronomy.browser.min.js"></script>
|
||
<script src="app/astro-calcs.js"></script>
|
||
<script src="app/app-config.js?v=20260529-access-gating-01"></script>
|
||
<script src="app/data-service.js?v=20260601-now-polling-03"></script>
|
||
<script src="app/calendar-events.js"></script>
|
||
<script src="app/card-images.js?v=20260527-tarot-deck-gallery-01"></script>
|
||
<script src="app/ui-tarot-lightbox.js?v=20260608-tarot-lightbox-mobile-help-04"></script>
|
||
<script src="app/ui-tarot-house.js?v=20260401-house-top-date-01"></script>
|
||
<script src="app/ui-tarot-relations.js"></script>
|
||
<script src="app/ui-now-helpers.js?v=20260314-now-planets-grid-01"></script>
|
||
<script src="app/ui-now.js?v=20260601-now-polling-03"></script>
|
||
<script src="app/ui-natal.js"></script>
|
||
<script src="app/tarot-database-builders.js?v=20260424-decan-ranges-01"></script>
|
||
<script src="app/tarot-database-assembly.js?v=20260402-princess-links-01"></script>
|
||
<script src="app/tarot-database.js?v=20260402-princess-links-01"></script>
|
||
<script src="app/ui-calendar-dates.js"></script>
|
||
<script src="app/ui-calendar-detail-panels.js?v=20260529-access-gating-02"></script>
|
||
<script src="app/ui-calendar-detail.js?v=20260529-access-gating-02"></script>
|
||
<script src="app/ui-calendar-data.js?v=20260424-decan-ranges-01"></script>
|
||
<script src="app/ui-sequence-nav.js?v=20260528-sequence-nav-01"></script>
|
||
<script src="app/ui-calendar.js?v=20260528-sequence-nav-01"></script>
|
||
<script src="app/ui-holidays-data.js"></script>
|
||
<script src="app/ui-holidays-render.js?v=20260529-access-gating-02"></script>
|
||
<script src="app/ui-holidays.js?v=20260528-sequence-nav-01"></script>
|
||
<script src="app/ui-tarot-card-derivations.js?v=20260307b"></script>
|
||
<script src="app/ui-tarot-detail.js?v=20260527-tarot-deck-gallery-02"></script>
|
||
<script src="app/ui-tarot-relation-display.js?v=20260307b"></script>
|
||
<script src="app/ui-tarot.js?v=20260528-tarot-variant-sequence-02"></script>
|
||
<script src="app/ui-planets-references.js"></script>
|
||
<script src="app/ui-planets.js?v=20260529-access-gating-02"></script>
|
||
<script src="app/ui-cycles.js?v=20260424-detail-inline-links-02"></script>
|
||
<script src="app/ui-elements.js?v=20260529-access-gating-02"></script>
|
||
<script src="app/ui-audio-notes.js?v=20260314-audio-notes-02"></script>
|
||
<script src="app/ui-audio-circle.js?v=20260314-audio-circle-01"></script>
|
||
<script src="app/ui-iching-references.js"></script>
|
||
<script src="app/ui-iching.js?v=20260529-access-gating-02"></script>
|
||
<script src="app/ui-rosicrucian-cross.js"></script>
|
||
<script src="app/ui-kabbalah-detail.js?v=20260529-access-gating-02"></script>
|
||
<script src="app/ui-kabbalah-views.js"></script>
|
||
<script src="app/ui-kabbalah.js?v=20260528-kabbalah-cross-split-06"></script>
|
||
<script src="app/ui-cube-detail.js?v=20260529-access-gating-02"></script>
|
||
<script src="app/ui-cube-chassis.js?v=20260424-cube-fixes-01"></script>
|
||
<script src="app/ui-cube-math.js"></script>
|
||
<script src="app/ui-cube-selection.js?v=20260424-cube-fixes-01"></script>
|
||
<script src="app/ui-cube.js?v=20260424-association-web-01"></script>
|
||
<script src="app/ui-alphabet-gematria.js?v=20260323-word-meta-01"></script>
|
||
<script src="app/ui-alphabet-browser.js?v=20260531-greek-gematria-04"></script>
|
||
<script src="app/ui-alphabet-references.js"></script>
|
||
<script src="app/ui-alphabet-detail.js?v=20260531-greek-gematria-04"></script>
|
||
<script src="app/ui-alphabet-kabbalah.js"></script>
|
||
<script src="app/ui-alphabet.js?v=20260424-detail-inline-links-02"></script>
|
||
<script src="app/ui-alphabet-text.js?v=20260315-text-search-ui-01"></script>
|
||
<script src="app/ui-zodiac-references.js"></script>
|
||
<script src="app/ui-zodiac.js?v=20260529-access-gating-02"></script>
|
||
<script src="app/ui-quiz-bank-builtins-domains.js"></script>
|
||
<script src="app/ui-quiz-bank-builtins.js"></script>
|
||
<script src="app/ui-quiz-bank.js"></script>
|
||
<script src="app/ui-quiz.js"></script>
|
||
<script src="app/quiz-plugin-helpers.js"></script>
|
||
<script src="app/quiz-calendars.js"></script>
|
||
<script src="app/quiz-connections.js"></script>
|
||
<script src="app/ui-gods-references.js"></script>
|
||
<script src="app/ui-gods.js"></script>
|
||
<script src="app/ui-enochian.js?v=20260529-access-gating-02"></script>
|
||
<script src="app/ui-numbers-detail.js?v=20260529-access-gating-02"></script>
|
||
<script src="app/ui-numbers.js"></script>
|
||
<script src="app/ui-tarot-spread.js"></script>
|
||
<script src="app/ui-tarot-frame.js?v=20260424-frame-export-01"></script>
|
||
<script src="app/ui-settings.js?v=20260603-detail-text-scale-01"></script>
|
||
<script src="app/ui-chrome.js?v=20260328-topbar-settings-01"></script>
|
||
<script src="app/ui-navigation.js?v=20260528-kabbalah-cross-split-06"></script>
|
||
<script src="app/ui-calendar-formatting.js?v=20260307b"></script>
|
||
<script src="app/ui-calendar-visuals.js?v=20260307b"></script>
|
||
<script src="app/ui-home-calendar.js?v=20260415-stellarium-toggle-01"></script>
|
||
<script src="app/ui-section-state.js?v=20260531-now-polling-02"></script>
|
||
<script src="app/app-runtime.js?v=20260531-now-polling-02"></script>
|
||
<script src="app.js?v=20260603-detail-text-scale-01"></script>
|
||
<script src="app/navigation-detail-test-harness.js?v=20260401-universal-detail-02"></script>
|
||
</body>
|
||
</html>
|