:root{font-family:system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;color:#143747;background:#eef5f3;--navy:#0b3445;--teal:#0a7480;--muted:#5b737a;--line:#d8e7e2;--paper:#fff}
*{box-sizing:border-box}body{margin:0}.hidden{display:none!important}.shell{max-width:600px;min-height:100dvh;margin:0 auto;background:#eff5f3;padding-bottom:30px}button,input,select{font:inherit}button{min-height:45px;cursor:pointer}button:disabled{opacity:.45;cursor:not-allowed}button:focus-visible,input:focus-visible,a:focus-visible{outline:3px solid #64c7bc;outline-offset:3px}a{color:var(--teal)}
.header{padding:18px 18px 19px;background:linear-gradient(125deg,#092e41,#0e6974);color:#fff;border-radius:0 0 23px 23px}
.header-top,.boatrow{display:flex;justify-content:space-between;align-items:center;gap:10px}.brandmark{font-size:.8rem;font-weight:900;letter-spacing:.1em}.version{border:1px solid #8ab6b5;border-radius:99px;padding:4px 9px;font-size:.68rem;font-weight:800}.boatrow{margin-top:14px}.boatrow strong{font-size:1.12rem}.boatrow span{font-size:.77rem;color:#e0f9ed;background:#1b5966;padding:4px 10px;border-radius:99px}
.topnav{display:flex;gap:7px;padding:12px 14px 0}.topnav button{flex:1;background:white;color:#5e7380;border:1px solid #d9e8e5;border-radius:12px;font-weight:800;font-size:.83rem}.topnav .active{background:var(--navy);color:white}
.card{margin:12px 14px;padding:17px;border:1px solid var(--line);background:white;border-radius:18px;box-shadow:0 3px 16px #12384809}
.eyebrow{font-size:.68rem;font-weight:900;letter-spacing:.15em;color:var(--teal);text-transform:uppercase}h1{font-size:1.65rem;margin:9px 0 10px;line-height:1.17}h2{font-size:1.18rem;line-height:1.25;margin:4px 0 14px}p{line-height:1.55} .home>p{color:#56727d}.primary,.secondary{display:block;border:0;border-radius:13px;padding:12px 15px;font-weight:850;width:100%;text-align:center}.primary{background:var(--teal);color:white;font-size:1.04rem;box-shadow:0 5px 12px #0b6e7532}.secondary{background:#e5f2f0;color:#155566;margin-top:10px}.primary+.secondary{margin-top:10px}.home-hero{margin:17px 0;background:#e6f3f2;border-radius:14px;overflow:hidden}.micro{color:#63757d;font-size:.75rem;line-height:1.45;margin:10px 0}
.visual{padding:12px;overflow:hidden}.visual-head{display:flex;justify-content:space-between;align-items:center;gap:7px;padding:3px 3px 10px}.visual-head h2{margin:5px 0 0;font-size:1.06rem}.status-dot{color:#0d626d;background:#e2f1ee;padding:6px 8px;border-radius:12px;font-size:.69rem;font-weight:850;white-space:nowrap}
.scene{border-radius:15px;overflow:hidden;background:#c2e7eb}.scene svg{display:block;width:100%;height:auto}.scene-foot{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:7px;margin-top:8px}.scene-foot>div{padding:9px 5px;background:#f2f8f6;border:1px solid #e2eeea;border-radius:11px;min-width:0;text-align:center}.scene-foot small{display:block;font-size:.66rem;color:#607880}.scene-foot strong{font-size:.94rem;display:block;overflow-wrap:anywhere;margin-top:3px}
.checkrow{display:flex;align-items:center;gap:11px;padding:10px 0;border-bottom:1px solid #e8efeb}.checkrow>div:last-child{min-width:0;flex:1}.checkrow strong{font-size:.94rem}.checkrow p{margin:2px 0;font-size:.8rem;color:#557580}.check-icon{font-size:1.3rem;font-weight:850;color:#116a76;background:#e1f1ef;width:39px;height:39px;display:grid;place-items:center;border-radius:13px;flex-shrink:0}
.section-sep{height:1px;background:#dce8e5;margin:15px 0}label{display:block;font-size:.86rem;font-weight:760;margin:10px 0 7px}input[type=number]{width:100%;background:#fff;border:1px solid #adcac8;padding:13px;border-radius:12px;min-height:46px}input[type=checkbox]{flex-shrink:0;accent-color:var(--teal);width:20px;height:20px}
.bottom-choices{display:grid;grid-template-columns:repeat(5,minmax(0,1fr));gap:5px;margin:12px 0}.bottom-choices button{background:#edf4f1;border:2px solid transparent;border-radius:11px;padding:7px 3px;color:#19525f;font-size:1.4rem;font-weight:850;display:flex;align-items:center;justify-content:center;gap:2px;flex-direction:column;min-width:0}.bottom-choices button span{font-size:.63rem;font-weight:800}.bottom-choices button.selected{border-color:#17818b;background:#dcf2ec}.bottom-choices button[data-bottom=posidonia].selected{border-color:#b44a45;background:#fde7e1}
.notice{font-size:.8rem;background:#e9f5f3;padding:11px 12px;border-radius:11px;border-left:4px solid #2d93a3;line-height:1.55;margin:14px 0}.notice.warning{background:#fff5e5;border-left-color:#d39124}.notice.danger{background:#fff0ee;border-left-color:#b33d3c}.notice.good{background:#e6f7ee;border-left-color:#269069}
.checks{padding:13px 0;border-top:1px solid #e2ebe7;border-bottom:1px solid #e2ebe7;margin:14px 0}.checks summary{cursor:pointer;font-weight:850;font-size:.85rem}.checks summary span{float:right;border-radius:100px;background:#e3f1ee;padding:2px 8px}.checklabel{display:flex;gap:10px;align-items:flex-start;font-weight:500;margin:14px 0 6px;padding:0 2px;line-height:1.45}
.target{text-align:center;background:#e8f4f2;border-radius:16px;padding:17px 12px;margin:15px 0}.target small{font-size:.8rem;color:#54747a;display:block}.target strong{font-size:3rem;line-height:1.4;color:#125e6b;display:block}.target span{font-size:.75rem;color:#52757b}.marker-card{display:flex;align-items:center;gap:14px;border:1px solid #d7e6e1;border-radius:14px;padding:12px}.marker-swatch{width:54px;height:54px;border-radius:13px;background:#b3c7c5;border:3px solid #fff;box-shadow:0 0 0 1px #bfd5cf;flex-shrink:0}.marker-card small,.marker-card span{font-size:.78rem;display:block;color:#698086}.marker-card strong{display:block;font-size:1.25rem}
.markers{display:flex;gap:5px;flex-wrap:wrap;margin:15px 0}.markers span{display:inline-flex;align-items:center;gap:4px;border-radius:99px;border:1px solid #d5e5e1;font-size:.69rem;padding:4px 6px}.markers i{width:10px;height:10px;border-radius:50%}.markers .chosen{outline:2px solid #175b6a}
.trend-panel{display:flex;align-items:center;gap:16px;border:1px solid #d9e4e1;border-radius:14px;padding:13px;background:#ecf6f4}.trend-panel>span{font-size:3rem;font-weight:900;color:#52777e}.trend-panel strong{font-size:1rem}.trend-panel p{font-size:.79rem;margin:5px 0 0}.trend-panel.danger,.trend-panel.worse{background:#fff0ed;border-color:#ebc1b5}.trend-panel.danger>span,.trend-panel.worse>span{color:#b3433e}.trend-panel.better{background:#e9f6ee;border-color:#b5e0c6}.trend-panel.better>span{color:#148658}.metrics{display:grid;grid-template-columns:1fr 1fr;gap:9px;margin:12px 0}.metrics>div{background:#edf5f3;border-radius:11px;padding:13px}.metrics small{font-size:.71rem;color:#567880;display:block}.metrics strong{display:block;font-size:1.07rem}
.tab .card h2{margin-bottom:6px}.raster-map{height:340px;position:relative;overflow:hidden;background:linear-gradient(120deg,#a5d6df,#e1efe8);border-radius:13px;border:1px solid #bcd4d6}.tile-viewport{position:relative;width:100%;height:100%;overflow:hidden;background:#c2e6ea}.tile-layer{position:absolute;inset:0}.map-boat{position:absolute;z-index:3;top:50%;left:50%;transform:translate(-50%,-50%);display:none;color:#104a60;font-size:28px;text-shadow:0 1px 2px #fff}.map-accuracy{position:absolute;z-index:2;top:50%;left:50%;transform:translate(-50%,-50%);background:#1782a53d;border:2px solid #1682a5;border-radius:50%;display:none}.map-fallback{position:absolute;inset:0;z-index:1;background:linear-gradient(140deg,#bddfe4,#8bc8d5);color:#145469;display:flex;align-items:center;justify-content:center;text-align:center;font-size:.84rem;padding:28px}.map-attribution{position:absolute;right:4px;bottom:4px;z-index:4;background:#ffffffe8;border-radius:4px;padding:2px 5px;color:#344f52;font-size:.66rem}.map-info{font-size:.78rem;color:#536e75;margin:8px 0}.btnrow{display:flex;gap:8px}.btnrow .secondary{width:50%}.diagnostics{font-family:ui-monospace,monospace;white-space:pre-line;font-size:.73rem;line-height:1.55;padding:13px;margin:12px 0;background:#eef6f4;border-radius:10px}
details summary{cursor:pointer;font-weight:850}footer{text-align:center;font-size:.7rem;color:#6e7d82;padding:11px 23px;line-height:1.5}
@media(min-width:700px){.shell{border-left:1px solid var(--line);border-right:1px solid var(--line)}}

/* iPhone Home Screen safe areas and install help. */
[hidden]{display:none!important}
.header{padding-top:max(18px,env(safe-area-inset-top));padding-left:max(18px,env(safe-area-inset-left));padding-right:max(18px,env(safe-area-inset-right))}
footer{padding-bottom:max(18px,env(safe-area-inset-bottom))}
.install-card{border:1px solid #bddfda;background:#e8f5f2;border-radius:13px;padding:13px;margin:14px 0}
.install-card>strong{font-size:.93rem;color:#115967}
.install-card .secondary{background:#0a7480;color:#fff;margin-top:8px}
.install-steps{margin-top:12px;background:#fff;border-radius:12px;padding:12px;border:1px solid #d7e5e1;font-size:.85rem}
.install-steps ol{padding-left:22px;line-height:1.65;margin:5px 0}
.install-steps li{margin:4px 0}
@supports(-webkit-touch-callout:none){input,select,textarea{font-size:16px}}