/* 溫錦鐘家族數位館｜共用樣式
   版面概念：像一座小小的家族館舍。每一頁是一個館區，頁首是館名與館區頁籤，
   內文窄欄置中好讀；館區卡、家族樹、典藏條目用紙卡呈現，尚未收到的素材以虛線「徵集中」格預留。 */
:root {
  --bg: #f6f0e0;        /* 米白紙色 */
  --paper: #fbf7ec;     /* 紙卡底 */
  --ink: #3a2e22;       /* 泥土深褐，內文 */
  --soil: #6b4a2f;      /* 泥土褐，次要文字 */
  --gold: #8a6212;      /* 稻穗金，標示文字 */
  --gold-soft: #e6cf94; /* 稻穗金，線條與標籤底 */
  --green: #4a6a35;     /* 秧苗綠，重點線條 */
  --line: #d9ccae;
  --shadow: rgba(58, 46, 34, 0.14);
  --serif: "Noto Serif TC", "Songti TC", "PMingLiU", "Source Han Serif TC", serif;
  --sans: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", system-ui, sans-serif;
}
@media (prefers-color-scheme: dark) {
  :root:not([data-theme="light"]) {
    --bg: #1f1a14; --paper: #2a231a; --ink: #eadfc8; --soil: #c4ab88;
    --gold: #e0b65a; --gold-soft: #4d3f20; --green: #9dbb7e; --line: #4a3f2e;
    --shadow: rgba(0, 0, 0, 0.35);
    color-scheme: dark;
  }
}
:root[data-theme="dark"] {
  --bg: #1f1a14; --paper: #2a231a; --ink: #eadfc8; --soil: #c4ab88;
  --gold: #e0b65a; --gold-soft: #4d3f20; --green: #9dbb7e; --line: #4a3f2e;
  --shadow: rgba(0, 0, 0, 0.35);
  color-scheme: dark;
}

* { box-sizing: border-box; }
[hidden] { display: none !important; }
html { scroll-behavior: smooth; }
@media (prefers-reduced-motion: reduce) { html { scroll-behavior: auto; } }

body {
  margin: 0;
  padding-inline: 16px;
  padding-block: 0 3rem;
  background: var(--bg);
  color: var(--ink);
  font-family: var(--sans);
  font-size: 1.125rem;
  line-height: 1.95;
  overflow-wrap: anywhere;
}
h1, h2, h3 { font-family: var(--serif); font-weight: 700; line-height: 1.4; text-wrap: balance; margin: 0; }
p { margin: 0; }
img { max-width: 100%; }
strong { font-weight: 500; color: var(--soil); }
a { color: inherit; }
:focus-visible { outline: 3px solid var(--green); outline-offset: 3px; border-radius: 2px; }

/* ── 頁首：館名＋館區頁籤 ── */
.site-head {
  position: sticky;
  top: env(safe-area-inset-top, 0px);
  z-index: 5;
  margin-inline: -16px;
  padding-inline: 16px;
  background: var(--bg);
  border-bottom: 1px solid var(--line);
}
.site-head .bar { max-width: 64rem; margin: 0 auto; }
.brand {
  display: inline-block;
  padding-top: 0.6rem;
  font-family: var(--serif);
  font-weight: 700;
  font-size: 1.05rem;
  letter-spacing: 0.12em;
  color: var(--gold);
  text-decoration: none;
}
.tabs {
  display: flex;
  gap: 0.1rem;
  margin: 0 -0.6rem;
  padding: 0;
  list-style: none;
  overflow-x: auto;
  scrollbar-width: none;
}
.tabs::-webkit-scrollbar { display: none; }
.tabs a {
  display: block;
  padding: 0.45rem 0.6rem 0.6rem;
  font-size: 0.98rem;
  line-height: 1.4;
  white-space: nowrap;
  color: var(--soil);
  text-decoration: none;
  border-bottom: 3px solid transparent;
}
.tabs a:hover { color: var(--gold); }
.tabs a[aria-current="page"] { color: var(--ink); font-weight: 500; border-bottom-color: var(--green); }

/* ── 版面容器 ── */
.wrap { max-width: 64rem; margin: 0 auto; }
.prose { max-width: 44rem; margin: 0 auto; }

/* ── 各館區的頁面開頭 ── */
.page-head { max-width: 44rem; margin: 0 auto; padding-block: 3rem 2rem; }
.kicker { font-size: 0.95rem; letter-spacing: 0.2em; color: var(--green); font-weight: 500; }
.page-head h1 { margin-top: 0.4rem; font-size: clamp(2rem, 7vw, 3rem); }
.page-head .lede { margin-top: 0.75rem; }

/* ── 首頁 ── */
.hero { max-width: 64rem; margin: 0 auto; padding-block: 3rem 2.5rem; display: grid; gap: 2rem; }
.hero h1 { font-size: clamp(2.2rem, 9vw, 4rem); letter-spacing: 0.04em; }
.hero .tagline { margin-top: 0.75rem; font-family: var(--serif); font-size: clamp(1.25rem, 4.5vw, 1.75rem); line-height: 1.6; color: var(--gold); }
.hero .sub { margin-top: 0.75rem; color: var(--soil); }
.photo { margin: 0; }
.photo img {
  display: block;
  width: 100%;
  height: auto;
  padding: 0.5rem;
  background: var(--paper);
  border: 1px solid var(--line);
  border-radius: 2px;
  box-shadow: 0 6px 18px var(--shadow);
}
.photo figcaption { margin-top: 0.6rem; font-size: 0.95rem; color: var(--soil); text-align: center; }
.book-photo { max-width: 24rem; margin-inline: auto; }
section > .book-photo { margin-block: 1.5rem; }

/* ── 內文區塊 ── */
section { padding-block: 2.75rem; border-top: 1px solid var(--line); scroll-margin-top: 6rem; }
section > * + * { margin-top: 1.1rem; }
.eyebrow { display: block; width: 2.5rem; height: 3px; background: var(--green); }
section > .eyebrow + h2 { margin-top: 1.25rem; }
h2 { font-size: clamp(1.55rem, 5vw, 2rem); }
.lede { font-family: var(--serif); font-size: 1.2rem; line-height: 1.7; color: var(--gold); }
section > .lede { margin-top: 0.4rem; margin-bottom: 1.6rem; }
section > h3 { margin-top: 2rem; font-size: 1.2rem; color: var(--gold); }

.quote {
  padding: 0.25rem 0 0.25rem 1.25rem;
  border-left: 3px solid var(--gold-soft);
  font-family: var(--serif);
  font-size: 1.25rem;
  line-height: 1.85;
  color: var(--soil);
}
.quote strong { color: inherit; font-weight: 700; }

.verse { font-family: var(--serif); font-size: 1.2rem; line-height: 2.05; }
.verse strong { font-weight: 700; color: var(--ink); }
.verse-center { text-align: center; }
section > .verse + .verse { margin-top: 1.6rem; }

.honor {
  display: inline-block;
  padding: 0.2rem 0.9rem;
  border: 1px solid var(--gold);
  border-radius: 999px;
  color: var(--gold);
  font-family: var(--serif);
  font-size: 1rem;
  letter-spacing: 0.1em;
  line-height: 1.7;
}

/* ── 紙卡 ── */
.card { min-width: 0; padding: 1.1rem 1.2rem; background: var(--paper); border: 1px solid var(--line); border-radius: 4px; line-height: 1.75; }
.grid { display: grid; gap: 0.85rem; grid-template-columns: repeat(auto-fit, minmax(15rem, 1fr)); }
section > .grid { margin-block: 1.5rem; }

/* 重要人物 */
.person-card .role { font-size: 0.95rem; letter-spacing: 0.15em; color: var(--gold); }
.person-card h3 { font-size: 1.6rem; letter-spacing: 0.1em; }
.person-card p + p { margin-top: 0.4rem; }
.person-card .more { display: inline-block; margin-top: 0.75rem; color: var(--green); font-weight: 500; }

/* 館區入口 */
.hall { display: flex; flex-direction: column; gap: 0.3rem; text-decoration: none; transition: border-color 0.15s, transform 0.15s; }
.hall:hover { border-color: var(--gold); transform: translateY(-2px); }
@media (prefers-reduced-motion: reduce) { .hall { transition: none; } .hall:hover { transform: none; } }
.hall .name { font-family: var(--serif); font-size: 1.25rem; font-weight: 700; }
.hall .motto { font-size: 0.95rem; color: var(--gold); letter-spacing: 0.08em; }
.hall .desc { font-size: 0.98rem; color: var(--soil); }

/* 家族一覽 */
.lineup { display: flex; flex-wrap: wrap; gap: 0.5rem 1.25rem; font-family: var(--serif); font-size: 1.15rem; }
.lineup span { white-space: nowrap; }
.lineup span + span::before { content: "｜"; margin-right: 1.25rem; color: var(--line); }

/* ── 徵集中 ── */
.pending {
  min-width: 0;
  padding: 1.1rem 1.2rem;
  border: 2px dashed var(--line);
  border-radius: 4px;
  color: var(--soil);
  line-height: 1.75;
}
.pending .tag {
  display: inline-block;
  margin-bottom: 0.4rem;
  padding: 0 0.6rem;
  font-size: 0.85rem;
  letter-spacing: 0.15em;
  color: var(--green);
  border: 1px solid var(--green);
  border-radius: 999px;
}
.pending h3 { font-size: 1.15rem; color: var(--ink); }
.pending p { margin-top: 0.25rem; font-size: 1rem; }
.pending.tall { min-height: 9rem; }

/* ── 家族樹 ── */
.tree { display: grid; gap: 0; }
.gen { position: relative; padding-block: 1.25rem; }
.gen + .gen::before {
  content: "";
  position: absolute;
  top: -0.25rem;
  left: 50%;
  width: 2px;
  height: 1.25rem;
  background: var(--green);
}
.gen-label { display: block; text-align: center; font-size: 0.9rem; letter-spacing: 0.2em; color: var(--green); font-weight: 500; margin-bottom: 0.6rem; }
.root-couple {
  display: flex;
  justify-content: center;
  align-items: center;
  flex-wrap: wrap;
  gap: 0.5rem 1rem;
  max-width: 26rem;
  margin: 0 auto;
  padding: 1rem 1.25rem;
  background: var(--paper);
  border: 2px solid var(--gold);
  border-radius: 4px;
  font-family: var(--serif);
  font-size: 1.6rem;
  font-weight: 700;
  letter-spacing: 0.08em;
}
.root-couple .x { color: var(--gold); font-weight: 500; }
.branches { display: grid; gap: 0.85rem; grid-template-columns: repeat(auto-fit, minmax(14rem, 1fr)); padding: 0; list-style: none; margin: 0; }
.branch { border-top: 3px solid var(--green); }
.branch .role { font-size: 0.9rem; letter-spacing: 0.15em; color: var(--gold); }
.branch .who { font-family: var(--serif); font-size: 1.4rem; font-weight: 700; }
.branch .spouse { color: var(--soil); }
.branch .label { margin-top: 0.75rem; font-size: 0.85rem; letter-spacing: 0.15em; color: var(--green); }
.kids { display: flex; flex-wrap: wrap; gap: 0.4rem; margin: 0.35rem 0 0; padding: 0; list-style: none; }
.kids li { padding: 0.1rem 0.75rem; background: var(--gold-soft); color: var(--ink); border-radius: 999px; font-size: 1rem; line-height: 1.7; }
.kids .g4 { font-size: 0.85rem; color: var(--soil); margin-left: 0.3rem; }
.legend { margin-top: 1rem; font-size: 0.95rem; color: var(--soil); text-align: center; }

/* ── 標籤列 ── */
.tags { display: flex; flex-wrap: wrap; gap: 0.5rem; padding: 0; list-style: none; }
section > .tags { margin-top: 0.6rem; margin-bottom: 1.4rem; }
.tags li { padding: 0.15rem 0.85rem; background: var(--gold-soft); color: var(--ink); border-radius: 999px; font-size: 1rem; line-height: 1.7; }

/* ── 重點數字卡 ── */
.facts-row { display: grid; gap: 0.85rem; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
section > .facts-row { margin-block: 1.5rem; }
.fact .num { font-family: var(--serif); font-size: 2.6rem; font-weight: 700; line-height: 1.2; color: var(--gold); font-variant-numeric: tabular-nums; }
.fact .what { font-size: 1rem; color: var(--soil); }

/* ── 書目與典藏 ── */
.book .title { font-family: var(--serif); font-size: 1.4rem; font-weight: 700; }
.book .isbn { margin-top: 0.25rem; color: var(--soil); font-size: 1rem; font-variant-numeric: tabular-nums; }
section > .book { margin-block: 1.5rem; }
.item .type {
  display: inline-block;
  padding: 0 0.6rem;
  font-size: 0.85rem;
  letter-spacing: 0.15em;
  color: var(--bg);
  background: var(--soil);
  border-radius: 2px;
}
.item h3 { margin-top: 0.5rem; font-size: 1.25rem; }
.item p { margin-top: 0.3rem; font-size: 1rem; color: var(--soil); }

/* ── 人生軌跡 ── */
.path { padding: 0; list-style: none; }
section > .path { margin-block: 1.5rem 2rem; }
.path li { padding: 0.5rem 0 0.5rem 1.4rem; position: relative; font-family: var(--serif); font-size: 1.2rem; font-weight: 700; }
.path li::before { content: ""; position: absolute; left: 0; top: 1.15rem; width: 0.55rem; height: 0.55rem; border-radius: 50%; background: var(--green); }

/* ── 名片 ── */
.signature { padding: 2.5rem 1.25rem; text-align: center; }
.signature h3 { font-size: clamp(2rem, 7vw, 2.6rem); letter-spacing: 0.2em; color: var(--gold); }
.signature .born { margin-top: 0.5rem; font-family: var(--serif); color: var(--soil); }
.signature .roles { margin-top: 1.25rem; font-family: var(--serif); font-weight: 700; line-height: 1.9; }
.signature .motto { margin-top: 1.25rem; font-family: var(--serif); font-size: 1.25rem; color: var(--green); }

/* ── 頁尾 ── */
.site-foot { max-width: 44rem; margin: 3rem auto 0; padding-top: 1.5rem; border-top: 1px solid var(--line); font-size: 1rem; line-height: 1.8; color: var(--soil); }
.pager { display: flex; justify-content: space-between; gap: 1rem; flex-wrap: wrap; margin-bottom: 1.5rem; }
.pager a { color: var(--green); font-weight: 500; text-decoration: none; }
.pager a:hover { text-decoration: underline; }
.site-foot .name { font-family: var(--serif); font-weight: 700; color: var(--ink); }

/* ── 上傳與共享內容 ── */
.live-note {
  padding: 0.7rem 1rem;
  border-left: 3px solid var(--green);
  background: var(--paper);
  font-size: 1rem;
  line-height: 1.75;
  color: var(--soil);
}
.form { display: grid; gap: 1rem; padding: 1.25rem; background: var(--paper); border: 1px solid var(--line); border-radius: 4px; }
section > .form { margin-block: 1.25rem; }
.field { display: grid; gap: 0.3rem; min-width: 0; }
.field label { font-size: 0.95rem; font-weight: 500; color: var(--soil); }
.field .hint { font-size: 0.88rem; color: var(--soil); line-height: 1.6; }
.field input[type="text"], .field select, .field textarea {
  width: 100%;
  padding: 0.55rem 0.7rem;
  font: inherit;
  font-size: 1rem;
  line-height: 1.6;
  color: var(--ink);
  background: var(--bg);
  border: 1px solid var(--line);
  border-radius: 4px;
}
.field textarea { min-height: 10rem; resize: vertical; }
.field input[type="file"] { font: inherit; font-size: 0.98rem; color: var(--soil); max-width: 100%; }
.field-row { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fit, minmax(12rem, 1fr)); }
.btn {
  justify-self: start;
  padding: 0.55rem 1.4rem;
  font: inherit;
  font-size: 1rem;
  font-weight: 500;
  color: var(--bg);
  background: var(--green);
  border: 0;
  border-radius: 4px;
  cursor: pointer;
}
.btn:disabled { opacity: 0.55; cursor: progress; }
.btn-quiet {
  padding: 0.15rem 0.6rem;
  font: inherit;
  font-size: 0.88rem;
  color: var(--soil);
  background: transparent;
  border: 1px solid var(--line);
  border-radius: 4px;
  cursor: pointer;
}
.btn-quiet.danger { color: #b0412e; border-color: #b0412e; }
.form-status { font-size: 0.95rem; color: var(--soil); min-height: 1.5em; }
.form-status.error { color: #b0412e; }

/* 相簿 */
.album { display: grid; gap: 0.8rem; }
section > .album + .album { margin-top: 2.25rem; }
.album h3 { font-size: 1.2rem; color: var(--gold); }
.photo-grid { display: grid; gap: 0.85rem; grid-template-columns: repeat(auto-fill, minmax(12rem, 1fr)); }
.photo-grid:empty { display: none; }
.shot { margin: 0; min-width: 0; background: var(--paper); border: 1px solid var(--line); border-radius: 4px; overflow: hidden; }
.shot button.open { display: block; width: 100%; padding: 0; border: 0; background: var(--line); cursor: zoom-in; }
.shot img { display: block; width: 100%; aspect-ratio: 4 / 3; object-fit: cover; }
.shot figcaption { padding: 0.6rem 0.75rem 0.75rem; font-size: 0.95rem; line-height: 1.6; }
.meta { display: flex; flex-wrap: wrap; align-items: center; gap: 0.25rem 0.6rem; margin-top: 0.3rem; font-size: 0.85rem; color: var(--soil); }

/* 看大圖 */
.viewer { width: min(64rem, calc(100vw - 2rem)); max-height: calc(100vh - 2rem); padding: 0; border: 0; border-radius: 4px; background: var(--paper); color: var(--ink); }
.viewer::backdrop { background: rgba(20, 16, 10, 0.75); }
.viewer img { display: block; width: 100%; max-height: calc(100vh - 9rem); object-fit: contain; background: #000; }
.viewer .bar { display: flex; justify-content: space-between; align-items: start; gap: 1rem; padding: 0.75rem 1rem; }
.viewer p { font-size: 1rem; }

/* 故事 */
.stories { display: grid; gap: 1rem; }
.story h3 { font-size: 1.35rem; }
.story .by { margin-top: 0.2rem; font-size: 0.95rem; color: var(--gold); }
.story .body { margin-top: 0.8rem; }
.story .body p + p { margin-top: 0.8rem; }
.story img { display: block; width: 100%; margin-top: 0.9rem; border-radius: 2px; }
.story-teaser h3 { font-size: 1.15rem; }
.story-teaser p { margin-top: 0.3rem; font-size: 1rem; color: var(--soil); }
.story-teaser a { color: var(--green); font-weight: 500; }

/* 典藏上傳 */
.item .thumb { display: block; width: 100%; margin-top: 0.7rem; aspect-ratio: 4 / 3; object-fit: cover; border-radius: 2px; background: var(--line); }
.item .file-link { display: inline-block; margin-top: 0.6rem; color: var(--green); font-weight: 500; }
.img-fail { display: block; padding: 1rem; font-size: 0.9rem; color: var(--soil); background: var(--paper); border: 1px dashed var(--line); border-radius: 2px; text-align: center; }
.open-plain { display: block; width: 100%; padding: 0; border: 0; background: none; cursor: zoom-in; }

/* 旅行足跡 */
.journeys { display: grid; gap: 1rem; grid-template-columns: repeat(auto-fill, minmax(16rem, 1fr)); }
.trip { padding: 0; overflow: hidden; }
.trip .cover-img { display: block; width: 100%; aspect-ratio: 3 / 2; object-fit: cover; background: var(--line); }
.trip-body { padding: 0.9rem 1.1rem 1rem; }
.trip h3 { font-size: 1.3rem; }
.trip .when { margin-top: 0.15rem; font-size: 0.95rem; color: var(--gold); }
.trip .trip-note { margin-top: 0.4rem; font-size: 1rem; }
.thumbs { display: flex; flex-wrap: wrap; gap: 0.4rem; margin-top: 0.6rem; }
.thumbs button { width: 3.5rem; height: 3.5rem; padding: 0; border: 0; border-radius: 2px; overflow: hidden; background: var(--line); cursor: zoom-in; }
.thumbs img { display: block; width: 100%; height: 100%; object-fit: cover; }

/* 家族世系：家人登錄的成員 */
.form h3 { font-size: 1.15rem; color: var(--gold); }
.ancestor-row { display: flex; flex-wrap: wrap; justify-content: center; gap: 0.6rem; }
.ancestor { padding: 0.5rem 1rem; background: var(--paper); border: 1px solid var(--line); border-radius: 4px; font-family: var(--serif); font-size: 1.15rem; text-align: center; }
.ancestor small { display: block; font-family: var(--sans); font-size: 0.82rem; color: var(--soil); }
.desc { margin: 0.75rem 0 0; padding: 0 0 0 0.8rem; list-style: none; border-left: 2px solid var(--gold-soft); font-size: 0.95rem; line-height: 1.7; }
.desc ul { margin: 0.2rem 0 0.2rem 0.4rem; padding: 0 0 0 0.8rem; list-style: none; border-left: 2px solid var(--gold-soft); }
.desc li { margin: 0.25rem 0; }
.desc-head { display: flex; flex-wrap: wrap; align-items: center; gap: 0.15rem 0.35rem; }
.desc-name { font-weight: 500; }
.desc .year, .spouse .year { color: var(--soil); font-size: 0.85rem; }
.desc .plus { color: var(--gold); font-size: 0.85rem; }
.avatar-btn { display: inline-block; vertical-align: middle; width: 1.8rem; height: 1.8rem; padding: 0; border: 0; border-radius: 50%; overflow: hidden; background: var(--line); cursor: zoom-in; }
.avatar-btn img { display: block; width: 100%; height: 100%; object-fit: cover; }
.family-shots { margin-top: 0.8rem; }
.admin-list { display: grid; gap: 0.5rem; margin: 0.6rem 0 0; padding: 0; list-style: none; }
.admin-list li { display: flex; flex-wrap: wrap; align-items: center; gap: 0.3rem 0.8rem; padding: 0.5rem 0.8rem; background: var(--paper); border: 1px solid var(--line); border-radius: 4px; font-size: 0.95rem; }
.admin-list .who-added, .admin-list .hint { font-size: 0.85rem; color: var(--soil); }
#member-admin-wrap h3 { font-size: 1.15rem; color: var(--gold); }

/* 父母人生：年表、照片時光軸、影片 */
.events, .photo-line { list-style: none; margin: 1.5rem 0 0; padding: 0 0 0 1.4rem; border-left: 2px solid var(--gold-soft); }
.event, .moment { position: relative; padding-bottom: 1.4rem; }
.event::before, .moment::before { content: ""; position: absolute; left: calc(-1.4rem - 6px); top: 0.55rem; width: 10px; height: 10px; border-radius: 50%; background: var(--green); }
.event .when, .moment .when { display: block; font-family: var(--serif); font-weight: 700; color: var(--gold); }
.event p { margin-top: 0.15rem; }
.event .event-note { font-size: 1rem; color: var(--soil); }
.event .event-photo { margin-top: 0.5rem; max-width: 16rem; }
.event .event-photo img { display: block; width: 100%; border-radius: 2px; }
.moment .shot { margin-top: 0.4rem; max-width: 30rem; }
.moment .shot img { aspect-ratio: auto; max-height: 26rem; object-fit: contain; background: var(--paper); }
.who-tag { padding: 0 0.5rem; border: 1px solid var(--line); border-radius: 999px; }
.filter-chips { display: flex; flex-wrap: wrap; gap: 0.4rem; }
section > .filter-chips { margin-top: 1rem; }
.chip { padding: 0.15rem 0.9rem; font: inherit; font-size: 0.95rem; color: var(--soil); background: transparent; border: 1px solid var(--line); border-radius: 999px; cursor: pointer; }
.chip[aria-pressed="true"] { color: var(--bg); background: var(--green); border-color: var(--green); }
.videos { display: grid; gap: 1rem; }
.video-card video { display: block; width: 100%; max-height: 70vh; margin-top: 0.6rem; background: #000; border-radius: 2px; }
.video-card p { margin-top: 0.5rem; font-size: 1rem; }

/* 農夫人生：自動帶入的內容 */
.sub-note { font-size: 0.98rem; color: var(--soil); }
.sub-note a { color: var(--green); font-weight: 500; white-space: nowrap; }

/* 詩與文字 */
.writings { display: grid; gap: 1rem; }
.writing .poem-text { margin-top: 0.9rem; white-space: pre-line; font-family: var(--serif); font-size: 1.15rem; line-height: 2.05; }
.writing .prose-text { margin-top: 0.7rem; white-space: pre-line; line-height: 1.95; }
.writing .thumb { max-width: 26rem; }