Free Astrophotography Polar Alignment Error Calculator

Application Overview

This is a high-precision, client-side browser tool designed for amateur and professional astrophotographers. It serves as a scientific calculator to derive polar alignment error from measured star drift. By providing a clean, distraction-free environment, it assists users in quantifying their telescope mount alignment accuracy.

Technical Requirements & Constraints

• Single File: The entire application must reside in one HTML file using <style> for CSS and <script> for Vanilla JavaScript.
• Storage: No localStorage, sessionStorage, or cookies are permitted. All state exists in-memory.
• Environment: Must function within a sandboxed iframe. No external database calls; all logic is computed on the client side.
• Design Aesthetic: A modern, "SaaS"-inspired light-mode aesthetic. Use a clean color palette (off-whites, soft grays, professional blues for primary actions, and high-contrast blacks for text).

Feature Set

1. Dynamic Input Panel:
   • Input fields for: Focal Length (mm), Pixel Size (µm), Exposure Time (seconds), Observed Drift (pixels), and Star Declination (degrees).
   • Real-time input validation: Ensure values are non-negative and mathematically valid.
2. Instant Calculation Engine:
   • Automatically performs the conversion from pixel drift to arc-seconds.
   • Calculates the specific polar error (arc-seconds) based on the input drift and exposure time.
3. Scientific Output Display:
   • Prominent, large-font result display (e.g., "Your Polar Error: 4.2 Arc-seconds").
   • Clear color-coded indicators: Green for "Excellent," Yellow for "Acceptable," Red for "Needs Adjustment."
4. Instructional Context:
   • A collapsible "How-To" section that explains how to perform drift measurements on the user's camera display.

UI Layout

• Header: Simple, centered title with no navigation links.
• Main Content Area: A dual-column layout (on desktop) or single-column (on mobile) using flexbox or CSS grid.
  • Left Column (Inputs): Form fields grouped by category (Equipment Specs, Observation Data).
  • Right Column (Results): A high-impact "Result Card" with a gauge visualization representing the error magnitude.
• Visual Style:
  • Rounded corners (8px radius) on input fields.
  • Subtle drop shadows (box-shadow) on cards to provide depth against a light gray background (#F8FAFC).
  • Smooth CSS transitions for button hover states and result updates.
• Responsiveness: Fluid scaling from a 320px width for mobile users (using their phone at the telescope) to full desktop screens.

Interaction Guidelines

• Use only native HTML elements (buttons, inputs) enhanced with CSS for a premium look.
• Do not use alert() or confirm(). If input validation fails, display a custom, inline error message in a soft red alert box beneath the input field.
• All animations should use transition: all 0.3s ease; to ensure professional, snappy feedback.