/* The tide pages of huntgrid.net (docs/fishing/PLAN.md F21.9): copied to assets/tides.css only when they build, so
   site.css (and every other page's address for it) stays as it is. Colours are site.css's tokens only. */
.tide-label { font-weight: 700; margin-bottom: 0.25rem; }
.tide-days { display: flex; flex-wrap: wrap; gap: 0.5rem; margin: 0 0 1rem; }
.tide-days .btn { min-height: 48px; color: var(--primary); }
.tide-days .btn[aria-pressed='true'] { background: var(--primary); border-color: var(--primary); color: var(--surface); }
.tide-figure { margin: 0 0 1.5rem; padding: 1rem; border-radius: 0.9rem; border: 1px solid var(--border); background: var(--surface); box-shadow: var(--shadow); }
.tide-figure figcaption { color: var(--muted); font-size: 0.9rem; margin-top: 0.5rem; }
.tide-svg { display: block; width: 100%; height: auto; overflow: visible; }
.tide-curve { fill: none; stroke: var(--primary); stroke-width: 3; stroke-linejoin: round; }
.tide-area { fill: var(--primary); fill-opacity: 0.12; stroke: none; }
.tide-grid { stroke: var(--border); stroke-width: 1; }
.tide-zero { stroke: var(--muted); stroke-width: 1; stroke-dasharray: 2 4; }
.tide-newyear { stroke: var(--muted); stroke-width: 2; stroke-dasharray: 6 4; }
.tide-now { stroke: var(--accent); stroke-width: 2; }
.tide-now-label { fill: var(--accent-text); font-size: 13px; font-weight: 700; }
.tide-axis { fill: var(--muted); font-size: 13px; }
.tide-mark { fill: var(--text); font-size: 15px; font-weight: 700; }
.tide-mark-sub { fill: var(--muted); font-size: 14px; }
.tide-high { fill: var(--primary); stroke: var(--surface); stroke-width: 2; }
.tide-low { fill: var(--surface); stroke: var(--primary); stroke-width: 3; }
.tide-table td { white-space: nowrap; }
.tide-table .tide-day th { padding-top: 1rem; font-weight: 700; background: var(--bg); }
#tide-form .btn { white-space: normal; text-align: center; max-width: 100%; }
@media (max-width: 480px) { .tide-table th, .tide-table td { padding: 0.6rem 0.6rem; } }
.tide-table td.high { font-weight: 700; }
.tide-table tr.past td { color: var(--muted); }
.tide-table-title { font-size: clamp(1.7rem, 3.5vw, 2.2rem); }
.tide-error { color: var(--accent-text); font-weight: 600; }
.tide-facts { display: grid; grid-template-columns: repeat(auto-fit, minmax(min(100%, 14rem), 1fr)); gap: 0.75rem; padding: 0; margin: 0 0 1rem; list-style: none; }
.tide-facts li { display: flex; flex-direction: column; padding: 0.75rem 1rem; border-radius: 0.6rem; background: var(--surface); border: 1px solid var(--border); }
.tide-facts span { color: var(--muted); font-size: 0.85rem; }
.tide-list { columns: 16rem; column-gap: 2rem; padding: 0; margin: 0; list-style: none; }
.tide-list li { break-inside: avoid; padding: 0 0 0.5rem; }
.tide-list a { display: flex; align-items: center; min-height: 48px; line-height: 1.3; }
.tide-list small { display: block; color: var(--muted); margin-top: -0.5rem; }