l(e,d-42),i=m("text",{x:n,y:o,class:"degree","text-anchor":"middle","dominant-baseline":"middle"});i.textContent=String(e).padStart(3,"0")}}for(const e of O){const t=e.rank==="cardinal",r=e.rank==="intercardinal",s=e.rank==="half";P(e.bearing,86,t?330:300,{class:t?"spoke cardinal":"spoke"});const n=t?300:r?268:s?236:208,o=t?6.4:r?4.6:s?3.2:2.15;K(e.bearing,150,n,o);const i=t?368:338,[c,a]=l(e.bearing,i),B=m("text",{x:c,y:a,class:t?"name cardinal":"name","text-anchor":"middle","dominant-baseline":"middle"});B.textContent=e.mark}R(0,392,16),h(18,{class:"hub"}),m("circle",{cx:b,cy:E,r:3.5,class:"hub-pin"})}function j(e){x.replaceChildren();const[t,r]=l(e,d-52),[s,n]=l(e+180,210);m("line",{x1:b,y1:E,x2:s,y2:n,class:"needle tail"},x),m("line",{x1:b,y1:E,x2:t,y2:r,class:"needle head"},x);const[o,i]=l(e,d-36),[c,a]=l(e+2.2,d-62),[B,S]=l(e-2.2,d-62);m("polygon",{points:`${o},${i} ${c},${a} ${B},${S}`,class:"needle head"},x),m("circle",{cx:b,cy:E,r:5,class:"hub-pin"},x)}function v(e){const t=q(e);return j(t.bearing),u.bearing.textContent=`${f(t.bearing)}°`,u.spoken.textContent=t.point.spoken,u.mark.textContent=t.point.mark,u.pointBearing.textContent=`${f(t.point.bearing)}°`,u.offset.textContent=D(t.offset),u.quadrant.textContent=t.quadrant,u.reciprocal.textContent=`${f(t.reciprocal)}°`,u.reciprocalName.textContent=t.reciprocalPoint.spoken,u.northing.textContent=t.northing.toFixed(4),u.easting.textContent=t.easting.toFixed(4),u.radians.textContent=t.radians.toFixed(4),I.value=String(t.bearing),I.setAttribute("aria-valuenow",f(t.bearing)),document.activeElement!==w&&(w.value=f(t.bearing)),t}H();p.appendChild(x);let y=0;v(y);function $(e){y=(e%360+360)%360,v(y)}I.addEventListener("input",()=>$(Number(I.value)));w.addEventListener("change",()=>{const e=Number(w.value);Number.isFinite(e)?$(e):v(y)});document.getElementById("nudge").addEventListener("click",e=>{const t=e.target.closest("button");t&&$(y+Number(t.dataset.step))});function A(e){const t=p.getBoundingClientRect(),r=e.clientX-t.left-t.width/2,s=e.clientY-t.top-t.height/2;return Math.atan2(r,-s)*180/Math.PI}let C=!1;p.addEventListener("pointerdown",e=>{C=!0,p.setPointerCapture(e.pointerId),$(A(e))});p.addEventListener("pointermove",e=>{C&&$(A(e))});p.addEventListener("pointerup",()=>{C=!1});p.addEventListener("pointercancel",()=>{C=!1});window.addEventListener("keydown",e=>{if(e.target===w)return;const t=e.altKey?.1:e.shiftKey?10:1;e.key==="ArrowRight"||e.key==="ArrowUp"?(e.preventDefault(),$(y+t)):(e.key==="ArrowLeft"||e.key==="ArrowDown")&&(e.preventDefault(),$(y-t))}); ===== FILE: public/compass/assets/index-D7eNM5we.css ===== :root{color-scheme:dark;--bg: #060505;--red: #ff6b6b;--red-bright: #ffd7d7;--red-dim: #c98a8a;--red-faint: rgba(255, 107, 107, .45);--plate: #0e0e10;--line: rgba(255, 107, 107, .28)}*{box-sizing:border-box}body{margin:0;min-height:100vh;background:radial-gradient(ellipse at 50% 0%,#2a0d0d 0%,var(--bg) 55%);color:var(--red);font-family:Iowan Old Style,Palatino,Palatino Linotype,Georgia,serif}main{max-width:1180px;margin:0 auto;padding:36px 20px 64px}.eyebrow{margin:0 0 8px;letter-spacing:.18em;text-transform:uppercase;font-family:ui-sans-serif,system-ui,sans-serif;font-size:.72rem;color:var(--red-dim)}h1{margin:0 0 10px;font-weight:500;font-size:clamp(2.1rem,4vw,3.2rem);letter-spacing:-.03em;color:var(--red-bright)}.lede{margin:0 0 28px;max-width:62ch;line-height:1.5;color:var(--red)}.board{display:grid;grid-template-columns:minmax(0,1.4fr) minmax(260px,.7fr);gap:28px;align-items:start}.card-wrap{min-width:0}#card{display:block;width:100%;height:auto;background:#05070a;border-radius:50%;cursor:crosshair;touch-action:none;box-shadow:0 0 0 1px #ff6b6b59,0 24px 60px #00000073}.ring{stroke:var(--red);stroke-width:1.1}.ring.fine{stroke:var(--red-dim);stroke-width:.6}.ring.rim{stroke:var(--red-bright);stroke-width:1.6}.ring.hub{stroke:var(--red);stroke-width:1.2;fill:#05070a}.tick{stroke:var(--red-dim);stroke-width:.7}.tick.five{stroke:var(--red);stroke-width:1}.tick.ten{stroke:var(--red-bright);stroke-width:1.35}.spoke{stroke:var(--red-dim);stroke-width:.7}.spoke.cardinal{stroke:var(--red-bright);stroke-width:1.2}.diamond{fill:var(--red);stroke:var(--red-bright);stroke-width:.6}.star,.hub-pin{fill:var(--red-bright)}.degree{fill:var(--red-dim);font-family:ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;font-size:13px;font-variant-numeric:tabular-nums}.name{fill:var(--red);font-family:Iowan Old Style,Palatino,Georgia,serif;font-size:11px}.name.cardinal{fill:var(--red-bright);font-size:20px}.needle.head{stroke:var(--red-bright);stroke-width:1.6;fill:var(--red-bright)}.needle.tail{stroke:var(--red-dim);stroke-width:1}.hint{margin:10px 0 0;text-align:center;font-family:ui-sans-serif,system-ui,sans-serif;font-size:.78rem;color:var(--red-dim)}.plate{background:var(--plate);border:1px solid var(--line);padding:22px 22px 18px}.plate-kicker{margin:0;font-family:ui-sans-serif,system-ui,sans-serif;letter-spacing:.16em