/*
 * T10 · 项目页统一页脚
 *
 * 这些页面各有自己的配色（bailu 青瓷 / zhi 赭石 / bruma 雾灰 / luxiang 橘绿，
 * beiyan 与 shuanghuo 是深底）。页脚不带任何自己的颜色：
 * 背景透明、文字与分隔线一律 currentColor，靠不透明度分主次。
 * 因此浅底深底都自动成立，也不会把 Vito 的橄榄绿塞进别人的店里。
 */

.vito-return {
  background: transparent;
  color: inherit;
  /* 项目页由 fonts.mjs 注入 --mono；壳页由 pagina.css / strada.css 注入 --mo。
     两个都取不到时只回退到泛型 monospace —— 绝不写 ui-monospace 之类系统字名，
     那会让 18 个页面的页脚在四端各长一个样，正是 1.4 契约要禁的。 */
  font-family: var(--mono, var(--mo, monospace));
  padding: clamp(30px, 5vw, 52px) clamp(18px, 5vw, 56px) clamp(34px, 5vw, 56px);
  border-top: 1px solid currentColor;
  /* 分隔线用 currentColor 会太实，压到发丝感 */
  border-top-color: color-mix(in srgb, currentColor 22%, transparent);
  display: flex;
  flex-wrap: wrap;
  align-items: baseline;
  gap: clamp(16px, 3vw, 40px);
  font-size: 12px;
  letter-spacing: .14em;
  text-transform: uppercase;
  line-height: 1.5;
}

/* 遗留项目页带有 `nav a{font-size:14px}` 之类的全局规则，会打进这个 <nav>。
   靠继承不够，必须在子元素上显式声明，用类选择器压过去。（zhi 实测被顶到 16px） */
.vito-return a,
.vito-return span {
  font-size: 12px;
  font-family: var(--mono, var(--mo, monospace));
  letter-spacing: .14em;
  line-height: 1.5;
}

.vito-return a {
  color: inherit;
  text-decoration: none;
  border-bottom: 1px solid transparent;
  /* 用简写封死四边：只写 padding-bottom 的话，遗留页的 `nav a{padding:6px 0 2px}`
     会把 padding-top 漏进来（zhi 实测多出 6px）。 */
  padding: 0 0 2px;
  margin: 0;
  transition: border-color .2s, opacity .2s;
}
.vito-return a:hover { border-bottom-color: currentColor; }
.vito-return a:focus-visible { outline: 1.5px solid currentColor; outline-offset: 4px; }

/* 中文与拉丁并置：中文不做大写变形，字距单独给 */
.vito-return .cn,
.vito-return a .cn {
  font-size: 12px;
  font-family: var(--zh, serif);
  text-transform: none;
  letter-spacing: .12em;
  margin-left: 9px;
  opacity: .72;
}

.vito-return__home { font-weight: 500; }
.vito-return__seq { display: flex; gap: clamp(14px, 2.4vw, 28px); flex-wrap: wrap; }
.vito-return__seq span[aria-disabled] { opacity: .38; }
.vito-return__end { margin-left: auto; opacity: .62; }
.vito-return__end .cn { opacity: 1; }

@media (max-width: 720px) {
  .vito-return { flex-direction: column; gap: 14px; }
  .vito-return__end { margin-left: 0; }
}

/* 2026-09-20 · 回到 Vito：项目页左缘中部的一枚小标签，任何页面任何滚动位置都看得见。
   固定用纸色/墨色（不是 currentColor）：它是 Vito 的东西，不是店里的东西；
   放左缘中部是因为没有一个项目页在那里放固定元素（Trentotto 的小票在底部、多家的导航在顶部）。
   首页橱窗里的 iframe 不显示它（vito-in-frame）。 */
.vito-return__pill {
  position: fixed; left: 0; top: 50%; z-index: 2147483000;
  transform: translateY(-50%);
  writing-mode: vertical-rl; text-orientation: mixed;   /* «←» 竖排后变成「↑」：往上＝回去 */
  font-family: var(--mono, var(--mo, monospace)); font-size: 12px; letter-spacing: .16em; text-transform: uppercase; line-height: 1;
  color: #23271F; background: #FBFAF5; text-decoration: none;
  padding: 12px 8px 12px 7px; border: 1px solid rgba(35, 39, 31, .35); border-left: 0;
  box-shadow: 0 6px 18px -10px rgba(0, 0, 0, .45); opacity: .94;
}
.vito-return__pill:hover { opacity: 1; }
html.vito-in-frame .vito-return__pill { display: none; }
@media print { .vito-return__pill { display: none; } }
/* 手机：标签平时收在左缘外，只有往回滚（要找导航）时滑出；读的时候不压正文（Codex 2026-09-20 R1）。
   宽度压到 20px 左右，落在多数项目页 18–24px 的左边距里。 */
@media (max-width: 719px) {
  .vito-return__pill {
    padding: 10px 4px 10px 3px; letter-spacing: .08em;
    transform: translate(-100%, -50%); transition: transform .28s ease;
  }
  html.vito-tab-show .vito-return__pill { transform: translate(0, -50%); }
}