.hero::before {
  display: none !important;
}

.topbar {
  position: static !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: auto !important;
  display: grid !important;
  grid-template-columns: minmax(0, 1fr) auto !important;
  align-items: center !important;
  gap: 14px !important;
  width: 100% !important;
  min-height: 72px !important;
  margin: 0 0 20px !important;
  padding: 9px 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
  transform: none !important;
  overflow: visible !important;
}

.brand-row {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-self: start !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  overflow: visible !important;
  aspect-ratio: auto !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
  text-decoration: none !important;
}

.brand-logo-picture {
  display: flex !important;
  align-items: center !important;
  min-width: 0 !important;
  max-width: 100% !important;
  margin: 0 !important;
  padding: 0 !important;
  line-height: 0 !important;
  visibility: visible !important;
  opacity: 1 !important;
  background: transparent !important;
  border: 0 !important;
  border-radius: 0 !important;
  box-shadow: none !important;
}

.brand-logo {
  display: block !important;
  width: clamp(180px, 20vw, 230px) !important;
  height: auto !important;
  max-width: 100% !important;
  max-height: 60px !important;
  margin: 0 !important;
  object-fit: contain !important;
  object-position: left center !important;
  visibility: visible !important;
  opacity: 1 !important;
  filter: none !important;
  transform: none !important;
}

.top-actions {
  position: static !important;
  display: flex !important;
  align-items: center !important;
  justify-self: end !important;
  gap: 7px !important;
  flex: 0 0 auto !important;
  margin-left: auto !important;
  transform: none !important;
}

.menu-button {
  position: static !important;
  transform: none !important;
}

.quick-nav {
  position: static !important;
  inset: auto !important;
  top: auto !important;
  right: auto !important;
  bottom: auto !important;
  left: auto !important;
  z-index: auto !important;
  width: 100% !important;
  margin: -8px 0 22px !important;
  padding: 12px !important;
  border: 0 !important;
  border-radius: 0 !important;
  background: transparent !important;
  box-shadow: none !important;
  backdrop-filter: none !important;
  -webkit-backdrop-filter: none !important;
  filter: none !important;
  transform: none !important;
}

.quick-nav[hidden] {
  display: none !important;
}

.quick-nav a,
.v08-guide-group button {
  color: #2e415d !important;
  background: #f7fafe !important;
}

.quick-nav a:hover,
.v08-guide-group button:hover {
  color: #0b5ed7 !important;
  background: #eaf3ff !important;
}

.rotezi-tide-wave {
  margin: 18px 0 16px;
  border: 1px solid rgba(18, 123, 255, 0.16);
  border-radius: 22px;
  background: linear-gradient(155deg, rgba(8, 51, 107, 0.98), rgba(13, 91, 215, 0.96));
  box-shadow: 0 18px 40px rgba(8, 54, 120, 0.16);
  overflow: hidden;
  color: #ffffff;
}

.rotezi-tide-days {
  display: flex;
  gap: 7px;
  padding: 12px 12px 0;
  overflow-x: auto;
  scrollbar-width: none;
}

.rotezi-tide-days::-webkit-scrollbar {
  display: none;
}

.rotezi-tide-day {
  flex: 0 0 auto;
  min-height: 36px;
  padding: 8px 13px;
  border: 1px solid rgba(255,255,255,0.22);
  border-radius: 999px;
  background: rgba(255,255,255,0.08);
  color: rgba(255,255,255,0.82);
  font: inherit;
  font-size: 12px;
  font-weight: 800;
  cursor: pointer;
}

.rotezi-tide-day.is-active {
  background: #ffffff;
  color: #0b4d9f;
  border-color: #ffffff;
}

.rotezi-tide-wave-head {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 18px;
  align-items: end;
  padding: 18px 18px 10px;
}

.rotezi-tide-wave-head > div {
  display: grid;
  gap: 5px;
}

.rotezi-tide-wave-head span {
  color: rgba(255,255,255,0.7);
  font-size: 10px;
  font-weight: 900;
  letter-spacing: 0.12em;
  text-transform: uppercase;
}

.rotezi-tide-wave-head strong {
  color: #ffffff;
  font-size: clamp(16px, 2.4vw, 22px);
  line-height: 1.3;
}

.rotezi-tide-range {
  text-align: right;
}

.rotezi-tide-range strong {
  font-size: 17px;
  white-space: nowrap;
}

.rotezi-tide-chart-wrap {
  margin: 0 12px;
  padding: 8px 8px 7px;
  border-radius: 17px;
  background: rgba(255,255,255,0.96);
  color: #1482ef;
}

.rotezi-tide-chart {
  display: block;
  width: 100%;
  height: 190px;
  overflow: visible;
}

.rotezi-tide-grid line {
  stroke: #dce9f7;
  stroke-width: 0.5;
  stroke-dasharray: 2 3;
}

.rotezi-tide-area {
  fill: url(#rotezi-tide-area-gradient);
  stroke: none;
}

.rotezi-tide-line {
  fill: none;
  stroke: currentColor;
  stroke-width: 2.2;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.rotezi-tide-point circle {
  fill: #ffffff;
  stroke: #116fd2;
  stroke-width: 1.3;
}

.rotezi-tide-point text,
.rotezi-tide-now text {
  fill: #49627e;
  font-size: 4px;
  font-weight: 800;
}

.rotezi-tide-now line {
  stroke: #ff6a3d;
  stroke-width: 1;
  stroke-dasharray: 2 2;
}

.rotezi-tide-now circle {
  fill: #ff6a3d;
}

.rotezi-tide-now text {
  fill: #d9481c;
}

.rotezi-tide-axis {
  display: flex;
  justify-content: space-between;
  padding: 0 7px 4px;
  color: #7890a9;
  font-size: 10px;
  font-weight: 700;
}

.rotezi-tide-visual-note {
  margin: 0;
  padding: 12px 18px 16px;
  color: rgba(255,255,255,0.72);
  font-size: 11px;
  line-height: 1.45;
}

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) .rotezi-tide-chart-wrap {
    background: rgba(6, 27, 54, 0.88);
    color: #61b1ff;
  }

  html:not([data-theme="light"]) .rotezi-tide-grid line {
    stroke: rgba(176,205,234,0.17);
  }

  html:not([data-theme="light"]) .rotezi-tide-point circle {
    fill: #09264b;
    stroke: #74bcff;
  }

  html:not([data-theme="light"]) .rotezi-tide-point text {
    fill: #b4c7db;
  }

  html:not([data-theme="light"]) .rotezi-tide-axis {
    color: #8fa7be;
  }
}

@media (max-width: 760px) {
  .topbar {
    min-height: 64px !important;
    margin-bottom: 16px !important;
    padding: 8px 10px !important;
  }

  .brand-logo {
    width: 176px !important;
    max-height: 52px !important;
  }

  .quick-nav {
    margin-top: -6px !important;
    padding: 10px !important;
  }

  .rotezi-tide-wave {
    margin: 14px -2px 15px;
    border-radius: 19px;
  }

  .rotezi-tide-wave-head {
    grid-template-columns: 1fr;
    gap: 11px;
    padding: 15px 14px 9px;
  }

  .rotezi-tide-range {
    grid-template-columns: auto 1fr;
    align-items: baseline;
    text-align: left;
  }

  .rotezi-tide-range strong {
    font-size: 15px;
  }

  .rotezi-tide-chart {
    height: 165px;
  }

  .rotezi-tide-visual-note {
    padding: 11px 14px 14px;
  }
}

@media (max-width: 380px) {
  .topbar {
    gap: 8px !important;
  }

  .brand-logo {
    width: 160px !important;
  }

  .rotezi-tide-chart {
    height: 145px;
  }
}

/* V0.8.2 · leitura de maré compacta e planejável */
.rotezi-tide-wave {
  margin: 14px 0 12px;
  border-color: rgba(25, 102, 183, 0.16);
  border-radius: 18px;
  background: linear-gradient(145deg, #f7fbff, #edf6ff);
  box-shadow: 0 10px 28px rgba(18, 73, 132, 0.09);
  color: #147fe6;
}

.rotezi-tide-controls {
  display: grid;
  grid-template-columns: 38px minmax(0, 210px) 38px;
  justify-content: center;
  align-items: end;
  gap: 8px;
  padding: 12px 12px 0;
}

.rotezi-tide-controls button {
  width: 38px;
  height: 38px;
  border: 1px solid #c7dcf2;
  border-radius: 11px;
  background: #fff;
  color: #165fa8;
  font: 800 22px/1 inherit;
  cursor: pointer;
}

.rotezi-tide-controls label { display: grid; gap: 4px; }
.rotezi-tide-controls label span { color: #58718d; font-size: 10px; font-weight: 800; letter-spacing: .08em; text-transform: uppercase; }
.rotezi-tide-controls input { min-height: 38px; border: 1px solid #c7dcf2; border-radius: 11px; background: #fff; color: #17395d; padding: 7px 10px; font: 700 13px/1.2 inherit; }

.rotezi-tide-days { padding-top: 10px; }
.rotezi-tide-day { min-height: 33px; padding: 7px 11px; border-color: #cbdff3; background: rgba(255,255,255,.72); color: #456887; }
.rotezi-tide-day.is-active { background: #126fd0; color: #fff; border-color: #126fd0; }
.rotezi-tide-wave-head { padding: 14px 16px 8px; }
.rotezi-tide-wave-head span { color: #69819a; }
.rotezi-tide-wave-head strong { color: #183d62; font-size: clamp(14px, 2vw, 18px); }
.rotezi-tide-range strong { color: #1767b5; font-size: 14px; }
.rotezi-tide-chart-wrap { margin: 0 12px; padding: 5px 8px 4px; border: 1px solid #d8e8f7; border-radius: 14px; background: rgba(255,255,255,.9); color: #1685e8; }
.rotezi-tide-chart { height: 122px; }
.rotezi-tide-visual-note { padding: 9px 16px 12px; color: #637b92; }
.directory-map-disabled { align-self: end; color: #6f8194; font-size: 12px; font-weight: 800; }

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) .rotezi-tide-wave { background: linear-gradient(145deg,#0d2138,#102d4c); color: #67b8ff; border-color: rgba(129,190,244,.2); }
  html:not([data-theme="light"]) .rotezi-tide-controls button,

  html:not([data-theme="light"]) .rotezi-tide-controls input { background:#132f4d; color:#d9ebfb; border-color:#315474; }
  html:not([data-theme="light"]) .rotezi-tide-controls label span,

  html:not([data-theme="light"]) .rotezi-tide-wave-head span { color:#94abc1; }
  html:not([data-theme="light"]) .rotezi-tide-day { background:#132f4d; color:#b5c8db; border-color:#315474; }
  html:not([data-theme="light"]) .rotezi-tide-day.is-active { background:#399cf1; color:#061a2e; border-color:#399cf1; }
  html:not([data-theme="light"]) .rotezi-tide-wave-head strong { color:#ecf7ff; }
  html:not([data-theme="light"]) .rotezi-tide-range strong { color:#8ecbff; }
  html:not([data-theme="light"]) .rotezi-tide-chart-wrap { background:#0b243e; border-color:#294966; }
  html:not([data-theme="light"]) .rotezi-tide-visual-note { color:#99aec2; }
}

@media (max-width: 760px) {
  .rotezi-tide-wave-head { grid-template-columns: 1fr auto; gap: 8px; padding: 12px 12px 7px; }
  .rotezi-tide-range { display:none; }
  .rotezi-tide-chart { height: 112px; }
}

/* V0.9 · painel de maré responsivo, com escala legível e proporção 24 h */
.tide-card {
  position: relative;
  display: block;
  overflow: hidden;
  padding: clamp(20px,3vw,34px);
  border-color: rgba(29,111,190,.18);
  background:
    radial-gradient(circle at 88% 2%,rgba(48,164,255,.13),transparent 32%),
    linear-gradient(155deg,#fbfdff 0%,#f1f7fd 100%);
}

.tide-card::before {
  content: '';
  position: absolute;
  inset: 0 0 auto;
  height: 3px;
  background: linear-gradient(90deg,#176ddd,#35b7ff 52%,#29dfc1);
}

.tide-card .tide-icon { display: none; }
.tide-card .tide-main { position: relative; min-width: 0; }
.tide-card .tide-actions { position: absolute; top: 0; right: 0; display: flex; align-items: flex-start; gap: 8px; }
.tide-card .tide-actions button { min-height: 42px; }
.tide-card h2 { max-width: 960px; margin-top: 10px; padding-right: 235px; font-size: clamp(25px,3.1vw,39px); line-height: 1.08; }
.tide-title-row .section-label { color: #1269d3; letter-spacing: .14em; }
.tide-title-row .data-status { background: #e6f2ff; color: #1764ae; }
.tide-title-row .data-status.is-live { background: #dff8f0; color: #08795d; }

.rotezi-tide-wave {
  margin: 20px 0 16px;
  border: 1px solid rgba(35,113,186,.18);
  border-radius: 24px;
  background: rgba(255,255,255,.66);
  box-shadow: 0 24px 56px rgba(23,69,112,.10);
  color: #269af4;
  overflow: hidden;
}

.rotezi-tide-toolbar {
  display: grid;
  gap: 12px;
  padding: 18px 18px 0;
}

.rotezi-tide-controls {
  display: grid;
  grid-template-columns: 44px minmax(220px,320px) 44px;
  justify-content: start;
  align-items: end;
  gap: 9px;
  padding: 0;
}

.rotezi-tide-controls button {
  width: 44px;
  height: 44px;
  border: 1px solid #bad7ee;
  border-radius: 14px;
  background: rgba(255,255,255,.92);
  color: #145d9e;
  box-shadow: 0 5px 14px rgba(25,91,150,.08);
}

.rotezi-tide-controls label { display: grid; gap: 5px; }
.rotezi-tide-controls label span { color: #59748f; font-size: 10px; font-weight: 900; letter-spacing: .13em; text-transform: uppercase; }
.rotezi-tide-controls input { min-height: 44px; border: 1px solid #bad7ee; border-radius: 14px; background: rgba(255,255,255,.92); color: #153c62; padding: 9px 12px; font: 800 15px/1.2 inherit; }

.rotezi-tide-days {
  display: flex;
  gap: 8px;
  padding: 0 0 4px;
  overflow-x: auto;
  scroll-snap-type: x proximity;
}

.rotezi-tide-day {
  scroll-snap-align: start;
  min-height: 38px;
  padding: 8px 14px;
  border-color: #c9dff2;
  background: rgba(255,255,255,.76);
  color: #486681;
  font-size: 12px;
}

.rotezi-tide-day.is-active {
  background: linear-gradient(135deg,#1479de,#37aaf7);
  color: #fff;
  border-color: transparent;
  box-shadow: 0 8px 18px rgba(20,121,222,.24);
}

.rotezi-tide-wave-head {
  display: grid;
  grid-template-columns: minmax(0,1fr) auto;
  gap: 22px;
  align-items: end;
  padding: 18px 20px 12px;
}

.rotezi-tide-wave-head span { color: #6b839a; font-size: 10px; letter-spacing: .14em; }
.rotezi-tide-wave-head strong { color: #173d61; font-size: clamp(16px,2vw,22px); }
.rotezi-tide-range { display: grid; text-align: right; }
.rotezi-tide-range strong { color: #126dcc; font-size: 17px; }

.rotezi-tide-chart-wrap {
  margin: 0 18px;
  padding: 8px 10px 4px;
  border: 1px solid rgba(79,164,233,.25);
  border-radius: 20px;
  background:
    radial-gradient(circle at 50% -30%,rgba(54,171,255,.21),transparent 54%),
    linear-gradient(155deg,#071b33 0%,#0a2b4a 100%);
  color: #3baaff;
  box-shadow: inset 0 1px 0 rgba(255,255,255,.06), 0 18px 36px rgba(4,34,62,.16);
  overflow: hidden;
}

.rotezi-tide-chart {
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 1000 / 360;
  overflow: visible;
}

.rotezi-tide-safe-band { fill: rgba(48,183,255,.055); }
.rotezi-tide-grid line { stroke: rgba(169,208,239,.14); stroke-width: 1; stroke-dasharray: none; }
.rotezi-tide-axis-label { fill: #88a8c3; font-size: 15px; font-weight: 750; }
.rotezi-tide-area { fill: url(#rotezi-tide-area-gradient); }
.rotezi-tide-line { fill: none; stroke: #31a7ff; stroke-width: 5; filter: drop-shadow(0 0 9px rgba(49,167,255,.30)); }
.rotezi-tide-point circle { stroke-width: 4; }
.rotezi-tide-point.is-high circle { fill: #0b2949; stroke: #52b8ff; }
.rotezi-tide-point.is-low circle { fill: #341c31; stroke: #ff6179; }
.rotezi-tide-point text { font-weight: 900; paint-order: stroke; stroke: #0a2540; stroke-width: 4; stroke-linejoin: round; }
.rotezi-tide-point-time { fill: #f4f9ff; font-size: 17px; }
.rotezi-tide-point-value { fill: #a8d8fb; font-size: 14px; }
.rotezi-tide-point.is-low .rotezi-tide-point-value { fill: #ff9caa; }
.rotezi-tide-now line { stroke: #ffb547; stroke-width: 2; stroke-dasharray: 7 7; }
.rotezi-tide-now circle { fill: #ffb547; stroke: #fff2ca; stroke-width: 3; }
.rotezi-tide-now text { fill: #ffce79; font-size: 13px; font-weight: 950; letter-spacing: 1px; }

.rotezi-tide-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 10px 18px;
  padding: 13px 20px 2px;
  color: #536f89;
  font-size: 11px;
  font-weight: 800;
}

.rotezi-tide-legend span { display: inline-flex; align-items: center; gap: 7px; }
.rotezi-tide-legend i { width: 10px; height: 10px; border-radius: 50%; background: #51b8ff; box-shadow: 0 0 0 3px rgba(81,184,255,.13); }
.rotezi-tide-legend i.is-low { background: #ff6179; box-shadow: 0 0 0 3px rgba(255,97,121,.13); }
.rotezi-tide-legend i.is-now { width: 2px; height: 14px; border-radius: 0; background: #ffb547; box-shadow: none; }
.rotezi-tide-legend b { color: #1a7bd3; font-size: 15px; }
.rotezi-tide-visual-note { padding: 10px 20px 18px; color: #657f97; font-size: 11px; }

.tide-card .tide-events { display: grid; grid-template-columns: repeat(4,minmax(0,1fr)); gap: 10px; }
.tide-card .tide-event { min-width: 0; padding: 12px 13px; border-color: #c9e2f6; background: rgba(255,255,255,.78); }
.tide-card .tide-event strong { font-size: 20px; }
.tide-card .tide-route-context { margin-top: 14px; border: 1px solid rgba(33,132,209,.10); background: #eaf7ff; color: #175374; }

@media (prefers-color-scheme: dark) {
  html:not([data-theme="light"]) .tide-card,

  html:not([data-theme="light"]) html[data-theme="dark"] .tide-card { background: radial-gradient(circle at 88% 2%,rgba(48,164,255,.16),transparent 34%),linear-gradient(155deg,#0a172b,#0b2139); border-color:#244a6a; }
  html:not([data-theme="light"]) .rotezi-tide-wave,

  html:not([data-theme="light"]) html[data-theme="dark"] .rotezi-tide-wave { background:rgba(8,31,53,.72); border-color:#284d6c; }
  html:not([data-theme="light"]) .rotezi-tide-controls button,

  html:not([data-theme="light"]) .rotezi-tide-controls input,

  html:not([data-theme="light"]) .rotezi-tide-day,

  html:not([data-theme="light"]) html[data-theme="dark"] .rotezi-tide-controls button,

  html:not([data-theme="light"]) html[data-theme="dark"] .rotezi-tide-controls input,

  html:not([data-theme="light"]) html[data-theme="dark"] .rotezi-tide-day { background:#102d48; color:#d4e8f7; border-color:#315776; }
  html:not([data-theme="light"]) .rotezi-tide-wave-head strong,

  html:not([data-theme="light"]) html[data-theme="dark"] .rotezi-tide-wave-head strong { color:#f0f8ff; }
  html:not([data-theme="light"]) .rotezi-tide-wave-head span,

  html:not([data-theme="light"]) .rotezi-tide-controls label span,

  html:not([data-theme="light"]) html[data-theme="dark"] .rotezi-tide-wave-head span,

  html:not([data-theme="light"]) html[data-theme="dark"] .rotezi-tide-controls label span { color:#8faac0; }
  html:not([data-theme="light"]) .rotezi-tide-legend,

  html:not([data-theme="light"]) .rotezi-tide-visual-note,

  html:not([data-theme="light"]) html[data-theme="dark"] .rotezi-tide-legend,

  html:not([data-theme="light"]) html[data-theme="dark"] .rotezi-tide-visual-note { color:#91a9bc; }
  html:not([data-theme="light"]) .tide-card .tide-event,

  html:not([data-theme="light"]) html[data-theme="dark"] .tide-card .tide-event { background:#0d2944; border-color:#2d5574; }
  html:not([data-theme="light"]) .tide-card .tide-route-context,

  html:not([data-theme="light"]) html[data-theme="dark"] .tide-card .tide-route-context { background:#0d3551; color:#c2e9ff; border-color:#285a78; }
}

html[data-theme="dark"] .tide-card { background: radial-gradient(circle at 88% 2%,rgba(48,164,255,.16),transparent 34%),linear-gradient(155deg,#0a172b,#0b2139); border-color:#244a6a; }
html[data-theme="dark"] .rotezi-tide-wave { background:rgba(8,31,53,.72); border-color:#284d6c; }
html[data-theme="dark"] .rotezi-tide-controls button,
html[data-theme="dark"] .rotezi-tide-controls input,
html[data-theme="dark"] .rotezi-tide-day { background:#102d48; color:#d4e8f7; border-color:#315776; }
html[data-theme="dark"] .rotezi-tide-wave-head strong { color:#f0f8ff; }
html[data-theme="dark"] .rotezi-tide-wave-head span,
html[data-theme="dark"] .rotezi-tide-controls label span { color:#8faac0; }
html[data-theme="dark"] .rotezi-tide-legend,
html[data-theme="dark"] .rotezi-tide-visual-note { color:#91a9bc; }
html[data-theme="dark"] .tide-card .tide-event { background:#0d2944; border-color:#2d5574; }
html[data-theme="dark"] .tide-card .tide-route-context { background:#0d3551; color:#c2e9ff; border-color:#285a78; }

@media (max-width: 760px) {
  .tide-card { padding: 18px 14px; }
  .tide-card .tide-actions { position: static; display: grid; grid-template-columns: 1fr 1fr; margin-top: 12px; }
  .tide-card h2 { padding-right: 0; font-size: clamp(23px,7.7vw,31px); line-height: 1.08; }
  .rotezi-tide-wave { margin: 15px 0 13px; border-radius: 19px; }
  .rotezi-tide-toolbar { padding: 14px 12px 0; }
  .rotezi-tide-controls { grid-template-columns: 42px minmax(0,1fr) 42px; }
  .rotezi-tide-controls button { width:42px; height:42px; }
  .rotezi-tide-controls input { min-width:0; width:100%; min-height:42px; font-size:14px; }
  .rotezi-tide-days { margin-right:-12px; padding-right:12px; }
  .rotezi-tide-day { min-height:36px; padding:7px 12px; font-size:11px; }
  .rotezi-tide-wave-head { grid-template-columns:1fr; gap:10px; padding:15px 13px 10px; }
  .rotezi-tide-wave-head strong { font-size:17px; }
  .rotezi-tide-range { display:flex; align-items:baseline; justify-content:space-between; gap:12px; text-align:left; }
  .rotezi-tide-range strong { font-size:15px; }
  .rotezi-tide-chart-wrap { margin:0 10px; padding:4px 3px 0; border-radius:15px; }
  .rotezi-tide-chart { height:auto; min-height:0; aspect-ratio:640/370; }
  .rotezi-tide-axis-label { font-size:17px; }
  .rotezi-tide-point-time { font-size:19px; }
  .rotezi-tide-point-value { font-size:16px; }
  .rotezi-tide-legend { gap:9px 14px; padding:12px 13px 2px; }
  .rotezi-tide-visual-note { padding:9px 13px 14px; }
  .tide-card .tide-events { grid-template-columns:repeat(2,minmax(0,1fr)); }
  .tide-card .tide-event strong { font-size:18px; }
}

@media (max-width: 380px) {
  .tide-card { padding-inline:12px; }
  .rotezi-tide-chart { aspect-ratio:640/390; }
  .rotezi-tide-range { display:grid; justify-content:start; }
}


/* iPhone com ilha dinâmica: a barra do app começa abaixo da área segura. */
@media (max-width: 760px) {
  .topbar {
    min-height: calc(64px + env(safe-area-inset-top)) !important;
    padding-top: max(16px, calc(8px + env(safe-area-inset-top))) !important;
  }
}