:root{
  --ink:#1a1a1a; --muted:#6b6b6b; --line:#e5e2dc; --bg:#faf8f5; --card-bg:#ffffff;
  --base:#c0392b; --atr:#2c5f8a; --food:#b07d2b; --bairro:#4a7c59;
  --transport:#2c5f8a; --walk:#6b6b6b; --info:#8a8a8a; --bakery:#b07d2b; --attraction:#4a7c59;
  --radius:14px;
}

@media (prefers-color-scheme: dark){
  :root{
    --ink:#f0eee9; --muted:#a8a8a8; --line:#3a3a3a; --bg:#141414; --card-bg:#1f1f1f;
    --base:#e0574a; --atr:#5b9bd5; --food:#d4a154; --bairro:#6fae7c;
    --info:#8a8a8a;
  }
}

*{box-sizing:border-box; margin:0; padding:0;}

[hidden]{ display:none !important; }

body{
  font-family:-apple-system, BlinkMacSystemFont, "SF Pro Text", "Segoe UI", Roboto, sans-serif;
  background:var(--bg);
  color:var(--ink);
  min-height:100vh;
  padding-bottom:env(safe-area-inset-bottom);
}

.topbar{
  padding:calc(env(safe-area-inset-top) + 14px) 18px 10px;
  background:var(--base);
  color:#fff;
}
.topbar-row{
  display:flex;
  align-items:flex-start;
  justify-content:space-between;
  gap:12px;
}
.topbar h1{ font-size:1.3rem; font-weight:700; }
.topbar .subtitle{ font-size:.8rem; opacity:.9; margin-top:2px; }

.refresh-btn{
  flex:0 0 auto;
  width:36px; height:36px;
  border-radius:999px;
  border:1px solid rgba(255,255,255,.4);
  background:rgba(255,255,255,.12);
  color:#fff;
  display:flex;
  align-items:center;
  justify-content:center;
  cursor:pointer;
}
.refresh-btn .icon{ width:18px; height:18px; }
.refresh-btn.spinning .icon{ animation:spin .8s linear infinite; }
@keyframes spin{ to{ transform:rotate(360deg); } }

.daytabs{
  display:flex;
  overflow-x:auto;
  gap:8px;
  padding:10px 12px;
  background:var(--card-bg);
  border-bottom:1px solid var(--line);
  position:sticky; top:0; z-index:10;
  -webkit-overflow-scrolling:touch;
  scrollbar-width:none;
}
.daytabs::-webkit-scrollbar{ display:none; }

.daytab{
  flex:0 0 auto;
  padding:8px 14px;
  border-radius:999px;
  border:1px solid var(--line);
  background:transparent;
  color:var(--muted);
  font-size:.85rem;
  font-weight:600;
  white-space:nowrap;
  cursor:pointer;
  transition:background .15s, color .15s;
}
.daytab.active{
  background:var(--base);
  border-color:var(--base);
  color:#fff;
}
.daytab .tab-date{ display:block; font-size:.68rem; font-weight:400; opacity:.8; }

.viewtabs{
  display:flex;
  gap:8px;
  padding:10px 12px 0;
  background:var(--card-bg);
}
.viewtab{
  flex:1;
  padding:9px 10px;
  border-radius:10px;
  border:1px solid var(--line);
  background:transparent;
  color:var(--muted);
  font-size:.85rem;
  font-weight:600;
  cursor:pointer;
}
.viewtab.active{
  background:var(--ink);
  border-color:var(--ink);
  color:var(--bg);
}

#content{ padding:12px; max-width:640px; margin:0 auto; }

.hotel-card{
  background:var(--card-bg);
  border:1px solid var(--line);
  border-radius:var(--radius);
  padding:14px 16px;
  margin-bottom:14px;
  font-size:.85rem;
}
.hotel-card strong{ display:block; margin-bottom:4px; font-size:.95rem; }
.hotel-card a{ color:var(--atr); text-decoration:none; }
.hotel-card .hc-row{ margin-top:6px; color:var(--muted); }

.daypanel{ display:flex; flex-direction:column; gap:14px; }

.day-summary{
  font-size:.85rem;
  color:var(--muted);
  padding:0 2px;
}
.day-summary b{ color:var(--ink); }

.day-directions{
  display:block;
  font-size:.82rem;
  font-weight:600;
  color:var(--atr);
  text-decoration:none;
  padding:8px 2px 2px;
}

.blocklist{ display:flex; flex-direction:column; gap:10px; }

.block{
  background:var(--card-bg);
  border:1px solid var(--line);
  border-left-width:5px;
  border-radius:var(--radius);
  padding:12px 14px;
  display:flex;
  gap:12px;
  align-items:flex-start;
  transition:box-shadow .15s;
}
.block.now{
  box-shadow:0 0 0 2px var(--base);
}
.block.done{ opacity:.5; }
.block.done .block-title{ text-decoration:line-through; }

.block[data-type="transport"]{ border-left-color:var(--transport); }
.block[data-type="walk"]{ border-left-color:var(--walk); }
.block[data-type="food"]{ border-left-color:var(--food); }
.block[data-type="attraction"]{ border-left-color:var(--attraction); }
.block[data-type="bakery"]{ border-left-color:var(--bakery); }
.block[data-type="info"]{ border-left-color:var(--info); }

.block-check{
  flex:0 0 auto;
  width:22px; height:22px;
  margin-top:2px;
  accent-color:var(--base);
}

.block-body{ flex:1; min-width:0; }
.block-time{ font-size:.75rem; font-weight:700; color:var(--muted); }
.block-badge{
  display:inline-block;
  font-size:.65rem;
  font-weight:700;
  text-transform:uppercase;
  letter-spacing:.03em;
  padding:1px 6px;
  border-radius:6px;
  margin-left:6px;
  color:#fff;
}
.block[data-type="transport"] .block-badge{ background:var(--transport); }
.block[data-type="walk"] .block-badge{ background:var(--walk); }
.block[data-type="food"] .block-badge{ background:var(--food); }
.block[data-type="attraction"] .block-badge{ background:var(--attraction); }
.block[data-type="bakery"] .block-badge{ background:var(--bakery); }
.block[data-type="info"] .block-badge{ background:var(--info); }

.block-title{ font-size:1rem; font-weight:600; margin-top:2px; }
.block-note{ font-size:.82rem; color:var(--muted); margin-top:3px; }
.block-meta{ font-size:.78rem; color:var(--muted); margin-top:4px; display:flex; gap:10px; flex-wrap:wrap; }
.block-meta a{ color:var(--atr); text-decoration:none; }

.now-tag{
  display:inline-block;
  background:var(--base);
  color:#fff;
  font-size:.65rem;
  font-weight:700;
  text-transform:uppercase;
  padding:1px 7px;
  border-radius:6px;
  margin-left:6px;
}

.appfooter{
  display:flex;
  justify-content:space-between;
  align-items:center;
  padding:10px 16px calc(env(safe-area-inset-bottom) + 10px);
  font-size:.7rem;
  color:var(--muted);
}
.offline-dot{ color:var(--base); font-weight:700; }
.footer-note{}

.icon{
  width:1em; height:1em;
  vertical-align:-0.15em;
  flex-shrink:0;
}
.icon-inline{ width:.9em; height:.9em; }
.block-meta a, .block-meta span, .dine-meta a, .dine-meta span, .day-directions{
  display:inline-flex;
  align-items:center;
  gap:4px;
}
.hotel-card a{ display:inline-flex; align-items:center; gap:4px; }

.diningpanel{ display:flex; flex-direction:column; gap:18px; }
.dine-section{ display:flex; flex-direction:column; gap:10px; }
.dine-heading{
  font-size:1rem;
  font-weight:700;
  color:var(--ink);
  padding:0 2px;
}
.dine-list{ display:flex; flex-direction:column; gap:10px; }
.dine-card{
  background:var(--card-bg);
  border:1px solid var(--line);
  border-left:5px solid var(--food);
  border-radius:var(--radius);
  padding:12px 14px;
}
.dine-title{ font-size:1rem; font-weight:600; }
.dine-note{ font-size:.82rem; color:var(--muted); margin-top:3px; }
.dine-meta{
  font-size:.78rem;
  color:var(--muted);
  margin-top:6px;
  display:flex;
  justify-content:space-between;
  align-items:center;
  gap:10px;
  flex-wrap:wrap;
}
.dine-meta a{ color:var(--atr); text-decoration:none; font-weight:600; }
