:root{--bg-dark-hsl:222, 47%, 7%;--bg-panel-hsl:222, 40%, 13%;--text-main:#f8fafc;--text-muted:#94a3b8;--text-dim:#64748b;--accent-cyan:#00f2fe;--accent-blue:#4facfe;--accent-purple:#8b5cf6;--accent-gold:#f59e0b;--accent-emerald:#10b981;--accent-rose:#f43f5e;--glass-bg:#0f172ab8;--glass-bg-hover:#1e293bd9;--glass-bg-active:#334155e6;--glass-border:#ffffff1f;--glass-border-highlight:#00f2fe66;--glass-shadow:0 8px 32px 0 #00000080;--blur-amount:16px;--font-heading:"Outfit", -apple-system, sans-serif;--font-body:"Inter", -apple-system, sans-serif;--safe-top:env(safe-area-inset-top,0px);--safe-right:env(safe-area-inset-right,0px);--safe-bottom:env(safe-area-inset-bottom,0px);--safe-left:env(safe-area-inset-left,0px);--app-height:100dvh;--header-height:64px;--panel-top:calc(16px + var(--safe-top) + var(--header-height) + 16px);--transition-fast:.15s cubic-bezier(.4, 0, .2, 1);--transition-smooth:.3s cubic-bezier(.4, 0, .2, 1)}*{box-sizing:border-box;margin:0;padding:0}html,body{width:100%;height:var(--app-height);background-color:hsl(var(--bg-dark-hsl));color:var(--text-main);font-family:var(--font-body);-webkit-font-smoothing:antialiased;font-size:14px;line-height:1.5;overflow:hidden}#root{width:100vw;height:var(--app-height);flex-direction:column;display:flex;position:relative}.glass-panel{background:var(--glass-bg);-webkit-backdrop-filter:blur(var(--blur-amount));border:1px solid var(--glass-border);box-shadow:var(--glass-shadow);transition:border-color var(--transition-fast), background var(--transition-fast);border-radius:16px}.glass-panel:hover{border-color:#ffffff38}.btn-glass{border:1px solid var(--glass-border);color:var(--text-main);font-family:var(--font-body);cursor:pointer;transition:all var(--transition-fast);-webkit-user-select:none;user-select:none;background:#1e293b99;border-radius:9999px;justify-content:center;align-items:center;gap:8px;padding:8px 16px;font-size:13px;font-weight:500;text-decoration:none;display:inline-flex}.btn-glass:hover{background:var(--glass-bg-hover);border-color:var(--glass-border-highlight);transform:translateY(-1px)}.btn-glass:active{background:var(--glass-bg-active);transform:translateY(0)}.btn-glass.active{color:#fff;background:#00f2fe29;border-color:#00f2fe8c;font-weight:600}.gradient-text{background:linear-gradient(135deg, var(--accent-cyan), var(--accent-blue));-webkit-text-fill-color:transparent;font-family:var(--font-heading);-webkit-background-clip:text;font-weight:700}::-webkit-scrollbar{width:6px;height:6px}::-webkit-scrollbar-track{background:#0f172a80}::-webkit-scrollbar-thumb{background:#fff3;border-radius:3px}::-webkit-scrollbar-thumb:hover{background:#fff6}.mapboxgl-ctrl-attribution{-webkit-backdrop-filter:blur(4px);backdrop-filter:blur(4px);border-top-left-radius:8px;color:var(--text-muted)!important;background-color:#0f172a99!important}.mapboxgl-ctrl-attribution a{color:var(--accent-blue)!important}@keyframes pulseGlow{0%,to{opacity:.9;box-shadow:0 0 10px var(--accent-cyan);transform:scale(1)}50%{opacity:1;box-shadow:0 0 22px var(--accent-cyan);transform:scale(1.06)}}@keyframes fadeIn{0%{opacity:0;transform:translateY(8px)}to{opacity:1;transform:translateY(0)}}.animate-fade{animation:fadeIn var(--transition-smooth) forwards}.app-container{width:100vw;height:var(--app-height);background:#0b1120;flex-direction:column;display:flex;position:relative;overflow:hidden}.map-wrapper{z-index:1;position:absolute;inset:0}.mapbox-container{outline:none;width:100%;height:100%}.wind-canvas-layer,.scalar-field-layer,.wave-particle-layer,.wind-shading-layer{pointer-events:none;z-index:2;width:100%;height:100%;position:absolute;top:0;left:0}.scalar-field-layer,.wind-shading-layer{z-index:1;mix-blend-mode:screen}.wave-particle-layer{z-index:2}.top-nav-bar{top:calc(16px + var(--safe-top));left:calc(16px + var(--safe-left));right:calc(16px + var(--safe-right));z-index:30;box-sizing:border-box;flex-wrap:wrap;justify-content:space-between;align-items:center;gap:12px;max-width:1400px;margin:0 auto;padding:10px 18px;display:flex;position:absolute}.brand-section{flex-wrap:wrap;align-items:center;gap:10px;display:flex}.brand-logo{color:#0b1120;background:linear-gradient(135deg,#00f2fe,#4facfe);border-radius:10px;justify-content:center;align-items:center;width:36px;height:36px;display:flex}.brand-title{letter-spacing:-.5px;font-size:19px}.model-badge{text-transform:uppercase;letter-spacing:1px;color:#34d399;background:#10b98133;border:1px solid #10b98166;border-radius:6px;padding:3px 8px;font-size:11px;font-weight:700}.nav-controls{flex-wrap:wrap;align-items:center;gap:8px;max-width:100%;display:flex}.region-pills{border:1px solid var(--glass-border);background:#0f172a99;border-radius:9999px;flex-wrap:wrap;gap:4px;padding:4px;display:flex}.legend-card{right:calc(24px + var(--safe-right));top:var(--panel-top);z-index:10;flex-direction:column;gap:12px;width:240px;padding:16px;display:flex;position:absolute}.legend-title{font-family:var(--font-heading);color:var(--text-muted);text-transform:uppercase;letter-spacing:.5px;justify-content:space-between;align-items:center;font-size:13px;font-weight:600;display:flex}.color-bar{background:linear-gradient(90deg,#2b83ba 0%,#5eace0 20%,#a8dbd9 40%,#ffffbf 60%,#fdae61 80%,#d7191c 90%,#9e0142 100%);border-radius:4px;width:100%;height:8px;box-shadow:0 2px 8px #0006}.legend-labels{height:14px;color:var(--text-muted);font-size:11px;font-weight:600;position:relative}.legend-labels span{white-space:nowrap;position:absolute;top:0;transform:translate(-50%)}.legend-labels span:first-child{transform:none}.legend-labels span:last-child{transform:translate(-100%)}.legend-unit{color:var(--accent-cyan);font-size:11px;font-weight:700}.forecast-popup{left:24px;top:var(--panel-top);width:320px;max-height:calc(var(--app-height) - var(--panel-top) - var(--timeline-height,126px) - var(--safe-bottom) - 36px);overscroll-behavior:contain;z-index:15;border-color:#00f2fe4d;flex-direction:column;gap:16px;padding:20px;display:flex;position:absolute;overflow-y:auto;box-shadow:0 12px 40px #000000a6}.popup-header{border-bottom:1px solid var(--glass-border);justify-content:space-between;align-items:center;padding-bottom:12px;display:flex}.wind-speed-display{font-family:var(--font-heading);align-items:baseline;gap:6px;font-size:38px;font-weight:800;line-height:1;display:flex}.wind-speed-unit{color:var(--text-muted);font-size:16px;font-weight:600}.compass-dial{background:radial-gradient(circle,#00f2fe1a 0%,#0000 70%);border:2px dashed #fff3;border-radius:50%;justify-content:center;align-items:center;width:54px;height:54px;display:flex;position:relative}.compass-arrow{transition:transform var(--transition-smooth);color:var(--accent-cyan);filter:drop-shadow(0 0 6px var(--accent-cyan));display:flex}.compass-arrow svg{transform:translate(-.583px,.583px)}.bottom-slider-container{bottom:calc(20px + var(--safe-bottom));left:calc(20px + var(--safe-left));right:calc(20px + var(--safe-right));z-index:10;box-sizing:border-box;flex-direction:column;gap:12px;max-width:980px;margin:0 auto;padding:14px 22px;display:flex;position:absolute}.slider-controls-row{flex-wrap:wrap;justify-content:space-between;align-items:center;gap:10px;display:flex}.time-stamp{font-family:var(--font-heading);flex-wrap:wrap;align-items:center;gap:8px;font-size:16px;font-weight:700;display:flex}.time-tag{font-size:12px;font-family:var(--font-body);color:var(--accent-cyan);background:#00f2fe26;border:1px solid #00f2fe4d;border-radius:6px;padding:2px 8px}.play-pause-btn{color:#0b1120;cursor:pointer;width:44px;height:44px;transition:all var(--transition-fast);background:linear-gradient(135deg,#00f2fe,#4facfe);border:none;border-radius:50%;justify-content:center;align-items:center;display:flex;box-shadow:0 2px 10px #00f2fe40}.play-pause-btn:hover{transform:scale(1.06)}.play-pause-btn:active{transform:scale(.96)}.timeline-track{padding-top:4px;position:relative}.timeline-rail{pointer-events:none;background:#ffffff21;border-radius:4px;height:8px;position:absolute;top:4px;left:0;right:0;overflow:hidden}.timeline-route-band{background:linear-gradient(90deg,#8b5cf6d9,#00f2fed9);position:absolute;top:0;bottom:0;box-shadow:inset 0 0 0 1px #ffffff2e}.timeline-day-mark{background:#ffffff4d;width:1px;margin-left:-.5px;position:absolute;top:2px;bottom:2px}.timeline-day-mark.labelled{background:#ffffff8c;top:0;bottom:0}.timeline-now-mark{background:#f8fafcbf;width:2px;margin-left:-1px;position:absolute;top:-2px;bottom:-2px}.timeline-slider{appearance:none;cursor:pointer;z-index:2;background:0 0;border-radius:4px;outline:none;width:100%;height:8px;display:block;position:relative}.timeline-slider::-webkit-slider-thumb{appearance:none;cursor:pointer;width:20px;height:20px;transition:transform var(--transition-fast);background:#00f2fe;border:3px solid #0b1120;border-radius:50%;box-shadow:0 0 8px #00f2fe8c}.timeline-slider::-moz-range-thumb{cursor:pointer;background:#00f2fe;border:3px solid #0b1120;border-radius:50%;width:20px;height:20px}.timeline-slider::-webkit-slider-thumb:hover{transform:scale(1.2)}.slider-ticks{height:22px;color:var(--text-muted);margin-top:10px;font-size:11px;font-weight:500;position:relative}.slider-ticks span,.slider-ticks button{white-space:nowrap;line-height:16px;position:absolute;top:3px}.slider-ticks.has-passage{height:40px}.slider-ticks .tick-now{color:var(--accent-cyan);font-weight:700;font-size:inherit;cursor:pointer;transition:color var(--transition-fast), background var(--transition-fast), border-color var(--transition-fast), box-shadow var(--transition-fast);background:#00f2fe1f;border:1px solid #00f2fe73;border-radius:999px;padding:2px 9px;font-family:inherit;top:0}.slider-ticks .tick-now:hover,.slider-ticks .tick-now:focus-visible{color:#0b1120;background:var(--accent-cyan);border-color:var(--accent-cyan);outline:none;box-shadow:0 0 10px #00f2fe73}.slider-ticks .tick-passage{color:var(--accent-purple);align-items:center;gap:4px;font-weight:600;display:inline-flex;top:24px}.loading-badge{color:var(--accent-gold);background:#f59e0b26;border:1px solid #f59e0b4d;border-radius:20px;align-items:center;gap:8px;padding:4px 10px;font-size:12px;animation:1.5s ease-in-out infinite pulseGlow;display:inline-flex}@media (width<=768px){.top-nav-bar{top:calc(8px + var(--safe-top));padding:10px 16px}.bottom-slider-container{bottom:calc(12px + var(--safe-bottom));left:calc(16px + var(--safe-left));right:calc(16px + var(--safe-right));padding:12px 16px}.nav-controls{width:100%}.mapboxgl-ctrl-bottom-right{display:none}.mapboxgl-ctrl-bottom-left{bottom:calc(var(--timeline-height,126px) + var(--safe-bottom) + 18px)}.fullscreen-toggle-btn{right:calc(16px + var(--safe-right));bottom:calc(var(--timeline-height,126px) + var(--safe-bottom) + 22px);z-index:5;border:1px solid var(--glass-border);width:32px;height:32px;color:var(--text-muted);cursor:pointer;transition:color var(--transition-fast), background var(--transition-fast);background:#0b11208c;border-radius:50%;justify-content:center;align-items:center;padding:0;display:flex;position:absolute}.fullscreen-toggle-btn:active,.fullscreen-toggle-btn:focus-visible,.fullscreen-toggle-btn.active{color:var(--text-main);background:#0b1120cc;outline:none}.install-hint{right:calc(16px + var(--safe-right));bottom:calc(var(--timeline-height,126px) + var(--safe-bottom) + 22px + 32px + 10px);z-index:40;width:min(290px,100vw - 32px);color:var(--text-main);flex-direction:column;gap:10px;padding:14px 16px;font-size:13px;line-height:1.45;display:flex;position:absolute}.install-hint-header{font-family:var(--font-heading);justify-content:space-between;align-items:center;font-size:14px;display:flex}.install-hint-close{color:var(--text-muted);cursor:pointer;background:0 0;border:none;margin:-4px -6px -4px 0;padding:4px;display:flex}.install-hint p{color:var(--text-muted)}.install-hint ol{flex-direction:column;gap:4px;padding-left:18px;display:flex}.install-hint ol svg{vertical-align:-2px;color:var(--accent-cyan)}}.spot-tooltip-layer{z-index:60;pointer-events:none;position:absolute;inset:0}.spot-tooltip{color:#f8fafc;pointer-events:auto;background:#0b1120eb;border:1px solid #00f2fe80;border-radius:8px;align-items:stretch;display:flex;box-shadow:0 4px 14px #0000008c,0 0 12px #00f2fe33}.spot-tooltip-value{color:inherit;font-family:var(--font-heading);white-space:nowrap;font-variant-numeric:tabular-nums;cursor:pointer;background:0 0;border:none;padding:5px 11px;font-size:15px;font-weight:700;line-height:1.2}.spot-tooltip-expand{color:var(--accent-cyan);cursor:pointer;transition:background var(--transition-fast), color var(--transition-fast);background:0 0;border:none;border-left:1px solid #00f2fe4d;border-radius:0 7px 7px 0;align-items:center;padding:0 7px;display:flex}.spot-tooltip-expand:hover{color:#f8fafc;background:#00f2fe29}.spot-tooltip-expand[hidden]{display:none}.planner-toggle-btn{border-color:#8b5cf673;padding:6px 14px;font-size:12px;font-weight:600}.planner-toggle-btn.active{color:#fff;background:#8b5cf647;border-color:#8b5cf6b3}.route-planner{left:24px;top:var(--panel-top);max-height:calc(var(--app-height) - var(--panel-top) - var(--timeline-height,126px) - var(--safe-bottom) - 36px);z-index:16;overscroll-behavior:contain;border-color:#8b5cf652;flex-direction:column;gap:14px;width:340px;padding:18px;display:flex;position:absolute;bottom:auto;overflow-y:auto;box-shadow:0 12px 40px #000000a6,0 0 20px #8b5cf629}.route-planner::-webkit-scrollbar{width:6px}.route-planner::-webkit-scrollbar-thumb{background:#8b5cf666;border-radius:3px}.planner-header{border-bottom:1px solid var(--glass-border);justify-content:space-between;align-items:center;padding-bottom:12px;display:flex}.icon-btn{color:var(--text-muted);cursor:pointer;transition:all var(--transition-fast);background:0 0;border:none;border-radius:6px;padding:4px;display:flex}.icon-btn:hover{background:var(--glass-bg-hover);color:var(--text-main)}.planner-section{flex-direction:column;gap:8px;display:flex}.planner-label{letter-spacing:.6px;text-transform:uppercase;color:var(--text-dim);align-items:center;gap:5px;font-size:11px;font-weight:700;display:flex}.waypoint-row{border:1px solid var(--glass-border);width:100%;color:var(--text-main);font-family:var(--font-body);cursor:pointer;text-align:left;transition:all var(--transition-fast);background:#0f172a99;border-radius:10px;align-items:center;gap:10px;padding:9px 11px;font-size:12.5px;display:flex}.waypoint-row:hover{background:var(--glass-bg-hover);border-color:var(--glass-border-highlight)}.waypoint-row.picking{background:#8b5cf624;border-color:#8b5cf6;animation:1.6s ease-in-out infinite pick-pulse}@keyframes pick-pulse{0%,to{box-shadow:0 0 #8b5cf666}50%{box-shadow:0 0 0 5px #8b5cf600}}.waypoint-badge{border-radius:50%;flex-shrink:0;width:20px;height:20px}.waypoint-text{font-variant-numeric:tabular-nums;text-overflow:ellipsis;white-space:nowrap;flex:1;overflow:hidden}.planner-inline-actions{flex-wrap:wrap;align-items:center;gap:6px;display:flex}.btn-glass.tiny{gap:4px;padding:4px 9px;font-size:10.5px}.btn-glass.tiny:disabled{opacity:.35;cursor:not-allowed}.planner-hint{color:var(--text-dim);font-variant-numeric:tabular-nums;margin-left:auto;font-size:10px}.boat-pills,.pill-row{flex-wrap:wrap;gap:6px;display:flex}.planner-toggles{flex-wrap:wrap;gap:14px;margin-top:2px;display:flex}.planner-toggle{color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:5px;font-size:11.5px;display:flex}.planner-toggle input{accent-color:#8b5cf6;cursor:pointer}.motor-threshold{color:var(--text-muted);cursor:pointer;-webkit-user-select:none;user-select:none;align-items:center;gap:6px;margin-top:6px;font-size:11.5px;display:flex}.motor-threshold input{border:1px solid var(--glass-border);width:52px;color:var(--text-main);font:inherit;font-variant-numeric:tabular-nums;text-align:right;background:#ffffff0d;border-radius:5px;padding:3px 6px}.motor-threshold input:focus-visible{outline-offset:1px;outline:1px solid #a855f7}.planner-toggle.disabled{opacity:.4;cursor:not-allowed}.planner-toggle.disabled input{cursor:not-allowed}.coastline-row{flex-wrap:wrap;align-items:center;gap:12px;display:flex}.coastline-trace-btn{min-width:132px}.coastline-status{color:var(--text-dim);font-variant-numeric:tabular-nums;font-size:10.5px;line-height:1.5}.coastline-legend{flex-wrap:wrap;align-items:center;gap:9px;margin-top:5px;display:flex}.coastline-key{align-items:center;gap:4px;display:inline-flex}.coastline-key i{border:1px solid #f8fafc2e;border-radius:2px;flex-shrink:0;width:9px;height:9px}.coastline-capped{color:#fcd34d;margin-top:4px;font-style:normal;display:block}.coastline-legend em{opacity:.75;flex-basis:100%;font-style:normal}.calculate-btn{color:#0b1120;width:100%;font-family:var(--font-heading);cursor:pointer;transition:all var(--transition-fast);background:linear-gradient(135deg,#00f2fe,#4facfe);border:none;border-radius:10px;justify-content:center;align-items:center;gap:8px;padding:11px;font-size:13px;font-weight:700;display:flex;box-shadow:0 4px 16px #00f2fe47}.calculate-btn:hover:not(:disabled){transform:translateY(-1px);box-shadow:0 6px 22px #00f2fe6b}.calculate-btn:disabled{opacity:.4;cursor:not-allowed;box-shadow:none}.mini-spinner{border:2px solid #0b11204d;border-top-color:#0b1120;border-radius:50%;width:13px;height:13px;animation:.7s linear infinite spin}.mini-spinner.light{border-color:#f8fafc40;border-top-color:var(--accent-cyan,#00f2fe);width:11px;height:11px}@keyframes spin{to{transform:rotate(360deg)}}.planner-alert{border-radius:9px;align-items:flex-start;gap:7px;padding:9px 11px;font-size:11.5px;line-height:1.45;display:flex}.planner-alert.error{color:#fda4af;background:#f43f5e21;border:1px solid #f43f5e59}.planner-alert.warn{color:#fcd34d;background:#f59e0b1f;border:1px solid #f59e0b52}.planner-alert svg{flex-shrink:0;margin-top:1px}.route-stats{grid-template-columns:repeat(3,1fr);gap:8px;display:grid}.route-stat{border:1px solid var(--glass-border);background:#0f172a99;border-radius:10px;flex-direction:column;align-items:center;gap:2px;padding:10px 4px;display:flex}.route-stat .stat-value{font-family:var(--font-heading);color:var(--text-main);font-variant-numeric:tabular-nums;font-size:16px;font-weight:700;line-height:1.15}.route-stat .stat-value em{color:var(--text-muted);margin-left:1px;font-size:10px;font-style:normal}.route-stat .stat-label{text-transform:uppercase;letter-spacing:.5px;color:var(--text-dim);font-size:9.5px;font-weight:600}.route-summary-lines{color:var(--text-muted);flex-direction:column;gap:5px;font-size:11.5px;line-height:1.5;display:flex}.route-summary-lines div{flex-wrap:wrap;align-items:center;gap:5px;display:flex}.route-summary-lines strong{color:var(--text-main)}.departure-window{background:#00f2fe0d;border:1px solid #00f2fe2e;border-radius:10px;flex-direction:column;gap:8px;padding:10px 12px;display:flex}.departure-chosen{color:var(--text-muted);font-size:12px;line-height:1.5}.departure-chosen strong{color:var(--text-main)}.departure-chosen em{color:#fbbf24;margin-top:3px;font-style:normal;display:block}.departure-tries{flex-direction:column;gap:2px;max-height:190px;margin:0;padding:0;list-style:none;display:flex;overflow-y:auto}.departure-tries li{color:var(--text-muted);font-variant-numeric:tabular-nums;border-radius:6px;flex-wrap:wrap;align-items:center;gap:8px;padding:4px 7px;font-size:11px;display:flex}.departure-tries li span{align-items:center;gap:3px;display:inline-flex}.departure-tries .try-hour{min-width:40px;color:var(--text-main);font-weight:600}.departure-tries li.is-best{color:var(--text-main);background:#34d39924}.departure-tries li.is-best .try-hour{color:#34d399}.departure-tries li.is-failed{opacity:.45}.departure-tries .try-failed{font-style:italic}.planner-disclosure{border:none;border-top:1px solid var(--glass-border);width:100%;color:var(--text-muted);font-family:var(--font-body);cursor:pointer;transition:color var(--transition-fast);background:0 0;align-items:center;gap:5px;padding:7px 0;font-size:11.5px;font-weight:600;display:flex}.planner-disclosure:hover{color:var(--accent-cyan)}.planner-replan{align-items:center;gap:4px;display:flex}.planner-replan .planner-disclosure{min-width:0}.planner-replan .icon-btn{border-top:1px solid var(--glass-border);border-radius:0;padding:7px 4px}.replan-ends{white-space:nowrap;text-overflow:ellipsis;font-variant-numeric:tabular-nums;min-width:0;color:var(--text-dim);align-items:center;gap:5px;font-size:11px;font-weight:600;display:flex;overflow:hidden}.replan-ends i{border-radius:50%;flex-shrink:0;width:7px;height:7px}.replan-ends svg{color:var(--text-muted);flex-shrink:0}.leg-list{background:#0f172a80;border-radius:8px;flex-direction:column;gap:1px;max-height:190px;padding:4px;display:flex;overflow-y:auto}.leg-list::-webkit-scrollbar{width:5px}.leg-list::-webkit-scrollbar-thumb{background:#94a3b859;border-radius:3px}.leg-row{color:var(--text-muted);font-variant-numeric:tabular-nums;border-radius:5px;grid-template-columns:34px 58px 1fr 50px;align-items:center;gap:6px;padding:5px 6px;font-size:10.5px;display:grid}.leg-row:hover{background:#ffffff0a}.leg-row.maneuver{color:var(--text-main);background:#00f2fe14}.leg-row.motoring{background:#a855f717}.leg-row.motoring .leg-mode{color:#c084fc}.leg-time{color:var(--text-dim)}.leg-heading{color:var(--accent-blue);font-weight:600}.leg-detail{text-overflow:ellipsis;white-space:nowrap;overflow:hidden}.leg-mode{text-align:right;color:var(--accent-cyan);font-weight:700}.polar-diagram{border:1px solid var(--glass-border);background:#0f172a80;border-radius:10px;flex-direction:column;gap:8px;padding:10px;display:flex}.polar-legend{flex-wrap:wrap;justify-content:center;gap:8px;font-size:9.5px;font-weight:600;display:flex}.polar-legend-item{opacity:.6;align-items:center;gap:3px;display:flex}.polar-legend-item.active{opacity:1}.polar-legend-item i{border-radius:1px;width:8px;height:2px}.polar-vmg-note{color:var(--text-muted);text-align:center;font-size:10px;line-height:1.5}.planner-footnote{color:var(--text-dim);font-size:10.5px;font-style:italic;line-height:1.5}.route-pin{background:var(--pin-color);width:22px;height:22px;box-shadow:0 0 14px var(--pin-color);cursor:pointer;border:2px solid #0b1120;border-radius:50%}.pick-mode-banner{top:var(--panel-top);z-index:20;color:#0b1120;pointer-events:none;white-space:nowrap;background:#8b5cf6eb;border-radius:9999px;padding:8px 16px;font-size:12px;font-weight:600;position:absolute;left:50%;transform:translate(-50%);box-shadow:0 6px 20px #8b5cf673}@media (width<=900px){.route-planner{left:calc(12px + var(--safe-left));right:calc(12px + var(--safe-right));width:auto;top:calc(130px + var(--safe-top));max-height:calc(var(--app-height) - 130px - var(--safe-top) - var(--safe-bottom) - var(--timeline-height,126px) - 36px)}}@media (width<=768px){.route-planner{width:auto;left:16px;right:16px;top:calc(8px + var(--safe-top) + var(--header-height));max-height:calc(var(--app-height) - var(--safe-top) - var(--safe-bottom) - var(--header-height) - 175px);gap:11px;padding:14px 16px;bottom:auto}.forecast-popup{width:auto;left:16px;right:16px;top:calc(8px + var(--safe-top) + var(--header-height));max-height:calc(var(--app-height) - var(--safe-top) - var(--safe-bottom) - var(--header-height) - 175px);gap:12px;padding:14px 16px}.route-planner.compact{border-top-color:#0000;border-top-left-radius:0;border-top-right-radius:0}.top-nav-bar.has-planner{border-bottom-right-radius:0;border-bottom-left-radius:0}}.boat-marker{filter:drop-shadow(0 0 6px #f8fafcbf);width:26px;height:26px;transition:filter var(--transition-fast);pointer-events:auto;cursor:help;place-items:center;display:grid}.boat-marker[data-phase=WAITING]{opacity:.5;filter:none}.boat-marker[data-phase=ARRIVED] svg path{fill:#34d399}.time-tag.beyond{color:#f59e0b;background:#f59e0b2e;border-color:#f59e0b73}.slider-ticks .tick-beyond{color:#f59e0bbf}.boat-readout{background:#8b5cf61a;border:1px solid #8b5cf652;border-radius:10px;flex-direction:column;gap:8px;padding:11px;display:flex}.boat-readout.arrived{background:#34d3991a;border-color:#34d39952}.boat-readout.waiting{border-color:var(--glass-border);background:#0f172a99}.boat-readout-head{text-transform:uppercase;letter-spacing:.4px;color:var(--text-main);justify-content:space-between;align-items:center;gap:8px;font-size:11px;font-weight:700;display:flex}.boat-readout-head>span:first-child{align-items:center;gap:5px;display:flex}.boat-readout-coord{text-transform:none;letter-spacing:0;color:var(--text-muted);font-variant-numeric:tabular-nums;font-weight:600}.boat-progress{background:#ffffff1a;border-radius:2px;height:4px;overflow:hidden}.boat-progress span{height:100%;transition:width var(--transition-fast);background:linear-gradient(90deg,#00f2fe,#8b5cf6);border-radius:2px;display:block}.boat-readout.arrived .boat-progress span{background:#34d399}.boat-readout-grid{color:var(--text-main);font-variant-numeric:tabular-nums;grid-template-columns:1fr 1fr;gap:4px 10px;font-size:11px;display:grid}.boat-readout-grid em{text-transform:uppercase;letter-spacing:.4px;color:var(--text-dim);font-size:9.5px;font-style:normal;font-weight:600;display:block}.boat-readout-hint{color:var(--text-muted);font-size:11px;line-height:1.45}.leg-row.active{color:var(--text-main);background:#8b5cf638;box-shadow:inset 2px 0 #8b5cf6}.model-badge{align-items:center;gap:4px;display:inline-flex}.model-badge.warn{color:var(--accent-gold);background:#f59e0b2e;border-color:#f59e0b80}.model-badge.run{color:#34d399;background:#34d39924;border-color:#34d39973}.spin-icon{animation:1.1s linear infinite spin}.datapoint-menu{position:relative}.datapoint-trigger{justify-content:space-between;min-width:150px;padding:7px 14px;font-size:13px;font-weight:600}.datapoint-trigger-label{text-align:left;flex:1}.datapoint-trigger .chevron{transition:transform var(--transition-fast)}.datapoint-trigger .chevron.flipped{transform:rotate(180deg)}.datapoint-dropdown{z-index:40;background:#0c1424f7;flex-direction:column;gap:4px;width:320px;max-height:min(66vh,560px);padding:8px;display:flex;position:absolute;top:calc(100% + 8px);left:0;overflow-y:auto}.datapoint-group+.datapoint-group{border-top:1px solid var(--glass-border);margin-top:6px;padding-top:6px}.datapoint-group-title{letter-spacing:1.2px;text-transform:uppercase;color:var(--text-dim);padding:4px 8px;font-size:10px;font-weight:700}.datapoint-option{width:100%;color:var(--text-main);font-family:var(--font-body);text-align:left;cursor:pointer;transition:background var(--transition-fast), border-color var(--transition-fast);background:0 0;border:1px solid #0000;border-radius:10px;align-items:center;gap:10px;padding:8px;display:flex}.datapoint-option:hover:not(:disabled){background:#94a3b81f}.datapoint-option.selected{background:#00f2fe1f;border-color:#00f2fe66}.datapoint-option.missing{opacity:.42;cursor:not-allowed}.datapoint-option-icon{color:var(--accent-cyan);flex-shrink:0}.datapoint-option-text{flex-direction:column;gap:1px;min-width:0;display:flex}.datapoint-option-text strong{font-size:13px;font-weight:600}.datapoint-option-text em{color:var(--text-muted);font-size:11px;font-style:normal;line-height:1.35}.datapoint-option-check{color:var(--accent-cyan);flex-shrink:0;margin-left:auto}.settings-toggle-btn{padding:7px 14px;font-size:12px;font-weight:600}@media (width<=768px){.datapoint-trigger{gap:6px;min-width:0;padding:7px 11px}.settings-toggle-btn{margin-left:auto;padding:7px 10px}.settings-toggle-btn span{display:none}.datapoint-dropdown{width:min(320px,100vw - 40px)}}.drawer-scrim{z-index:45;animation:scrimIn var(--transition-fast) forwards;background:#02061759;position:absolute;inset:0}@keyframes scrimIn{0%{opacity:0}to{opacity:1}}.settings-drawer{z-index:50;width:340px;max-width:88vw;padding:18px;padding-top:calc(18px + var(--safe-top));padding-right:calc(18px + var(--safe-right));padding-bottom:calc(18px + var(--safe-bottom));transition:transform var(--transition-smooth);visibility:hidden;border-radius:18px 0 0 18px;flex-direction:column;gap:22px;display:flex;position:absolute;top:0;bottom:0;right:0;overflow-y:auto;transform:translate(100%)}.settings-drawer.open{visibility:visible;transform:translate(0)}.drawer-header{border-bottom:1px solid var(--glass-border);justify-content:space-between;align-items:center;padding-bottom:12px;display:flex}.drawer-section{flex-direction:column;gap:10px;display:flex}.drawer-label{letter-spacing:1.2px;text-transform:uppercase;color:var(--text-dim);align-items:center;gap:6px;font-size:10px;font-weight:700;display:flex}.drawer-options{grid-template-columns:1fr 1fr;gap:8px;display:grid}.drawer-option{border:1px solid var(--glass-border);color:var(--text-main);font-family:var(--font-body);text-align:left;cursor:pointer;transition:background var(--transition-fast), border-color var(--transition-fast);background:#1e293b80;border-radius:12px;flex-direction:column;gap:2px;padding:10px;display:flex}.drawer-option:hover{background:var(--glass-bg-hover)}.drawer-option.selected{background:#00f2fe24;border-color:#00f2fe8c}.drawer-option:disabled{cursor:default}.drawer-options[data-disabled=true]{opacity:.4}.drawer-sublabel{letter-spacing:.6px;text-transform:uppercase;color:var(--text-muted);margin-top:4px;font-size:10px;font-weight:600}.drawer-switch{border:1px solid var(--glass-border);color:var(--text-main);font-family:var(--font-body);text-align:left;cursor:pointer;transition:background var(--transition-fast), border-color var(--transition-fast);background:#1e293b80;border-radius:12px;align-items:center;gap:11px;padding:10px;display:flex}.drawer-switch:hover{background:var(--glass-bg-hover)}.drawer-switch.on{background:#00f2fe24;border-color:#00f2fe8c}.drawer-switch-track{width:34px;height:20px;transition:background var(--transition-fast);background:#94a3b859;border-radius:9999px;flex:none;padding:3px}.drawer-switch.on .drawer-switch-track{background:var(--accent-cyan)}.drawer-switch-knob{width:14px;height:14px;transition:transform var(--transition-fast);background:#0b1120;border-radius:50%;display:block}.drawer-switch.on .drawer-switch-knob{transform:translate(14px)}.drawer-switch-text{flex-direction:column;gap:2px;display:flex}.drawer-switch-text strong{font-size:13px}.drawer-switch-text em{color:var(--text-muted);font-size:11px;font-style:normal}.drawer-option strong{font-size:13px;font-weight:600}.drawer-option em{color:var(--text-muted);font-size:10.5px;font-style:normal;line-height:1.3}.drawer-note{color:var(--text-muted);font-size:11.5px;line-height:1.5}.profile-options>.profile-option:last-child:nth-child(odd){grid-column:1/-1}.profile-option{gap:4px}.profile-swatch{border:1px solid var(--glass-border);border-radius:6px;height:18px;margin-bottom:2px}