.logo { max-width: 180px; }
.preview-bar { display: flex; flex-wrap: wrap; gap: 0.6rem; align-items: center; padding: 0.6rem 1rem; background: var(--ink); color: var(--paper); }
.preview-bar .btn-ghost { color: var(--ink); }
.dash { display: grid; gap: 1.2rem; }
.dash-nav { display: flex; gap: 0.45rem; overflow-x: auto; padding-bottom: 0.2rem; }
.dash-nav a { color: var(--ink); text-decoration: none; background: var(--surface); border: 1px solid var(--line); border-radius: 999px; padding: 0.45rem 0.75rem; white-space: nowrap; min-height: 44px; display: inline-flex; align-items: center; }
.table-wrap { width: 100%; overflow-x: auto; }
.timeline { margin: 0.4rem 0 0; padding-left: 1.1rem; }
.footer-name { font-family: var(--font-display, Fraunces), Georgia, serif; font-size: 1.5rem; margin: 0; }
.admin-nav { gap: 0.4rem; }
.admin-nav .btn { margin: 0; }

@media (max-width: 1099px) {
  .theme-atlas .nav, .theme-folio .nav { display: none; }
  .theme-atlas .menu-toggle, .theme-folio .menu-toggle { display: inline-flex; align-items: center; }
  .theme-atlas .desktop-auth, .theme-folio .desktop-auth { display: none; }
  .grid, .cats { grid-template-columns: 1fr; }
  .hero, .split, .single { grid-template-columns: 1fr; }
  .stats { grid-template-columns: repeat(2, minmax(0, 1fr)); }
  .trust { grid-template-columns: 1fr 1fr; }
  .filters input, .filters select, .search input { width: 100%; }
  .form { max-width: none; }
  .footer-grid { grid-template-columns: 1fr; }
}
@media (min-width: 700px) and (max-width: 1099px) {
  .grid { grid-template-columns: 1fr 1fr; }
  .cats { grid-template-columns: 1fr 1fr; }
}
@media (max-width: 900px) {
  .theme-harbor .nav { display: none; }
  .theme-harbor .menu-toggle { display: inline-flex; }
  .theme-harbor .desktop-auth { display: none; }
  .theme-harbor main, .theme-harbor .footer { margin-left: 0; }
  .theme-harbor .header { position: sticky; width: auto; height: auto; }
  .theme-harbor .bar { flex-direction: row; width: min(1120px, calc(100% - 2rem)); }
  .theme-harbor .menu { flex-direction: column; }
}
@media (max-width: 640px) {
  body { font-size: 1rem; }
  .bar { width: min(1120px, calc(100% - 1.25rem)); }
  .wrap { padding: 1.4rem 0; }
  .actions { gap: 0.35rem; }
  .btn, button, input, select { min-height: 44px; }
  .card { padding: 0.9rem; }
  .theme-harbor .card { flex-direction: column; align-items: stretch; }
  .stats { grid-template-columns: 1fr 1fr; }
  .trust { grid-template-columns: 1fr; }
  .table { min-width: 640px; }
  h1 { font-size: clamp(1.8rem, 9vw, 2.6rem); }
  .theme-folio h1 { font-size: 2.4rem; }
}
@media (min-width: 1100px) {
  .dash { grid-template-columns: 220px 1fr; align-items: start; }
  .dash-nav { flex-direction: column; position: sticky; top: 5rem; }
  .theme-harbor .dash-nav, .theme-folio .dash-nav { position: static; }
}

/* Keep phones inside the screen. Grid and flex children otherwise
   grow to the intrinsic width of an image or a form field. */
html, body { max-width: 100%; overflow-x: clip; }
main, .header, .footer, .wrap, .bar, .hero, .split, .single, .grid, .cats,
.card, figure, .form, .form label, .search, .filters, .prose, .dash, .dash-nav,
.actions, .footer-grid, .footer-base {
  min-width: 0;
  max-width: 100%;
}
img, svg, video, iframe { max-width: 100%; height: auto; }
p, li, h1, h2, h3, td, th, .card, .prose { overflow-wrap: anywhere; }
input, select, textarea {
  width: 100%;
  max-width: 100%;
  min-width: 0;
}
input[type="checkbox"], input[type="radio"] { width: auto; min-height: 1.1rem; }
.form, .search, .filters { align-items: stretch; }
.search, .filters { flex-direction: column; }
.theme-harbor .search input { min-width: 0; width: 100%; }
.theme-harbor .hero { box-sizing: border-box; padding-left: 1rem; padding-right: 1rem; }
.theme-harbor .card { flex-direction: column; align-items: stretch; }
.logo { max-width: min(168px, 42vw); height: auto; }
.table { min-width: 0; }
.table-wrap { max-width: 100%; overflow-x: auto; }
.table-wrap .table { min-width: 36rem; }
@media (min-width: 800px) {
  .search, .filters { flex-direction: row; align-items: center; }
  .search input, .filters input, .filters select { width: auto; flex: 1 1 12rem; }
  .theme-harbor .card { flex-direction: row; align-items: center; }
}