.tide-graph{margin:4px 0 6px;min-width:0}
.tide-curve-svg{display:block;width:100%;height:110px;overflow:hidden}
.tide-grid{stroke:#c8c9c8;stroke-width:1;stroke-dasharray:3 5;opacity:.6}
.tide-baseline{stroke:#b5bec7;stroke-width:1}
.tide-water-line{fill:none;stroke:#012169;stroke-width:3.5;stroke-linecap:round}
.tide-event-point{fill:#faf7f1;stroke:#012169;stroke-width:2}
.tide-axis{font:12px 'Segoe UI',Arial,sans-serif;fill:#68747e}
.tide-point-label{font:600 12px 'Segoe UI',Arial,sans-serif;fill:#012169}
.tide-now-line{stroke:#c8102e;stroke-width:2;stroke-dasharray:4 3}
.tide-now-dot{fill:#c8102e;stroke:#fff;stroke-width:2}
.tide-now-badge{fill:#c8102e}
.tide-now-label{font:700 13px 'Segoe UI',Arial,sans-serif;fill:#fff}
.tide-curve-note{font-size:8px;color:#667078;text-align:center;margin-top:1px}
.tide-graph-empty{font-size:12px;color:#667078;padding:12px 0}
.tide-events{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:4px 8px;border-top:1px solid #d9d6cf;padding-top:5px}
.tide-event{display:flex;justify-content:space-between;align-items:center;gap:5px;font-size:10px;white-space:nowrap}
.tide-event b{color:#012169;font-size:10px}.tide-event time{font-weight:700;font-variant-numeric:tabular-nums}.tide-event span{color:#667078}
.tv-view .tide-graph-panel .tide-source{font-size:8px;margin-top:5px}

/* Keep the existing TV pane fixed; use its width for readable tide readings. */
.tide-visual{display:grid;grid-template-columns:minmax(0,1fr) 142px;gap:12px;align-items:center;margin-top:5px}
.tide-visual .tide-graph{margin:0;min-width:0}
.tide-visual .tide-events{display:grid;grid-template-columns:1fr;border:0;padding:0;gap:5px}
.tide-visual .tide-event{display:flex;align-items:center;justify-content:space-between;gap:8px;padding:5px 8px;background:#e9eef3;border-radius:5px;white-space:nowrap}
.tide-visual .tide-event>div{display:flex;flex-direction:column;gap:2px}
.tide-visual .tide-event b{font:700 9px 'Segoe UI',Arial,sans-serif;color:#29465e;letter-spacing:.3px}
.tide-visual .tide-event span{font-size:15px;font-weight:650;color:#012169}
.tide-visual .tide-event time{font-size:20px;font-weight:750;color:#012169;font-variant-numeric:tabular-nums}
.tide-water-line{stroke-width:5}.tide-now-line{stroke-width:3}
.tide-axis{font-size:19px;fill:#374d60}.tide-point-label{font-size:20px;font-weight:700}
.tide-now-label{font-size:22px}.tide-curve-note{font-size:10px;color:#465765}
.tv-view .tide-visual{grid-template-columns:minmax(0,1fr) calc(142 * var(--tv-unit));gap:calc(10 * var(--tv-unit));margin-top:calc(4 * var(--tv-unit))}
.tv-view .tide-curve-svg{height:calc(91 * var(--tv-unit))}
.tv-view .tide-visual .tide-events{gap:calc(4 * var(--tv-unit))}
.tv-view .tide-visual .tide-event{padding:calc(3 * var(--tv-unit)) calc(7 * var(--tv-unit));gap:calc(8 * var(--tv-unit));line-height:1}
.tv-view .tide-visual .tide-event b{font-size:calc(8 * var(--tv-unit))}
.tv-view .tide-visual .tide-event span{font-size:calc(14 * var(--tv-unit))}
.tv-view .tide-visual .tide-event time{font-size:calc(19 * var(--tv-unit))}
.tv-view .tide-curve-note{font-size:calc(9 * var(--tv-unit));margin-top:0}
.tv-view .tide-graph-panel .panel-label{font-size:calc(12 * var(--tv-unit));letter-spacing:.7px}
.tv-view .tide-graph-panel .tide-source{font-size:calc(9 * var(--tv-unit));line-height:1.2;margin-top:calc(4 * var(--tv-unit));color:#465765}
.tv-view .tide-visual-dense{grid-template-columns:minmax(0,1fr) calc(170 * var(--tv-unit))}
.tv-view .tide-visual-dense .tide-event{padding:calc(2 * var(--tv-unit)) calc(5 * var(--tv-unit))}
.tv-view .tide-visual-dense .tide-event>div{flex-direction:row;gap:calc(7 * var(--tv-unit));align-items:center}
.tv-view .tide-visual-dense .tide-event b{font-size:calc(7 * var(--tv-unit))}
.tv-view .tide-visual-dense .tide-event time{font-size:calc(14 * var(--tv-unit))}
.tv-view .tide-visual-dense .tide-event span{font-size:calc(12 * var(--tv-unit))}