;text-transform:uppercase;font-size:.7rem;color:var(--red-dim)}.bearing{margin:6px 0 0;font-family:ui-monospace,Menlo,Consolas,monospace;font-variant-numeric:tabular-nums;font-size:clamp(2.6rem,5vw,3.4rem);letter-spacing:-.04em;color:var(--red-bright)}.spoken{margin:0;font-size:1.55rem;color:var(--red-bright)}.mark{margin:0 0 16px;color:var(--red-dim);letter-spacing:.08em}.field{display:flex;justify-content:space-between;align-items:baseline;gap:12px;font-family:ui-sans-serif,system-ui,sans-serif;font-size:.78rem;letter-spacing:.08em;text-transform:uppercase;color:var(--red-dim)}.field input,#dial{accent-color:var(--red)}.field input{width:7.5rem;background:transparent;color:var(--red-bright);border:1px solid var(--line);font:inherit;font-family:ui-monospace,Menlo,Consolas,monospace;letter-spacing:0;text-transform:none;font-size:1rem;padding:6px 8px;text-align:right}#dial{width:100%;margin:14px 0 10px}.nudge{display:grid;grid-template-columns:repeat(6,1fr);gap:6px}.nudge button{background:transparent;color:var(--red);border:1px solid var(--line);font-family:ui-monospace,Menlo,Consolas,monospace;font-size:.72rem;padding:7px 0;cursor:pointer}.nudge button:hover{border-color:var(--red);color:var(--red-bright)}dl{margin:18px 0 0}dl div{display:grid;grid-template-columns:7.2rem 1fr;gap:8px;padding:7px 0;border-top:1px solid var(--line);font-variant-numeric:tabular-nums}dt{font-family:ui-sans-serif,system-ui,sans-serif;font-size:.72rem;letter-spacing:.08em;text-transform:uppercase;color:var(--red-dim)}dd{margin:0;color:var(--red-bright)}dd em{font-style:normal;color:var(--red)}.notes{margin-top:32px;max-width:68ch}.notes h2{font-weight:500;font-size:1.25rem;margin:0 0 8px;color:var(--red-bright)}.notes p{margin:0 0 10px;line-height:1.55}.notes a{color:var(--red-bright)}.source{color:var(--red-dim);font-size:.95rem}@media(max-width:860px){.board{grid-template-columns:1fr}.nudge{grid-template-columns:repeat(3,1fr)}}.plate{background:linear-gradient(180deg,#140404f0,#060101f0);border-radius:10px;box-shadow:inset 0 0 24px #000000bf,inset 0 1px #ff6b6b1f}.bearing{text-shadow:0 0 18px rgba(255,107,107,.35)}.spoken{text-shadow:0 0 14px rgba(255,107,107,.25)}dd{text-shadow:0 0 8px rgba(255,107,107,.18)}.needle.head{stroke:#7fd4ff;fill:#7fd4ff;filter:drop-shadow(0 0 6px rgba(127,212,255,.85))}.nudge button{letter-spacing:.12em;border-radius:6px;background:linear-gradient(180deg,#1c0b0be6,#0b0202e6);transition:border-color .15s,color .15s,box-shadow .15s}.nudge button:hover{border-color:var(--red);color:var(--red-bright);box-shadow:0 0 10px #ff6b6b40}.field input{border-radius:6px;background:#0a0202d9;box-shadow:inset 0 2px 8px #000c}.field input:focus,.nudge button:focus-visible,#dial:focus-visible{outline:1px solid var(--red-bright);outline-offset:2px} ===== FILE: public/compass/index.html ===== Hawaiian compass — 360°

Navigational instrument

Hawaiian compass

Thirty-two points on exact eleventh-and-a-quarter degrees, and a limb divided to the single degree. North is 000. Red on black, the way an engraved card is read.

Drag the card to lay a course. Arrow keys step one degree, shift ten, option a tenth.

Course

000.0°

Ākau

A