.guide{padding-top:44px;padding-bottom:60px}.guide-heading{max-width:820px}.guide-heading h1{font-size:clamp(2.2rem,4.5vw,3.7rem);line-height:1.07}.guide-notice{padding:16px 20px;border-left:3px solid var(--teal);background:var(--mist);line-height:1.6;color:var(--muted);font-size:.95rem;margin:24px 0}.guide-notice strong{color:var(--navy)}.category-tabs{display:flex;flex-wrap:wrap;gap:10px;margin:26px 0 18px}.tab{min-height:46px;padding:10px 20px;border:1px solid var(--line);background:white;border-radius:8px;color:var(--navy);font-weight:700}.tab[aria-pressed=true]{color:white;background:var(--navy);border-color:var(--navy)}.viewer-card{border:1px solid var(--line);border-radius:14px;overflow:hidden;background:white}.viewer-toolbar{padding:18px 24px;border-bottom:1px solid var(--line);display:flex;align-items:center;justify-content:space-between;gap:16px}.viewer-toolbar h2{font-size:1.25rem;letter-spacing:0;margin:0 0 6px}.viewer-toolbar p{color:var(--muted);font-size:.95rem;margin:0}.viewer-toolbar .tag{white-space:nowrap}.boat-canvas{position:relative;aspect-ratio:3/2;max-width:1050px;margin:auto}.boat-canvas>img{width:100%;height:100%;object-fit:contain}.hotspot-layer{position:absolute;inset:0;pointer-events:none}.hotspot{position:absolute;transform:translate(-50%,-50%);display:grid;place-items:center;width:44px;height:44px;border:3px solid white;border-radius:50%;background:var(--navy);box-shadow:0 0 0 2px var(--teal),0 4px 12px #07182940;color:white;font-weight:800;pointer-events:auto}.hotspot:hover{background:var(--teal)}.map-caption{padding:14px 24px;background:var(--mist);color:var(--muted);font-size:.9rem;margin:0}.sensor-selection{margin-top:30px}.sensor-selection h2{font-size:1.5rem;letter-spacing:0}.sensor-list{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:12px}.sensor-choice{border:1px solid var(--line);padding:16px;text-align:left;background:#fff;border-radius:10px;display:flex;align-items:center;gap:12px;color:var(--navy);min-height:80px}.sensor-choice:hover{border-color:var(--teal);background:#effbfc}.choice-number{display:grid;place-items:center;width:34px;height:34px;flex-shrink:0;border-radius:50%;background:var(--mist);font-weight:750}.choice-copy strong{display:block;font-size:1rem}.choice-copy small{display:block;font-size:.875rem;margin-top:4px;color:var(--muted)}.guide-next{margin-top:46px;border-top:1px solid var(--line);padding-top:38px;display:flex;align-items:center;gap:32px}.guide-next h2{font-size:1.8rem}.guide-next>div{max-width:790px}.guide-next p{color:var(--muted)}.guide-next .button{flex-shrink:0}.sensor-panel{position:fixed;inset:0;margin:auto;width:min(620px,calc(100% - 32px));max-height:calc(100dvh - 40px);overflow:auto;border:1px solid var(--line);border-radius:16px;padding:26px;color:var(--ink);background:white;overscroll-behavior:contain}.sensor-panel::backdrop{background:#07182999}.panel-top{display:flex;align-items:center;justify-content:space-between;gap:16px;margin-bottom:26px}.panel-close{width:44px;height:44px;flex-shrink:0;border:1px solid var(--line);border-radius:50%;background:white;color:var(--navy);font-size:1.65rem}.sensor-panel .eyebrow{font-size:.85rem;margin-bottom:10px}.sensor-panel h2{font-size:2rem}.sensor-panel>p{color:var(--muted)}.info-grid{display:grid;grid-template-columns:1fr 1fr;gap:14px;margin:24px 0}.info-grid section{padding:16px;background:var(--mist);border-radius:10px}.info-grid h3{font-size:1rem;margin-bottom:10px}.info-grid p{font-size:.95rem;margin:0;line-height:1.55}.sensor-panel>h3{font-size:1.1rem}.equipment-types{padding-left:22px;line-height:1.7}.equipment-types li{padding:4px 0}body:has(dialog[open]){overflow:hidden}
.hotspot-connectors{display:none;position:absolute;inset:0;width:100%;height:100%;pointer-events:none}.hotspot-connectors line{stroke:var(--navy);stroke-width:2;vector-effect:non-scaling-stroke}.hotspot-connectors circle{fill:var(--navy);stroke:white;stroke-width:1;vector-effect:non-scaling-stroke}
@media(max-width:800px){.guide{padding-top:32px}.sensor-list{grid-template-columns:1fr 1fr}.hotspot-connectors{display:block}.hotspot{left:var(--mobile-x)!important;top:var(--mobile-y)!important}.guide-next{align-items:flex-start;flex-direction:column;gap:12px}.viewer-toolbar{padding:16px}.map-caption{padding:14px 16px}}
@media(max-width:520px){.category-tabs{display:grid;grid-template-columns:1fr 1fr}.tab{padding:10px 8px;font-size:.95rem}.sensor-list{grid-template-columns:1fr}.sensor-choice{min-height:72px}.viewer-toolbar{align-items:flex-start}.viewer-toolbar .tag{font-size:.8rem;padding:5px 7px}.sensor-panel{padding:20px;max-height:calc(100dvh - 24px);width:calc(100% - 24px)}.info-grid{grid-template-columns:1fr}.guide-heading h1{font-size:2.2rem}.panel-top .tag{font-size:.8rem}}