body{margin:0;overflow:hidden;background-color:#000;overscroll-behavior:none}#ui{position:absolute;top:10px;top:calc(10px + env(safe-area-inset-top));left:10px;left:calc(10px + env(safe-area-inset-left));max-width:min(420px,calc(100vw - 150px));color:#fff;font-family:sans-serif;pointer-events:none;background:#00000080;padding:10px;border-radius:5px;line-height:1.45}.hud{--hud-ok: #6fe3a2;--hud-caution: #ffc93c;--hud-danger: #ff4d3d;position:fixed;inset:0;z-index:10;pointer-events:none;font-family:sans-serif;color:#fff}.hud[hidden],.boat-menu[hidden],.touch-pad[hidden],.hud [hidden],.boat-menu [hidden],.touch-pad [hidden]{display:none!important}.hud-warn,.hud-alert{color:var(--hud-danger);font-weight:700}.hud-ease{color:var(--hud-caution);font-size:12px;text-transform:uppercase}.hud-gust{padding:0 5px;border-radius:3px;font-size:11px;font-weight:700;letter-spacing:.06em}.hud-gust-puff{background:#1fb5c7;color:#04262b}.hud-gust-lull{background:#fff3}.hud-crew{display:flex;align-items:center;gap:8px}.hud-bar{position:relative;width:80px;height:7px;border-radius:4px;background:#fff3;overflow:hidden}.hud-bar-fill{position:absolute;inset:0 auto 0 0;background:linear-gradient(90deg,#ffc93c,#ff7a3d)}.hud-heel{position:absolute;left:50%;bottom:18px;bottom:calc(18px + env(safe-area-inset-bottom));width:210px;transform:translate(-50%);padding:6px 8px 8px;border-radius:12px;background:#00000073;pointer-events:none;text-align:center;--needle: var(--hud-ok)}.hud-heel[data-level=caution]{--needle: var(--hud-caution)}.hud-heel[data-level=danger]{--needle: var(--hud-danger);animation:hud-pulse .5s ease-in-out infinite alternate}.hud-heel-dial{display:block;width:100%}.dial-track{fill:none;stroke:#ffffff40;stroke-width:8}.dial-danger{fill:none;stroke:var(--hud-danger);stroke-width:8}.dial-mast{stroke:var(--needle);stroke-width:5;stroke-linecap:round}.dial-hull{fill:var(--needle)}.dial-text{fill:#fff;font-size:22px;font-weight:700;text-anchor:middle}.hud-heel-label{font-size:12px;color:var(--needle);font-weight:700;text-transform:uppercase;letter-spacing:.05em}.hud-hints{position:absolute;left:10px;left:calc(10px + env(safe-area-inset-left));bottom:10px;bottom:calc(10px + env(safe-area-inset-bottom));padding:8px 10px;border-radius:5px;background:#00000073;font-size:12px;line-height:1.7;pointer-events:none}.hud-hints kbd{display:inline-block;min-width:18px;padding:0 5px;border-radius:3px;background:#ffffffe6;color:#10333a;font-family:inherit;font-size:11px;font-weight:700;text-align:center}.hud-touch-note{margin-top:4px;font-size:12px;color:#ffffffd1}.hud-banner{position:absolute;top:22%;left:50%;transform:translate(-50%,-12px);padding:14px 34px;border-radius:14px;background:linear-gradient(135deg,#ff4d3deb,#ffa028eb);text-align:center;pointer-events:none;opacity:0;transition:opacity .3s,transform .3s}.hud-banner.visible{opacity:1;transform:translate(-50%)}.hud-banner-title{font-size:42px;font-weight:900;font-style:italic;text-shadow:0 2px 0 rgba(0,0,0,.25)}.hud-banner-text{font-size:14px}.hud-menu-button,.boat-menu-resume{border:0;border-radius:999px;padding:8px 16px;font:700 14px sans-serif;color:#0d3b45;background:#ffd23f;box-shadow:0 3px #c9971a;cursor:pointer;touch-action:manipulation}.hud-menu-button{position:absolute;top:12px;top:calc(12px + env(safe-area-inset-top));right:12px;right:calc(12px + env(safe-area-inset-right));pointer-events:auto;touch-action:manipulation}.hud-menu-button:hover,.boat-menu-resume:hover{background:#ffe073}@keyframes hud-pulse{0%{box-shadow:0 0 #ff4d3d33}to{box-shadow:0 0 18px 4px #ff4d3da6}}.boat-menu{position:absolute;inset:0;z-index:40;display:flex;align-items:center;justify-content:center;padding:24px;padding-top:calc(24px + env(safe-area-inset-top));padding-right:calc(24px + env(safe-area-inset-right));padding-bottom:calc(24px + env(safe-area-inset-bottom));padding-left:calc(24px + env(safe-area-inset-left));box-sizing:border-box;overflow-y:auto;-webkit-overflow-scrolling:touch;font-family:sans-serif;color:#0d3b45;background:radial-gradient(circle at 85% 12%,rgba(255,210,63,.55),transparent 32%),linear-gradient(160deg,#0a788c8c,#ff784659)}.boat-menu-panel{width:min(920px,100%);padding:28px 32px 24px;border-radius:22px;background:#fffaeef0;box-shadow:0 20px 60px #00283259}.boat-menu-kicker{font-size:12px;font-weight:700;letter-spacing:.18em;text-transform:uppercase;color:#e0592b}.boat-menu-title{margin:4px 0 6px;font-size:40px;font-weight:900;font-style:italic;color:#0b6f86}.boat-menu-intro{margin:0 0 20px;max-width:640px;line-height:1.45}.boat-menu-cards{display:grid;grid-template-columns:repeat(auto-fit,minmax(260px,1fr));gap:18px}.boat-card{position:relative;display:flex;flex-direction:column;gap:8px;touch-action:manipulation;padding:20px 20px 16px;border:3px solid transparent;border-radius:16px;background:linear-gradient(#fff,#fff) padding-box,linear-gradient(135deg,var(--card-accent),var(--card-stripe)) border-box;color:inherit;font:inherit;text-align:left;cursor:pointer;box-shadow:0 6px 0 var(--card-accent);transition:transform .15s,box-shadow .15s}.boat-card:before{content:"";position:absolute;inset:0 0 auto;height:8px;border-radius:13px 13px 0 0;background:linear-gradient(90deg,var(--card-accent) 60%,var(--card-stripe) 60%)}.boat-card:hover,.boat-card:focus-visible{transform:translateY(-3px);box-shadow:0 9px 0 var(--card-accent);outline:none}.boat-card-key{position:absolute;top:16px;right:16px;width:26px;height:26px;border-radius:50%;background:#0d3b45;color:#fff;font-weight:700;line-height:26px;text-align:center}.boat-card-current{display:none;align-self:flex-start;padding:2px 8px;border-radius:999px;background:#0b6f86;color:#fff;font-size:11px;font-weight:700}.boat-card.is-current .boat-card-current{display:inline-block}.boat-card-name{margin:4px 0 0;font-size:26px;font-weight:900}.boat-card-tagline{margin:0;line-height:1.4;color:#35565d}.boat-card-stats{display:grid;grid-template-columns:auto 1fr;gap:4px 12px;margin:4px 0;font-size:14px}.boat-card-stats dt{font-weight:700;color:#e0592b}.boat-card-stats dd{margin:0}.boat-card-swatches{display:flex;gap:4px}.boat-card-swatches span{width:22px;height:14px;border-radius:3px;box-shadow:inset 0 0 0 1px #00000026}.boat-card-cta{align-self:flex-end;font-weight:700;color:#0b6f86}.boat-menu-footer{display:flex;align-items:center;justify-content:flex-end;gap:16px;margin-top:18px;font-size:13px;color:#35565d}.touch-pad{position:fixed;inset:0;z-index:20;pointer-events:none;touch-action:none;user-select:none;-webkit-user-select:none;font-family:sans-serif;color:#fff}.touch-pad,.touch-pad *{box-sizing:border-box}.touch-steer,.touch-right,.touch-top-row,.touch-hikes,.touch-sheets,.touch-rotate{pointer-events:none}.touch-steer{position:absolute;left:16px;left:calc(16px + env(safe-area-inset-left));bottom:16px;bottom:calc(16px + env(safe-area-inset-bottom));display:flex;gap:10px}.touch-steer .touch-btn{width:96px;height:96px}.touch-right{position:absolute;right:16px;right:calc(16px + env(safe-area-inset-right));bottom:16px;bottom:calc(16px + env(safe-area-inset-bottom));display:flex;flex-direction:column;gap:8px;width:214px}.touch-top-row{display:flex;gap:8px;height:96px}.touch-ease{flex:1;background:#ffd23fd1;color:#0d3b45;text-shadow:none}.touch-ease .touch-label{font-size:18px}.touch-hikes{display:flex;flex-direction:column;gap:8px;width:74px}.touch-hike{flex:1;border-radius:12px}.touch-sheets{display:flex;gap:8px;height:86px}.touch-sheets .touch-btn{flex:1}.touch-btn{display:flex;flex-direction:column;align-items:center;justify-content:center;gap:2px;margin:0;padding:4px;border:1px solid rgba(255,255,255,.28);border-radius:18px;background:#081c228c;color:#fff;font:700 12px/1.1 sans-serif;text-shadow:0 1px 2px rgba(0,0,0,.45);box-shadow:0 4px 14px #00000047,inset 0 1px #fff3;pointer-events:auto;touch-action:none;user-select:none;-webkit-user-select:none;-webkit-touch-callout:none;-webkit-tap-highlight-color:transparent;cursor:pointer}.touch-btn *{pointer-events:none}.touch-icon{width:26px;height:26px;display:block}.touch-kicker{font-size:9px;letter-spacing:.08em;text-transform:uppercase;opacity:.8}.touch-btn.is-pressed{background:#fff4b5;color:#0d3b45;text-shadow:none;border-color:transparent;transform:scale(.96);box-shadow:inset 0 0 0 3px #0d3b45}.touch-rotate{display:none;position:absolute;top:58px;top:calc(58px + env(safe-area-inset-top));left:50%;transform:translate(-50%);margin:0;padding:6px 14px;border-radius:999px;background:#0000008c;font:700 13px sans-serif;white-space:nowrap}@media(orientation:portrait){.touch-rotate{display:block;top:auto;bottom:222px;bottom:calc(222px + env(safe-area-inset-bottom))}.touch-steer .touch-btn{width:74px;height:84px}.touch-right{width:156px}.touch-steer{left:10px;left:calc(10px + env(safe-area-inset-left))}.touch-right{right:10px;right:calc(10px + env(safe-area-inset-right))}.touch-hikes{width:62px}}@media(pointer:coarse)and (orientation:portrait){.hud-heel{top:36%;bottom:auto;transform:translate(-50%,-50%)}}