wordmark 0.21.0 → 0.23.0

data/app/models/aircraft_avatar.rb

@@ -0,0 +1,59 @@
+# Which of the 20 aircraft avatars (sprite a-*, easy_aircraft_avatar) draws an aircraft before
+# anyone has a picture of it: from what the registry says it is, and for a single-engine airplane
+# from its make and model too (config/aircraft_avatars.yml), so a Cub, a 172 and a Bonanza differ.
+module AircraftAvatar
+  # The single-engine airplane families by make and model, in the order they are tried.
+  FAMILIES = YAML.load_file(File.expand_path('../../config/aircraft_avatars.yml', __dir__))
+                 .transform_values { Regexp.new(it.join('|'), Regexp::IGNORECASE) }.freeze
+
+  # The engine types that turn no propeller and no rotor of their own.
+  JETS = %w[turbo_jet turbo_fan].freeze
+
+  # The families a single turboprop keeps (an Air Tractor), rather than being drawn as one.
+  TURBOPROP_FAMILIES = %w[ag-plane fixed-wing-drone].freeze
+
+  # @param type [String] the registry's type of aircraft: "fixed_wing_single_engine", "rotorcraft"…
+  # @param engine [String, nil] the registry's type of engine: "reciprocating", "electric"…
+  # @param name [String, nil] its make and model, "Piper PA-18-150".
+  # @param engines [Integer, nil] how many engines its model has.
+  # @param seats [Integer, nil] how many seats its model has.
+  # @param airliner [Boolean] whether its model is an airliner (30 seats or more, or its freighter).
+  # @return [String] the avatar's name in the sprite, without its a-: "high-wing-tailwheel".
+  def self.for(type:, engine: nil, name: nil, engines: nil, seats: nil, airliner: false)
+    case type.to_s
+    when 'balloon', 'blimp' then 'balloon'
+    when 'glider' then 'glider'
+    when 'weight_shift_control' then 'trike'
+    when 'powered_parachute' then 'powered-parachute'
+    when 'hybrid_lift' then 'fixed-wing-drone'
+    when 'rotorcraft', 'gyroplane' then rotorcraft(engine, engines.to_i, seats.to_i)
+    when 'fixed_wing_multi_engine' then multi_engine(engine, airliner)
+    else single_engine engine, name.to_s
+    end
+  end
+
+  class << self
+  private
+
+    def rotorcraft(engine, engines, seats)
+      return 'multirotor-drone' if engine == 'electric'
+
+      engines > 1 || seats > 8 ? 'heavy-helicopter' : 'helicopter'
+    end
+
+    def multi_engine(engine, airliner)
+      return 'twin' unless JETS.include? engine
+
+      airliner ? 'airliner' : 'business-jet'
+    end
+
+    def single_engine(engine, name)
+      return 'business-jet' if JETS.include? engine
+
+      family = FAMILIES.find { |_, pattern| pattern.match?(name) }&.first
+      return family if family && (engine != 'turbo_prop' || TURBOPROP_FAMILIES.include?(family))
+
+      engine == 'turbo_prop' ? 'single-turboprop' : family || 'high-wing'
+    end
+  end
+end

data/app/views/easy/_flyer.html.erb

@@ -0,0 +1,10 @@
+<%# locals: (plane:, date: nil) -%>
+<%# A plane crossing the sky behind a hero, its trail behind it, flown by easy/flyer.js, which the page includes once,
+    with easy/konami.js, its easter egg.
+    plane: its icon in the sprite, "plane" (easyFAA's airliner), "small-plane" (easyAnnual's single engine) or
+    "twin-plane" (easyFAA's accidents' twin engine).
+    date: "2026-12-25", the day to fly on instead of the visitor's today, to see a holiday's colors. -%>
+<%= tag.div class: "sky js-sky", aria: { hidden: true }, data: { date: } do %>
+  <svg class="trail js-trail" focusable="false"></svg>
+  <span class="flyer js-flyer"><%= easy_icon plane %></span>
+<% end %>

data/app/views/easy/_modal.html.erb

@@ -0,0 +1,14 @@
+<%# locals: (id:, close:, title: nil, open: false, emoji: nil, classes: nil) -%>
+<%# A dialog over the page, rendered as a layout around what it holds (render layout: "easy/modal" do … end), which
+    always lets its reader out: its ×, Esc or a click around it (easy/modal.js, which the page includes once), or without the script the
+    × as a link. Shown when its address's #id names it, or open: true (drawn already open, say once a form asked).
+    close: where the × leads, "#" for a dialog opened by its #id, the page without what opened it otherwise.
+    title: its heading; without one, what it holds gives its own, with the id "#{id}-title" (one per step, say).
+    classes: the app's own, beside modal, to style what it holds. -%>
+<%= tag.div id:, class: [ "modal", ("is-open" if open), classes ], role: "dialog", aria: { modal: true, labelledby: "#{id}-title" } do %>
+  <div class="modal-box">
+    <%= link_to "×", close, class: "modal-x", aria: { label: "Close" } %>
+    <% if title %><h2 id="<%= id %>-title"><% if emoji %><span aria-hidden="true"><%= emoji %></span> <% end %><%= title %></h2><% end %>
+    <%= yield %>
+  </div>
+<% end %>

data/app/views/easy/_pin_code.html.erb

@@ -0,0 +1,9 @@
+<%# locals: (name:, id: nil, autofocus: false, label: "6-digit code") -%>
+<%# The 6-digit code emailed to sign in or to sign: one real field, so a pasted or autofilled code lands whole, drawn
+    over six slots by easy/pin_code.js, which the page includes once; without the script, the field itself shows.
+    name: the field's, "sign_in[pin]"; a code refused is the page's to mark, is-invalid on the .pin-code. -%>
+<div class="pin-code">
+  <%= tag.input type: "text", name:, id:, class: "pin-code-input", required: true, autofocus:, autocomplete: "one-time-code",
+                inputmode: "numeric", pattern: "[0-9]{6}", maxlength: 6, aria: { label: } %>
+  <div class="pin-code-slots" aria-hidden="true"><span></span><span></span><span></span><span></span><span></span><span></span></div>
+</div>

data/app/views/easy/_report_head.html.erb

@@ -0,0 +1,19 @@
+<%# locals: (heading: nil, heading_id: nil, before: nil, switches_id: "switches", switches: [], after: nil, search: nil, search_label: search, sort_list: nil, sort_default: "newest") -%>
+<%# The head of a report or list: its heading, its switches (each { state:, css:, icon:, count:, label:, off: }), with the
+    sort button at their end, and a search. before and after go above and below the switches. sort_list is the list the
+    button flips by each row's data-sort (easy/report_sort); without it the page sorts by itself. -%>
+<%= tag.section class: "report-head", data: { sort_list:, sort_default: (sort_default if sort_list) }.compact do %>
+  <% if heading %><%= tag.h2 heading, id: heading_id %><% end %>
+  <%= before %>
+  <% if switches.any? %>
+    <%= tag.ul class: "switches levels", id: switches_id do %>
+      <% switches.each do |item| %>
+        <%= tag.li class: item[:css], data: { state: item[:state], off: item[:off] }.compact do %><% if item[:icon] %><%= easy_icon item[:icon] %><% end %><span class="n"><%= item[:count] %></span> <%= item[:label] %><% end %>
+      <% end %>
+      <li class="sort-button-item" hidden><button type="button" class="sort-button js-sort"><%= easy_icon sort_default %><span class="js-sort-label"><%= sort_default.capitalize %> first</span></button></li>
+    <% end %>
+  <% end %>
+  <%= after %>
+  <% if search %><label class="word-search report-search js-words" hidden><%= easy_icon "search" %><input type="search" placeholder="<%= search %>" aria-label="<%= search_label %>" autocomplete="off" spellcheck="false"></label><% end %>
+<% end %>
+<% if sort_list %><%= javascript_include_tag "easy/report_sort", defer: true %><% end %>

data/app/views/easy/mailer/_code.html.erb

@@ -0,0 +1,67 @@
+<%# locals: (code:, brand:, site:, logo:, purpose:, lifetime:, ignore:, link: nil, link_label: nil, link_lede: nil, fine: nil) -%>
+<%# The email carrying a 6-digit code, the same from every easy app (its text twin: _code.text.erb): the logo, then a
+    card whose navy head holds the code large enough to read across the room, selected whole by one click or tap.
+    The code is plain digits next to the word "code", in the subject too ("123456 is your easyFAA code"), with no
+    other run of digits near it: what Apple Mail, iOS and Gmail look for to offer it to the field that asks for it.
+    code: "123456"; brand: "easyFAA"; site: the app's address, under the card; logo: the URL of the brand's logo,
+    an inline attachment so it shows wherever the email is read; purpose: "to sign in", "to sign the airframe
+    logbook entry for N22196"; lifetime: "10 minutes"; ignore: what to do with an email nobody asked for.
+    link, link_label, link_lede: a button doing what the code does, the sentence above it; fine: under it (HTML). -%>
+<% heading = %(font-family:"Outfit","Helvetica Neue",Helvetica,Arial,sans-serif;) %>
+<% body = %(font-family:-apple-system,"Segoe UI",Roboto,Helvetica,Arial,sans-serif;) %>
+<% host = URI(site).host %>
+<!DOCTYPE html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<meta name="color-scheme" content="light">
+<meta name="supported-color-schemes" content="light">
+<meta name="format-detection" content="telephone=no, date=no, address=no">
+<title><%= code %> is your <%= brand %> code</title>
+<link href="https://fonts.googleapis.com/css2?family=Outfit:wght@500;600;700&amp;display=swap" rel="stylesheet">
+</head>
+<body style="margin:0;padding:0;background:#f1f2f3;">
+<div style="display:none;max-height:0;overflow:hidden;opacity:0;">Your <%= brand %> code <%= purpose %>: <%= code %></div>
+<table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="background:#f1f2f3;">
+  <tr><td align="center" style="padding:32px 16px;">
+    <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0" style="max-width:560px;">
+
+      <tr><td style="padding:0 4px 20px;">
+        <a href="<%= site %>" style="text-decoration:none;"><img src="<%= logo %>" height="32" alt="<%= brand %>" style="display:block;border:0;height:32px;width:auto;"></a>
+      </td></tr>
+
+      <tr><td style="background:#ffffff;border:1px solid #c6cbcf;border-radius:18px;overflow:hidden;">
+        <table role="presentation" width="100%" cellpadding="0" cellspacing="0" border="0">
+          <tr><td align="center" style="background:#0b1e3a;padding:30px 28px 30px;border-radius:17px 17px 0 0;">
+            <div style="<%= body %>font-size:12px;letter-spacing:.08em;text-transform:uppercase;color:#9fb6d4;margin:0 0 12px;">Your <%= brand %> code</div>
+            <div style="<%= heading %>font-size:56px;font-weight:700;letter-spacing:.14em;color:#ffffff;line-height:1;-webkit-user-select:all;user-select:all;"><%= code %></div>
+            <div style="<%= body %>font-size:15px;line-height:1.4;color:#cfe0f3;margin:14px 0 0;"><%= purpose.upcase_first %></div>
+          </td></tr>
+
+          <% if link %>
+            <tr><td align="center" style="padding:22px 28px 8px;<%= body %>font-size:16px;line-height:1.5;color:#2c2f32;"><%= link_lede %></td></tr>
+            <tr><td align="center" style="padding:10px 28px 18px;">
+              <table role="presentation" cellpadding="0" cellspacing="0" border="0"><tr>
+                <td style="background:#1a70d0;border-radius:24px;">
+                  <a href="<%= link %>" style="display:inline-block;padding:14px 30px;<%= heading %>font-size:17px;font-weight:600;color:#ffffff;text-decoration:none;border-radius:24px;"><%= link_label %></a>
+                </td>
+              </tr></table>
+            </td></tr>
+          <% end %>
+          <tr><td align="center" style="padding:<%= link ? "0" : "22px" %> 28px 26px;<%= body %>font-size:13px;line-height:1.5;color:#636c74;">
+            <% if fine %><%= fine %><br><% end %>
+            It works once, for <%= lifetime %>. <%= ignore %>
+          </td></tr>
+        </table>
+      </td></tr>
+
+      <tr><td style="padding:18px 8px 0;<%= body %>font-size:12px;line-height:1.5;color:#636c74;text-align:center;">
+        <a href="<%= site %>" style="color:#636c74;"><%= host %></a>
+      </td></tr>
+
+    </table>
+  </td></tr>
+</table>
+</body>
+</html>

data/app/views/easy/mailer/_code.text.erb

@@ -0,0 +1,16 @@
+<%# locals: (code:, brand:, site:, purpose:, lifetime:, ignore:, logo: nil, link: nil, link_label: nil, link_lede: nil, fine: nil) -%>
+<%# The plain-text twin of _code.html.erb: the code first, on its own line beside the word "code". fine: plain text. -%>
+Your <%= brand %> code <%= purpose %>: <%= code %>
+<% if link %>
+
+<%= link_lede %>
+<%= link %>
+<% end %>
+<% if fine %>
+
+<%= fine %>
+<% end %>
+
+It works once, for <%= lifetime %>. <%= ignore %>
+
+<%= site %>

data/app/views/layouts/easy/site.html.erb

@@ -0,0 +1,50 @@
+<%# The page every easy app draws: an app's own layout fills the slots, then renders this one
+    (render template: "layouts/easy/site").
+    - :easy_head, its title, metas and links;
+    - :easy_stylesheets, its own stylesheets, after the shared ones;
+    - :body_class, the body's classes;
+    - :site_brand_url and :site_brand, where its logo goes and the logo;
+    - :site_nav, its links, sign in or out;
+    - :sky_band, "full" or "slim", for the band under the header; then the page is wide;
+    - :page_class, the page's own classes beside page ("wide" for one that lays out its own widths);
+    - :site_footer, its footer's lines and links;
+    - :body_end, its scripts. -%>
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<%= yield :easy_head %>
+<%# The headings' face, asked for with the stylesheet rather than once it is read (easy/base.css). -%>
+<%= preload_link_tag asset_path("easy/outfit-latin.woff2"), as: "font", type: "font/woff2", crossorigin: "anonymous" %>
+<%= stylesheet_link_tag "easy/tokens", "easy/base", "easy/layout", "easy/components" %>
+<%= yield :easy_stylesheets %>
+<script>(function(){document.documentElement.className+=' has-js';try{var t=localStorage.getItem('theme');if(t==='dark'||t==='light'){document.documentElement.setAttribute('data-theme',t)}}catch(e){}})();</script>
+</head>
+<body class="<%= content_for(:body_class) %>">
+<a class="skip-link" href="#main">Skip to content</a>
+<header class="site-header">
+  <div class="page-width">
+    <%= link_to content_for(:site_brand_url) || "/", class: "site-brand" do %><%= yield :site_brand %><% end %>
+    <div>
+      <nav class="site-nav" aria-label="Site"><%= yield :site_nav %></nav>
+      <button type="button" class="theme-toggle js-theme" aria-pressed="false">
+        <%= easy_icon "sun", class: "i i-sun" %><%= easy_icon "moon", class: "i i-moon" %><span class="theme-toggle-label">Dark theme</span>
+      </button>
+    </div>
+  </div>
+</header>
+<% if content_for?(:sky_band) %>
+<div class="sky-band<%= " slim" if content_for(:sky_band) == "slim" %>"></div>
+<% end %>
+<main id="main" class="page<%= " wide" if content_for?(:sky_band) %><%= " #{content_for(:page_class)}" if content_for?(:page_class) %>">
+<%= yield %>
+</main>
+<footer id="footer" class="site-footer">
+  <div class="site-footer-inner">
+<%= yield :site_footer %>
+  </div>
+</footer>
+<%= yield :body_end %>
+</body>
+</html>

data/app/views/layouts/wordmark/errors.html.erb

@@ -0,0 +1,26 @@
+<!doctype html>
+<html lang="en">
+<head>
+<meta charset="utf-8">
+<meta name="viewport" content="width=device-width, initial-scale=1">
+<meta name="color-scheme" content="light dark">
+<meta name="robots" content="noindex">
+<title><%= content_for(:title) || @site_name %></title>
+<style>
+:root{color-scheme:light;--bg:#ffffff;--ink:#15202e;--muted:#50575d;--primary:#1a70d0}
+@media (prefers-color-scheme: dark){:root{color-scheme:dark;--bg:#131415;--ink:#f3f5f8;--muted:#abb2b8;--primary:#689dff}}
+*{box-sizing:border-box}
+body{margin:0;min-height:100svh;display:flex;flex-direction:column;align-items:center;justify-content:center;background:var(--bg);color:var(--ink);font:500 17px/1.5 system-ui,-apple-system,"Segoe UI",Roboto,"Helvetica Neue",Arial,sans-serif;text-align:center;padding:40px 24px}
+a{color:var(--primary)}
+h1{display:flex;align-items:center;justify-content:center;font-size:clamp(1.5rem,5.5vw,2.25rem);margin:0}
+h1 svg{width:1.1em;height:1.1em;margin-right:0.3em;flex-shrink:0}
+p{color:var(--muted);margin:18px 0 0;max-width:32rem}
+footer{margin-top:40px;font-size:15px;color:var(--muted)}
+footer a{color:inherit;text-decoration:none}
+</style>
+</head>
+<body>
+<%= yield %>
+<footer><%= link_to @site_name, @site_url %></footer>
+</body>
+</html>

data/app/views/wordmark/errors/show.html.erb

@@ -0,0 +1,15 @@
+<% content_for :title, "#{@heading} | #{@site_name}" %>
+<h1>
+  <svg viewBox="0 0 64 64" aria-hidden="true">
+    <g stroke="currentColor" stroke-width="2.5" stroke-linejoin="round">
+      <polygon points="60,8 4,30 25,37" fill="#ffffff"/>
+      <polygon points="60,8 25,37 31,57" fill="#cfe0f3"/>
+    </g>
+    <g stroke="#7a93b3" stroke-width="1.6" stroke-linecap="round">
+      <line x1="16" y1="28.5" x2="36" y2="21"/><line x1="21" y1="31.5" x2="44" y2="22.5"/><line x1="27" y1="33" x2="46" y2="25.5"/>
+    </g>
+    <path d="M10 44 C14 50 18 53 24 55" fill="none" stroke="currentColor" stroke-width="2" stroke-dasharray="3 3" stroke-linecap="round"/>
+  </svg>
+  <%= @heading %>
+</h1>
+<p><%= @message %></p>

data/art/blackbox.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <g fill="none" stroke="#7e6317" style="stroke: light-dark(#7e6317, #ffd352)" stroke-width="36" stroke-linecap="round" stroke-linejoin="round">
+    <rect x="56" y="104" width="400" height="304" rx="28"/>
+    <path d="M112 264H184L216 184L264 344L304 224L328 264H400"/>
+  </g>
+</svg>

data/art/data.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <g fill="none" stroke="#5aa9e6" stroke-width="36" stroke-linecap="round" stroke-linejoin="round">
+    <ellipse cx="256" cy="112" rx="176" ry="56"/>
+    <path d="M80 112V400A176 56 0 0 0 432 400V112"/>
+    <path d="M80 208A176 56 0 0 0 432 208"/>
+    <path d="M80 304A176 56 0 0 0 432 304"/>
+  </g>
+</svg>

data/art/dataplate.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <g fill="none" stroke="#0b1e3a" style="stroke: light-dark(#0b1e3a, #cfe3f6)" stroke-width="36" stroke-linecap="round" stroke-linejoin="round">
+    <rect x="48" y="104" width="416" height="304" rx="28"/>
+    <circle cx="104" cy="160" r="6"/>
+    <circle cx="408" cy="160" r="6"/>
+    <circle cx="104" cy="352" r="6"/>
+    <circle cx="408" cy="352" r="6"/>
+    <path d="M168 200H344"/>
+    <path d="M168 256H344"/>
+    <path d="M168 312H280"/>
+  </g>
+</svg>

data/art/drive.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <g fill="none" stroke="#0b1e3a" style="stroke: light-dark(#0b1e3a, #cfe3f6)" stroke-width="36" stroke-linecap="round" stroke-linejoin="round">
+    <circle cx="256" cy="256" r="208"/>
+    <path d="M256 152 346 204V308L256 360 166 308V204Z"/>
+  </g>
+</svg>

data/art/hangar.svg

@@ -0,0 +1,6 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <g fill="none" stroke="#1b5e55" style="stroke: light-dark(#1b5e55, #9fd9cf)" stroke-width="36" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M48 456V264A208 208 0 0 1 464 264V456Z"/>
+    <path d="M160 456V304H352V456"/>
+  </g>
+</svg>

data/art/index.html.erb

@@ -10,18 +10,16 @@
     <link rel='icon' href='favicon/design-96.png' type='image/png' sizes='96x96'>
     <link rel='apple-touch-icon' href='favicon/design-180.png'>
     <link rel='manifest' href='site.webmanifest'>
-    <!-- The same files every easyfaa page loads, under the version the head helper
-         pins a host to, so the page is drawn by the bytes it hands out rather than by
-         whatever was last built. Relative, so it reads the same on staging, on production
-         and from a folder on disk. -->
-    <link rel='stylesheet' href='v<%= version %>/bh/css/bh.css'>
-    <link rel='stylesheet' href='v<%= version %>/css/easyfaa.css'>
-    <link rel='stylesheet' href='v<%= version %>/bh/theme/bootstrap.css' data-recourse-theme=''>
-    <script type='module' src='v<%= version %>/bh/js/bh.js'></script>
-    <script type='module' src='v<%= version %>/js/easyfaa.js'></script>
+    <!-- The same files every easyfaa page loads. Relative, so it reads the same on staging,
+         on production and from a folder on disk. -->
+    <link rel='stylesheet' href='bh/css/bh.css'>
+    <link rel='stylesheet' href='css/easyfaa.css'>
+    <link rel='stylesheet' href='bh/theme/bootstrap.css' data-recourse-theme=''>
+    <script type='module' src='bh/js/bh.js'></script>
+    <script type='module' src='js/easyfaa.js'></script>
     <style>
       /* The page's own chrome and nothing else: everything shown below is styled by
-         the pinned easyfaa.css alone, which is the point of showing it. */
+         easyfaa.css alone, which is the point of showing it. */
       .design-section { padding-block: 2rem; border-block-end: var(--bs-border-width) solid var(--bs-border-color); }
       .design-section > p { max-width: 48rem; margin-inline: auto; }
       .design-subsection { margin-block-start: 2.5rem; padding-block-start: 1.5rem; border-block-start: var(--bs-border-width) dashed var(--bs-border-color); }
@@ -36,7 +34,7 @@
   <body class='text-center'>
     <header class='container-fluid px-3 py-3 border-bottom d-flex flex-wrap justify-content-center align-items-baseline gap-3'>
       <a class='lockup plex' href='#'><svg aria-hidden='true' style='width: 1.0515em; height: 1.0515em; top: 0.18625em' viewBox='0 0 512 512'><g fill='none' stroke='#5aa9e6' stroke-width='28' stroke-linecap='round' stroke-linejoin='round' transform='rotate(45 256 256)'><path d='M196 60 L316 60 L316 372 L196 372 Z'/><path d='M196 120 L316 120'/><path d='M196 372 L256 470 L316 372'/><path d='M232 431 L256 470 L280 431 Z' fill='#0b1e3a'/></g></svg>design</a>
-      <nav class='fg-2'>the <a href='#lockup'>lockups</a>, <a href='#theme'>themes</a>, <a href='#page'>pages</a>, <a href='#favicon'>icons</a> shared by <a href='https://pro.houseaccount.com/bookings' title='Fountain'><img class='design-mark' src='logo/fountain.svg' alt='Fountain'></a> <a href='https://gold.houseaccount.com/specialty_matches' title='Goldrush'><img class='design-mark' src='logo/goldrush.svg' alt='Goldrush'></a> <a href='https://providers.houseaccount.com/providers' title='Houston'><img class='design-mark' src='logo/houston.svg' alt='Houston'></a> <a href='https://checkout.houseaccount.com/providers' title='Autopilot'><img class='design-mark' src='logo/autopilot.svg' alt='Autopilot'></a></nav>
+      <nav class='fg-2'>the <a href='#lockup'>lockups</a>, <a href='#theme'>themes</a>, <a href='#page'>pages</a>, <a href='#favicon'>icons</a> shared by <a href='https://easyfaa.com' title='Tower'><img class='design-mark' src='logo/tower.svg' alt='Tower'></a> <a href='https://beta.easyannual.com' title='Hangar'><img class='design-mark' src='logo/hangar.svg' alt='Hangar'></a></nav>
     </header>
 
     <main class='container-fluid px-3'>
@@ -57,12 +55,6 @@
               <span class='small fg-2 mt-1'>bh's bundle, and the controller that paints the wall</span>
             </div>
           </div>
-          <div class='col-12'>
-            <div class='card p-3'>
-              <strong>Pinned to a version — the latest is <%= version %></strong>
-              <span class='design-url'><a href='v<%= version %>/css/easyfaa.css'>v<%= version %>/css/easyfaa.css</a> · <a href='v<%= version %>/js/easyfaa.js'>v<%= version %>/js/easyfaa.js</a> · <a href='v<%= version %>/bh/theme/nord.css'>v<%= version %>/bh/theme/nord.css</a></span>
-            </div>
-          </div>
         </div>
       </section>
 
@@ -70,7 +62,7 @@
         <h2>Themes</h2>
         <button type='button' class='btn btn-outline theme-primary' data-controller='scheme' data-action='scheme#rotate'
                 data-scheme-themes-value='["bootstrap","dawn","dracula","gruvbox","monokai","nord","one_dark","solarized","tokyo_night"]'
-                data-scheme-path-value='v<%= version %>/bh/theme' data-scheme-storage-value='recourse-scheme'>
+                data-scheme-path-value='bh/theme' data-scheme-storage-value='recourse-scheme'>
           <span class='recourse-scheme-light'><i class='bi bi-moon-fill'></i> Switch to dark</span>
           <span class='recourse-scheme-dark'><i class='bi bi-sun-fill'></i> Switch to light</span>
         </button>
@@ -89,9 +81,9 @@
         </div>
         <p class='fg-2 mt-4 mb-0'>At three sizes, to show the seating holds:</p>
         <div class='d-flex flex-wrap justify-content-center align-items-baseline gap-4 mt-2'>
-          <a class='lockup plex' href='#lockup' style='font-size: 14px'><%= mark[:fountain] %>fountain</a>
-          <a class='lockup plex' href='#lockup'><%= mark[:fountain] %>fountain</a>
-          <a class='lockup plex' href='#lockup' style='font-size: 34px'><%= mark[:fountain] %>fountain</a>
+          <a class='lockup plex' href='#lockup' style='font-size: 14px'><%= mark[:tower] %>tower</a>
+          <a class='lockup plex' href='#lockup'><%= mark[:tower] %>tower</a>
+          <a class='lockup plex' href='#lockup' style='font-size: 34px'><%= mark[:tower] %>tower</a>
         </div>
       </section>
 
@@ -134,11 +126,19 @@
             <tbody>
               <tr><td><img class='design-logo' src='logo/easyfaa.svg' alt=''></td><th scope='row'>easyfaa</th><td><img src='favicon/easyfaa.svg' width='24' alt=''></td><td><img src='favicon/easyfaa-dev.svg' width='24' alt=''></td><td><img src='favicon/easyfaa-96.png' width='24' alt=''></td><td><img src='favicon/easyfaa-180.png' width='24' alt=''></td><td><img src='favicon/easyfaa-192.png' width='24' alt=''></td><td><img src='favicon/easyfaa-512.png' width='24' alt=''></td><td><a href='favicon/easyfaa.ico'>ico</a></td><td><a href='favicon/easyfaa.webmanifest'>manifest</a></td></tr>
               <tr><td><img class='design-logo' src='logo/cube.svg' alt=''></td><th scope='row'>cube</th><td><img src='favicon/cube.svg' width='24' alt=''></td><td><img src='favicon/cube-dev.svg' width='24' alt=''></td><td><img src='favicon/cube-96.png' width='24' alt=''></td><td><img src='favicon/cube-180.png' width='24' alt=''></td><td><img src='favicon/cube-192.png' width='24' alt=''></td><td><img src='favicon/cube-512.png' width='24' alt=''></td><td><a href='favicon/cube.ico'>ico</a></td><td><a href='favicon/cube.webmanifest'>manifest</a></td></tr>
-              <tr><td><img class='design-logo' src='logo/fountain.svg' alt=''></td><th scope='row'>fountain</th><td><img src='favicon/fountain.svg' width='24' alt=''></td><td><img src='favicon/fountain-dev.svg' width='24' alt=''></td><td><img src='favicon/fountain-96.png' width='24' alt=''></td><td><img src='favicon/fountain-180.png' width='24' alt=''></td><td><img src='favicon/fountain-192.png' width='24' alt=''></td><td><img src='favicon/fountain-512.png' width='24' alt=''></td><td><a href='favicon/fountain.ico'>ico</a></td><td><a href='favicon/fountain.webmanifest'>manifest</a></td></tr>
-              <tr><td><img class='design-logo' src='logo/goldrush.svg' alt=''></td><th scope='row'>goldrush</th><td><img src='favicon/goldrush.svg' width='24' alt=''></td><td><img src='favicon/goldrush-dev.svg' width='24' alt=''></td><td><img src='favicon/goldrush-96.png' width='24' alt=''></td><td><img src='favicon/goldrush-180.png' width='24' alt=''></td><td><img src='favicon/goldrush-192.png' width='24' alt=''></td><td><img src='favicon/goldrush-512.png' width='24' alt=''></td><td><a href='favicon/goldrush.ico'>ico</a></td><td><a href='favicon/goldrush.webmanifest'>manifest</a></td></tr>
-              <tr><td><img class='design-logo' src='logo/houston.svg' alt=''></td><th scope='row'>houston</th><td><img src='favicon/houston.svg' width='24' alt=''></td><td><img src='favicon/houston-dev.svg' width='24' alt=''></td><td><img src='favicon/houston-96.png' width='24' alt=''></td><td><img src='favicon/houston-180.png' width='24' alt=''></td><td><img src='favicon/houston-192.png' width='24' alt=''></td><td><img src='favicon/houston-512.png' width='24' alt=''></td><td><a href='favicon/houston.ico'>ico</a></td><td><a href='favicon/houston.webmanifest'>manifest</a></td></tr>
               <tr><td><img class='design-logo' src='logo/design.svg' alt=''></td><th scope='row'>design</th><td><img src='favicon/design.svg' width='24' alt=''></td><td><img src='favicon/design-dev.svg' width='24' alt=''></td><td><img src='favicon/design-96.png' width='24' alt=''></td><td><img src='favicon/design-180.png' width='24' alt=''></td><td><img src='favicon/design-192.png' width='24' alt=''></td><td><img src='favicon/design-512.png' width='24' alt=''></td><td><a href='favicon/design.ico'>ico</a></td><td><a href='favicon/design.webmanifest'>manifest</a></td></tr>
-              <tr><td><img class='design-logo' src='logo/autopilot.svg' alt=''></td><th scope='row'>autopilot</th><td><img src='favicon/autopilot.svg' width='24' alt=''></td><td><img src='favicon/autopilot-dev.svg' width='24' alt=''></td><td><img src='favicon/autopilot-96.png' width='24' alt=''></td><td><img src='favicon/autopilot-180.png' width='24' alt=''></td><td><img src='favicon/autopilot-192.png' width='24' alt=''></td><td><img src='favicon/autopilot-512.png' width='24' alt=''></td><td><a href='favicon/autopilot.ico'>ico</a></td><td><a href='favicon/autopilot.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/tower.svg' alt=''></td><th scope='row'>tower</th><td><img src='favicon/tower.svg' width='24' alt=''></td><td><img src='favicon/tower-dev.svg' width='24' alt=''></td><td><img src='favicon/tower-96.png' width='24' alt=''></td><td><img src='favicon/tower-180.png' width='24' alt=''></td><td><img src='favicon/tower-192.png' width='24' alt=''></td><td><img src='favicon/tower-512.png' width='24' alt=''></td><td><a href='favicon/tower.ico'>ico</a></td><td><a href='favicon/tower.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/hangar.svg' alt=''></td><th scope='row'>hangar</th><td><img src='favicon/hangar.svg' width='24' alt=''></td><td><img src='favicon/hangar-dev.svg' width='24' alt=''></td><td><img src='favicon/hangar-96.png' width='24' alt=''></td><td><img src='favicon/hangar-180.png' width='24' alt=''></td><td><img src='favicon/hangar-192.png' width='24' alt=''></td><td><img src='favicon/hangar-512.png' width='24' alt=''></td><td><a href='favicon/hangar.ico'>ico</a></td><td><a href='favicon/hangar.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/lens.svg' alt=''></td><th scope='row'>lens</th><td><img src='favicon/lens.svg' width='24' alt=''></td><td><img src='favicon/lens-dev.svg' width='24' alt=''></td><td><img src='favicon/lens-96.png' width='24' alt=''></td><td><img src='favicon/lens-180.png' width='24' alt=''></td><td><img src='favicon/lens-192.png' width='24' alt=''></td><td><img src='favicon/lens-512.png' width='24' alt=''></td><td><a href='favicon/lens.ico'>ico</a></td><td><a href='favicon/lens.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/rollaway.svg' alt=''></td><th scope='row'>rollaway</th><td><img src='favicon/rollaway.svg' width='24' alt=''></td><td><img src='favicon/rollaway-dev.svg' width='24' alt=''></td><td><img src='favicon/rollaway-96.png' width='24' alt=''></td><td><img src='favicon/rollaway-180.png' width='24' alt=''></td><td><img src='favicon/rollaway-192.png' width='24' alt=''></td><td><img src='favicon/rollaway-512.png' width='24' alt=''></td><td><a href='favicon/rollaway.ico'>ico</a></td><td><a href='favicon/rollaway.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/dataplate.svg' alt=''></td><th scope='row'>dataplate</th><td><img src='favicon/dataplate.svg' width='24' alt=''></td><td><img src='favicon/dataplate-dev.svg' width='24' alt=''></td><td><img src='favicon/dataplate-96.png' width='24' alt=''></td><td><img src='favicon/dataplate-180.png' width='24' alt=''></td><td><img src='favicon/dataplate-192.png' width='24' alt=''></td><td><img src='favicon/dataplate-512.png' width='24' alt=''></td><td><a href='favicon/dataplate.ico'>ico</a></td><td><a href='favicon/dataplate.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/data.svg' alt=''></td><th scope='row'>data</th><td><img src='favicon/data.svg' width='24' alt=''></td><td><img src='favicon/data-dev.svg' width='24' alt=''></td><td><img src='favicon/data-96.png' width='24' alt=''></td><td><img src='favicon/data-180.png' width='24' alt=''></td><td><img src='favicon/data-192.png' width='24' alt=''></td><td><img src='favicon/data-512.png' width='24' alt=''></td><td><a href='favicon/data.ico'>ico</a></td><td><a href='favicon/data.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/refinery.svg' alt=''></td><th scope='row'>refinery</th><td><img src='favicon/refinery.svg' width='24' alt=''></td><td><img src='favicon/refinery-dev.svg' width='24' alt=''></td><td><img src='favicon/refinery-96.png' width='24' alt=''></td><td><img src='favicon/refinery-180.png' width='24' alt=''></td><td><img src='favicon/refinery-192.png' width='24' alt=''></td><td><img src='favicon/refinery-512.png' width='24' alt=''></td><td><a href='favicon/refinery.ico'>ico</a></td><td><a href='favicon/refinery.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/stockroom.svg' alt=''></td><th scope='row'>stockroom</th><td><img src='favicon/stockroom.svg' width='24' alt=''></td><td><img src='favicon/stockroom-dev.svg' width='24' alt=''></td><td><img src='favicon/stockroom-96.png' width='24' alt=''></td><td><img src='favicon/stockroom-180.png' width='24' alt=''></td><td><img src='favicon/stockroom-192.png' width='24' alt=''></td><td><img src='favicon/stockroom-512.png' width='24' alt=''></td><td><a href='favicon/stockroom.ico'>ico</a></td><td><a href='favicon/stockroom.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/blackbox.svg' alt=''></td><th scope='row'>blackbox</th><td><img src='favicon/blackbox.svg' width='24' alt=''></td><td><img src='favicon/blackbox-dev.svg' width='24' alt=''></td><td><img src='favicon/blackbox-96.png' width='24' alt=''></td><td><img src='favicon/blackbox-180.png' width='24' alt=''></td><td><img src='favicon/blackbox-192.png' width='24' alt=''></td><td><img src='favicon/blackbox-512.png' width='24' alt=''></td><td><a href='favicon/blackbox.ico'>ico</a></td><td><a href='favicon/blackbox.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/drive.svg' alt=''></td><th scope='row'>drive</th><td><img src='favicon/drive.svg' width='24' alt=''></td><td><img src='favicon/drive-dev.svg' width='24' alt=''></td><td><img src='favicon/drive-96.png' width='24' alt=''></td><td><img src='favicon/drive-180.png' width='24' alt=''></td><td><img src='favicon/drive-192.png' width='24' alt=''></td><td><img src='favicon/drive-512.png' width='24' alt=''></td><td><a href='favicon/drive.ico'>ico</a></td><td><a href='favicon/drive.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/mirroring.svg' alt=''></td><th scope='row'>mirroring</th><td><img src='favicon/mirroring.svg' width='24' alt=''></td><td><img src='favicon/mirroring-dev.svg' width='24' alt=''></td><td><img src='favicon/mirroring-96.png' width='24' alt=''></td><td><img src='favicon/mirroring-180.png' width='24' alt=''></td><td><img src='favicon/mirroring-192.png' width='24' alt=''></td><td><img src='favicon/mirroring-512.png' width='24' alt=''></td><td><a href='favicon/mirroring.ico'>ico</a></td><td><a href='favicon/mirroring.webmanifest'>manifest</a></td></tr>
+              <tr><td><img class='design-logo' src='logo/wordmark.svg' alt=''></td><th scope='row'>wordmark</th><td><img src='favicon/wordmark.svg' width='24' alt=''></td><td><img src='favicon/wordmark-dev.svg' width='24' alt=''></td><td><img src='favicon/wordmark-96.png' width='24' alt=''></td><td><img src='favicon/wordmark-180.png' width='24' alt=''></td><td><img src='favicon/wordmark-192.png' width='24' alt=''></td><td><img src='favicon/wordmark-512.png' width='24' alt=''></td><td><a href='favicon/wordmark.ico'>ico</a></td><td><a href='favicon/wordmark.webmanifest'>manifest</a></td></tr>
             </tbody>
           </table>
         </div>

data/art/lens.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <g fill="none" stroke="#5b2a86" style="stroke: light-dark(#5b2a86, #d6bdf2)" stroke-width="36" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M72 168V72H168"/>
+    <path d="M344 72H440V168"/>
+    <path d="M440 344V440H344"/>
+    <path d="M168 440H72V344"/>
+    <circle cx="256" cy="256" r="104"/>
+  </g>
+</svg>

data/art/mirroring.svg

@@ -0,0 +1,8 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <g fill="none" stroke="#5aa9e6" stroke-width="36" stroke-linecap="round" stroke-linejoin="round">
+    <ellipse cx="256" cy="192" rx="136" ry="152"/>
+    <path d="M200 120Q216 96 248 88"/>
+    <path d="M256 344V472"/>
+    <path d="M216 472H296"/>
+  </g>
+</svg>

data/art/refinery.svg

@@ -0,0 +1,9 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <g fill="none" stroke="#6f4219" style="stroke: light-dark(#6f4219, #e8c29c)" stroke-width="36" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M96 456V128A56 56 0 0 1 208 128V456"/>
+    <path d="M96 312H208"/>
+    <path d="M208 224H360V296"/>
+    <path d="M272 456V328Q360 280 448 328V456"/>
+    <path d="M48 456H464"/>
+  </g>
+</svg>

data/art/rollaway.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <g fill="none" stroke="#b3261e" style="stroke: light-dark(#b3261e, #ff8a80)" stroke-width="36" stroke-linecap="round" stroke-linejoin="round">
+    <rect x="96" y="56" width="320" height="352" rx="20"/>
+    <path d="M96 176H416"/>
+    <path d="M96 292H416"/>
+    <path d="M216 116H296"/>
+    <path d="M216 234H296"/>
+    <path d="M216 350H296"/>
+    <circle cx="160" cy="448" r="24"/>
+    <circle cx="352" cy="448" r="24"/>
+  </g>
+</svg>

data/art/stockroom.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <g fill="none" stroke="#19753e" style="stroke: light-dark(#19753e, #59c27a)" stroke-width="36" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M72 40V472"/>
+    <path d="M440 40V472"/>
+    <path d="M72 200H440"/>
+    <path d="M72 360H440"/>
+    <path d="M120 200V112H240V200"/>
+    <path d="M280 200V144H392V200"/>
+    <path d="M120 360V280H200V360"/>
+    <path d="M240 360V248H392V360"/>
+  </g>
+</svg>

data/art/tower.svg

@@ -0,0 +1,12 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <g fill="none" stroke="#1a70d0" style="stroke: light-dark(#1a70d0, #689dff)" stroke-width="36" stroke-linecap="round" stroke-linejoin="round">
+    <path d="M256 104V40"/>
+    <path d="M148 104H364"/>
+    <path d="M96 168H416L372 272H140Z"/>
+    <path d="M208 168 216 272"/>
+    <path d="M304 168 296 272"/>
+    <path d="M188 272 172 472"/>
+    <path d="M324 272 340 472"/>
+    <path d="M116 472H396"/>
+  </g>
+</svg>

data/art/wordmark.svg

@@ -0,0 +1,3 @@
+<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 512 512">
+  <path fill="#1a70d0" style="fill: light-dark(#1a70d0, #689dff)" d="M40 380.8 144.1 127.5H170.4L273.8 380.8H233.5L150 170.2H163.8L79.6 380.8ZM90.2 326.9V294.4H223.9V326.9ZM380.4 384.5Q356.6 384.5 337.5 372.6Q318.3 360.6 307.2 340.2Q296.1 319.8 296.1 294.4Q296.1 268.8 307.2 248.3Q318.3 227.9 337.4 215.8Q356.6 203.7 380.3 203.7Q400.2 203.7 415.7 212Q431.1 220.4 440.4 235Q449.7 249.6 450.3 268.4V319.7Q449.6 338.5 440.5 353.2Q431.4 367.8 415.8 376.1Q400.3 384.5 380.4 384.5ZM386.2 350.7Q409.8 350.7 424.1 334.9Q438.5 319.1 438.5 294.1Q438.5 277.4 432 264.6Q425.4 251.8 413.7 244.6Q401.9 237.4 386.1 237.4Q370.5 237.4 358.5 244.7Q346.5 251.9 339.6 264.7Q332.8 277.5 332.8 294.1Q332.8 310.7 339.6 323.5Q346.5 336.3 358.5 343.5Q370.6 350.7 386.2 350.7ZM436.3 380.8V334.2L442.7 291.8L436.3 249.9V207.3H472V380.8Z"/>
+</svg>

data/config/aircraft_avatars.yml

@@ -0,0 +1,26 @@
+# The single-engine airplane families easyFAA tells apart by make and model ("Cessna 172N",
+# "Piper PA-18-150", "Van's RV-8"), tried in this order, the first pattern found in the name
+# winning. A name no pattern finds is drawn high-wing, as the commonest. Case is ignored.
+fixed-wing-drone:
+  - v-?bat|zipline|\buav\b|\buas\b|unmanned|drone
+biplane:
+  - stearman|\bpt-?1[37]\b|\bn2s\b|pitts|\bs-?[12][abcs]?\b|waco|great lakes|starduster|skybolt|acro ?sport
+  - hatz|miniplane|christen|eagle ii|\bultimate\b|tiger moth|\bjungmann
+ag-plane:
+  - air tractor|\bat-?[3-8]\d\d|thrush|\bs-?2r|ag-?cat|g-?164|\bpa-?25|pawnee|\bpa-?36|ag ?(wagon|truck|husky)|\b188\b
+floatplane:
+  - \blake\b|\bla-?(4|250)|searey|sea rey|icon a5|seawind|\bg-?(21|44|73)\b|goose|widgeon|seabee|rc-?3\b|skimmer|catalina
+low-wing-tailwheel:
+  - \brv-?[3468]\b(?!a)|\bat-?6\b|\bt-?6\b|\bsnj\b|harvard|\bp-?51\b|mustang|\bpt-?(19|22|26)\b|\bextra\b|\bea-?300
+  - edge 540|\bgiles\b|\blaser\b|\bcap ?(10|21|23)|\bsu-?(26|29|31)\b|\bt-?28\b
+high-wing-tailwheel:
+  - \bj-?[2345]\b|\bpa-?(11|12|14|16|17|18|20)\b|cub|aeronca|champ|citabria|decathlon|scout|\b7[acegk]c|\b8kcab
+  - taylorcraft|\bbc-?12|cessna (a)?1(20|40|70|80|85|95)|\b(a)?185|maule|husky|\baviat\b|stinson|luscombe|kitfox|savage
+  - \bm-?[4-7]\b|helio|courier|\bdhc-?2\b|beaver|\bl-?(2|3|4|16|19)\b|bird ?dog|super ?cub|carbon ?cub|backcountry
+low-wing-retractable:
+  - mooney|\bm20|(beech|raytheon|textron|hawker).*\b[a-v]?(33|35|36)[a-z]?\b|bonanza|debonair|\bpa-?(24|28r|30|32r|39|46)\b|comanche|arrow|saratoga
+  - lance|\bt-?34\b|meridian|malibu|mirage|navion|\bm-?18|\bb-?24r|sierra|swift|\bgc-?1|viking|\b17-?3\d|bellanca 14
+low-wing:
+  - \bpa-?(28|32|38)\b|cherokee|warrior|archer|cadet|tomahawk|cirrus|\bsr-?2[02]|\bda-?(20|40)|diamond|katana
+  - \baa-?(1|5)|grumman|tiger|cheetah|traveler|musketeer|sundowner|\bbe-?23|\bc-?23\b|\brv-?\d+|ercoupe|aircoupe|\balon\b
+  - lancair|glasair|sonex|zenith|\bch-?[67]\d\d|tecnam|evektor|sportstar|\bsr-?20