Film Reciprocity Failure Adjustment Calculator

Overview

A clean, professional-grade utility for analog photographers to calculate precise exposure compensation for long-exposure photography. The tool eliminates the need for manual calculations or lookup tables, offering a fast, mobile-friendly interface.

Core Features

• Film Stock Library: Dropdown selector populated with data for common film stocks (e.g., Ilford HP5, Delta 100/400, Kodak Tri-X, Acros II).
• Manual Calibration: Support for entering a custom 'p' factor (Schwarzschild exponent) for non-standard or experimental films.
• Real-Time Calculation: Instant calculation of the adjusted time as the user inputs the metered time.
• Integrated Visual Timer: A startable/stoppable timer that visually indicates the progression of the adjusted exposure time.
• Input Validation: Prevents invalid inputs (negative times, non-numeric values).

UI Layout

• Header: Simple, clean centered title: "Reciprocity Calculator".
• Main Section: A centralized, white-card interface with a soft drop shadow.
  • Input Row: Large numerical input field for 'Metered Exposure Time (sec)'.
  • Selection Row: Styled dropdown menu for 'Film Stock'.
  • Result Display: A prominent, high-contrast display area showing the 'Recommended Adjusted Time'.
  • Action Area: A "Start Exposure Timer" button that transforms into a progress indicator when active.
• Helper Text: Subtle tooltips or labels explaining the Schwarzschild exponent.

Color Palette (Light-Mode Only)

• Background: Soft, off-white (#F8FAFC).
• Surface/Cards: Pure white (#FFFFFF).
• Primary Accent: Professional slate blue (#3B82F6) for buttons and active states.
• Text: Dark slate (#1E293B) for readability, medium gray (#64748B) for labels.
• Alert/Success: Subtle green (#10B981) for the timer completion state.

Interaction Design

• Transitions: All state changes (e.g., button hover, timer start) use smooth CSS transitions (0.2s ease-in-out).
• Visual Feedback: The result text animates (scales slightly) when the calculated time is updated.
• Responsive Design: Single-column layout on mobile, expanding to a wider centered card on desktop screens.

Technical Directives

• Architecture: Single-file HTML (embedded CSS in <style>, JS in <script>).
• Storage: No localStorage or sessionStorage. All state is stored in JavaScript variables.
• Performance: Use standard DOM manipulation or minimal Vanilla JS to ensure zero lag.
• Iframe Safety: Ensure no calls to alert(), confirm(), or prompt(). All UI warnings must be rendered as overlays within the page content.
• Dependencies: Tailwind CSS via CDN for styling utility, optional Lucide icons for UI elements.