/* 奥迪星推官·候鸟守护计划 H5（0924）· 参考奥迪官网：黑白为主、直角、留白、红色只做点缀 */
:root {
  --black: #000;
  --ink: #1A1A1A;
  --text: #333;
  --grey: #666;
  --muted: #999;
  --line: #D9D9D9;
  --soft: #F2F2F2;
  --red: #F0003C;
  --ease: cubic-bezier(.2, .7, .2, 1);
  --sans: var(--audi-font-body);
  --safe-top: env(safe-area-inset-top, 0px);
  --safe-bottom: env(safe-area-inset-bottom, 0px);
}

* { box-sizing: border-box; margin: 0; padding: 0; touch-action: manipulation; }
html, body { min-height: 100%; }
body { font-family: var(--sans); color: var(--ink); background: #000; -webkit-text-size-adjust: 100%; -webkit-tap-highlight-color: transparent; }
[hidden] { display: none !important; }
.sr-only { position: absolute; width: 1px; height: 1px; margin: -1px; padding: 0; overflow: hidden; clip: rect(0 0 0 0); clip-path: inset(50%); white-space: nowrap; border: 0; }
a { color: inherit; text-decoration: none; }
button, input, select { font: inherit; color: inherit; }
button { cursor: pointer; border: 0; background: none; }
button:focus-visible, a:focus-visible, input:focus-visible, select:focus-visible, summary:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; }
img { max-width: 100%; }

.app { position: relative; max-width: 480px; min-height: 100vh; margin: 0 auto; background: #fff; overflow-x: hidden; }
.view { position: relative; min-height: 100vh; }
.view.enter { animation: viewIn .55s var(--ease) both; }
.view.enter-up { animation: viewIn .75s var(--ease) both; }
.view.enter-up > :not(.dock) { animation: slideUp .7s var(--ease) both; }
.view.enter-up > .dock { animation: fadeIn .5s ease .25s both; }

/* ---------- 按钮：直角，黑底白字；深色背景上用白底黑字 ---------- */
.btn {
  position: relative; display: flex; align-items: center; justify-content: center; gap: 12px;
  width: 100%; height: 52px; border-radius: 0;
  background: var(--black); color: #fff;
  font-size: 16px; font-weight: 700; letter-spacing: 1px;
  transition: background-color .25s ease, color .25s ease, transform .15s ease;
}
.btn:active { transform: scale(.985); background: #333; }
.btn[disabled] { background: #B3B3B3; color: #fff; cursor: default; transform: none; }
.btn.loading[disabled] { background: #000; }
.btn-white { background: #fff; color: #000; }
.btn-white:active { background: #E5E5E5; }
.btn-red { background: var(--red); color: #fff; }
.btn-red:active { background: #c90032; }
.btn-ol { background: #fff; color: #000; border: 1px solid #000; }
.btn-ol:active { background: var(--soft); }
.btn-ol[disabled] { background: #fff; color: #B3B3B3; border-color: var(--line); }
.btn.is-open { background: var(--red); }
.arr { position: relative; flex: none; display: inline-block; width: 18px; height: 10px; transition: transform .3s var(--ease); }
.arr::before { content: ""; position: absolute; left: 0; right: .5px; top: 50%; height: 1.5px; margin-top: -.75px; background: currentColor; }
.arr::after { content: ""; position: absolute; right: 1px; top: 50%; box-sizing: border-box; width: 7px; height: 7px; margin-top: -3.5px; border-top: 1.5px solid currentColor; border-right: 1.5px solid currentColor; transform: rotate(45deg); }
.btn:not([disabled]) .arr { animation: nudge 2.4s ease-in-out 2s infinite; }
.btn[disabled] .arr { display: none; }
.btn.loading::before { content: ""; width: 16px; height: 16px; border-radius: 50%; border: 2px solid rgba(255,255,255,.4); border-top-color: #fff; animation: spin .8s linear infinite; }
.btn.loading .arr { display: none; }

.line-bar { height: 2px; background: rgba(255,255,255,.25); overflow: hidden; }
.line-bar i { display: block; width: 0; height: 100%; background: #fff; transition: width 1.4s var(--ease); }
.line-bar.red { background: var(--line); height: 3px; }
.line-bar.red i { background: var(--red); }

/* ---------- 跳动数字（逐位滚动） ---------- */
/* 每一位是一条 0–9 循环三遍的数字带，只往上滚，像里程表；基线与旁边文字对齐 */
.odo { display: inline-block; line-height: 1; white-space: nowrap; font-variant-numeric: tabular-nums; }
.odo-d { display: inline-block; vertical-align: top; height: 1em; overflow: hidden; }
.odo-s { display: block; transition: transform 1.8s cubic-bezier(.14, .82, .2, 1); will-change: transform; }
.odo-s i { display: block; height: 1em; line-height: 1; font-style: normal; text-align: center; }
.live-dot { flex: none; display: inline-block; width: 7px; height: 7px; margin-right: 8px; border-radius: 50%; background: var(--red); vertical-align: 1px; animation: livePulse 1.6s ease-out infinite; }

/* ---------- 加载页 ---------- */
.loader { position: fixed; z-index: 200; top: 0; right: 0; bottom: 0; left: 0; display: flex; flex-direction: column; align-items: center; justify-content: center; background: #fff; transition: opacity .6s ease, visibility .6s; }
.loader.hide { opacity: 0; visibility: hidden; }
.loader-rings { width: 72px; height: auto; }
.loader-line { width: 160px; height: 2px; margin-top: 30px; background: #E5E5E5; overflow: hidden; }
.loader-line i { display: block; width: 0; height: 100%; background: #000; transition: width .35s ease; }
.loader-pct { margin-top: 14px; font-size: 12px; color: var(--muted); letter-spacing: 1px; font-variant-numeric: tabular-nums; }
.loader-pct b { font-size: 18px; color: #000; font-weight: 700; }
.loader-name { margin: 30px 24px 0; color: #111; font-size: clamp(16px, 4.4vw, 18px); font-weight: 600; letter-spacing: .06em; line-height: 1.4; white-space: nowrap; }

/* ---------- ① 首屏 ---------- */
.cover { height: 100vh; height: 100dvh; min-height: 600px; overflow: hidden; background: #5d6878; color: #fff; }
.cover-bg { position: absolute; top: 0; right: 0; bottom: 0; left: 0; background: url("assets/hero-a5l-wetland-clear-sky-20260930.jpg") 20% center / cover no-repeat; }
.cover-shade-top { position: absolute; left: 0; right: 0; top: 0; height: 54%; background: linear-gradient(180deg, rgba(12,39,73,.28), rgba(12,39,73,.14) 64%, rgba(12,39,73,0)); }
.cover-shade-bottom { position: absolute; left: 0; right: 0; bottom: 0; height: 25%; background: linear-gradient(rgba(0,0,0,0), rgba(0,0,0,.68)); }
.birds { position: absolute; top: 0; right: 0; bottom: 0; left: 0; overflow: hidden; pointer-events: none; }
.bird { position: absolute; left: 105%; width: 22px; height: 9px; fill: none; stroke: rgba(255,255,255,.7); stroke-width: 2.2; stroke-linecap: round; }
.bird.b1 { top: 36%; animation: birdFly 20s linear 1.5s infinite, flap .8s ease-in-out infinite; }
.bird.b2 { top: 31%; width: 15px; animation: birdFly 27s linear 8s infinite, flap .7s ease-in-out infinite; }
.brand-plate { position: absolute; z-index: 3; top: 0; left: 0; right: 0; height: calc(var(--safe-top) + 64px); display: flex; align-items: end; justify-content: space-between; gap: 22px; padding: 0 24px 16px; background: linear-gradient(180deg, rgba(8,35,74,.34), rgba(8,35,74,0)); }
.cover-rings { display: block; width: 64px; height: auto; filter: brightness(0) invert(1) drop-shadow(0 1px 2px rgba(0,0,0,.62)); }
.cover-faw { display: block; width: 88px; height: auto; filter: brightness(0) invert(1) drop-shadow(0 1px 2px rgba(0,0,0,.62)); }
.cover-test { position: absolute; z-index: 2; top: calc(var(--safe-top) + 82px); right: 24px; max-width: 240px; padding: 5px 7px; border: 1px solid rgba(255,255,255,.8); background: rgba(0,0,0,.28); color: #fff; font-size: 10px; line-height: 1.35; text-align: right; }
.cover-title { position: absolute; z-index: 2; top: calc(var(--safe-top) + 148px); left: 24px; right: 24px; text-shadow: 0 2px 18px rgba(0,0,0,.3); }
.cover-heading { font-size: clamp(22px, 7.4vw, 31px); line-height: 1.2; font-weight: 800; letter-spacing: 0; white-space: nowrap; }
.cover-sub { margin-top: 13px; font-size: clamp(18px, 5.1vw, 21px); line-height: 1.35; font-weight: 600; letter-spacing: .02em; color: rgba(255,255,255,.94); white-space: nowrap; }
.cover-foot { position: absolute; z-index: 2; left: 24px; right: 24px; bottom: calc(var(--safe-bottom) + 18px); }
.pool-label { display: flex; align-items: center; font-size: 12px; letter-spacing: 2px; color: rgba(255,255,255,.8); }
.pool-people { margin-left: auto; font-size: 12px; letter-spacing: .5px; }
.pool-people b { margin-right: 4px; color: #fff; font-weight: 700; }
.pool-number { display: flex; flex-wrap: wrap; align-items: baseline; gap: 4px 8px; margin-top: 10px; font-size: clamp(34px, 10.8vw, 42px); font-weight: 700; letter-spacing: 1px; }
.pool-number small { font-size: 14px; font-weight: 400; opacity: .8; }
.pool-meta { display: flex; justify-content: space-between; align-items: baseline; margin: 10px 0 10px; font-size: 12.5px; color: rgba(255,255,255,.8); }
.pool-meta b { color: #fff; font-weight: 700; }
.pool-meta em { font-style: normal; margin-left: 8px; padding: 1px 6px; background: var(--red); color: #fff; font-size: 11px; }
.cover-dates { margin-top: 21px; padding-left: 12px; border-left: 3px solid var(--red); font-size: 14px; font-weight: 700; letter-spacing: 1.2px; color: #fff; }
.cover-foot .btn { margin-top: 14px; }
.swipe-hint { display: flex; flex-direction: column; align-items: center; gap: 4px; margin-top: 10px; font-size: 11px; letter-spacing: 3px; color: rgba(255,255,255,.6); }
.swipe-hint i { width: 9px; height: 9px; border-left: 1.5px solid currentColor; border-top: 1.5px solid currentColor; transform: rotate(45deg); animation: hintBounce 1.6s ease-in-out infinite; }
.anim { opacity: 0; }
.ready .anim { animation: fadeUp 1s var(--ease) both; }
.ready .a1 { animation-delay: .05s; }
.ready .a2 { animation-delay: .15s; }
.ready .a3 { animation-delay: .8s; }
.ready .a4 { animation-delay: 1s; }
.ready .a5 { animation-delay: 1.15s; }
.ready .a6 { animation-delay: 1.3s; }
.ready .a7 { animation-delay: 1.7s; }

/* ---------- ② 活动说明 ---------- */
.intro { background: #fff; }
.intro-hero { position: relative; height: 62vh; min-height: 420px; max-height: 560px; overflow: hidden; background: #56606e; color: #fff; }
.intro-hero-bg { position: absolute; top: -4%; right: 0; bottom: 0; left: 0; background: url("assets/poster-wetland-20260925.jpg") center 55% / cover no-repeat; animation: kenburns 14s var(--ease) both; }
.intro-hero-shade { position: absolute; inset: 0; background: linear-gradient(to bottom, rgba(0,0,0,.1), transparent 32%, rgba(2,12,22,.16) 45%, rgba(2,12,22,.94) 100%); }
.intro-hero-copy { position: absolute; left: 24px; right: 24px; bottom: clamp(27px, 4.5vh, 40px); text-shadow: 0 2px 15px rgba(0,0,0,.35); }
.intro-overline { font-size: 12px; line-height: 1.45; font-weight: 700; letter-spacing: .08em; }
.intro-journey { margin-top: 5px; font-size: 13px; line-height: 1.45; font-weight: 500; color: rgba(255,255,255,.85); }
.intro-headline { margin-top: 17px; font-size: clamp(31px, 9vw, 36px); line-height: 1.12; font-weight: 800; letter-spacing: -.012em; text-wrap: balance; }
.intro-launch { max-width: 29em; margin-top: 17px; padding-top: 11px; border-top: 1px solid rgba(255,255,255,.42); color: rgba(255,255,255,.9); font-size: 11.5px; line-height: 1.5; font-weight: 500; text-shadow: none; }
.intro-body { padding: 0 24px; background: #fff; }
.intro-poster { padding: 28px 0 26px; border-bottom: 1px solid #c9c9c9; }
.intro-poster-eyebrow { color: #686868; font-size: 12px; line-height: 1.5; font-weight: 700; letter-spacing: .08em; }
.intro-poster-mission { margin-top: 12px; color: #1a1a1a; font-size: 22px; line-height: 1.35; font-weight: 700; }
.intro-poster-action { margin-top: 19px; padding-left: 13px; border-left: 3px solid var(--red); color: #333; font-size: 15px; line-height: 1.55; font-weight: 500; }
.intro-poster-route { margin-top: 12px; padding-left: 16px; color: #686868; font-size: 12px; line-height: 1.6; font-weight: 500; }
.intro-poster-route span { color: #777; }
.intro-purpose { padding: 26px 0 24px; color: #333; }
.intro-purpose h2 { color: #171717; font-size: 18px; line-height: 1.5; font-weight: 700; }
.intro-purpose p { margin-top: 17px; font-size: 14px; line-height: 1.8; }
.intro-purpose strong { color: #171717; font-weight: 700; }
.intro-audience { padding: 16px 0 22px; border-top: 1px solid #e1e1e1; font-size: 13px; line-height: 1.6; color: #4a4a4a; }
.intro-audience > span { margin-right: 8px; font-weight: 700; color: #111; }
.intro-audience small { display: block; margin-top: 3px; color: #777; font-size: 11px; }
/* 活动说明页采用统一字级，用字重和留白区分层级。 */
.intro-overline, .intro-journey, .intro-headline, .intro-launch,
.intro-poster-eyebrow, .intro-poster-mission, .intro-poster-action,
.intro-poster-route, .intro-purpose h2, .intro-purpose p,
.intro-audience, .intro-audience small, .intro .dock-links { font-size: 16px; }
@media (max-width: 360px) { .intro-hero-bg { background-position: center 90%; } }

/* 滚动进场 */
.reveal { opacity: 0; transform: translateY(24px); transition: opacity .9s ease, transform .9s var(--ease); }
.reveal.in { opacity: 1; transform: none; }
.lines > span { display: block; opacity: 0; transform: translateY(14px); transition: opacity .8s ease, transform .8s var(--ease); }
.lines.in > span { opacity: 1; transform: none; }
.lines.in > span:nth-child(2) { transition-delay: .12s; }
.lines.in > span:nth-child(3) { transition-delay: .24s; }
.lines.in > span:nth-child(4) { transition-delay: .36s; }
.lines.in > span:nth-child(5) { transition-delay: .48s; }

.dock {
  position: fixed; z-index: 30; left: 50%; bottom: 0; transform: translateX(-50%);
  width: 100%; max-width: 480px;
  padding: 12px 24px calc(var(--safe-bottom) + 10px);
  background: rgba(255,255,255,.96); border-top: 1px solid var(--line);
  -webkit-backdrop-filter: blur(8px); backdrop-filter: blur(8px);
}
.dock-links { display: flex; justify-content: center; align-items: center; gap: 14px; margin-top: 9px; font-size: 12px; color: var(--grey); }
.intro .dock { position: relative; left: auto; bottom: auto; transform: none; min-height: calc(var(--safe-bottom) + 121px); padding-bottom: calc(var(--safe-bottom) + 31px); }
.dock-links b { color: #000; }
.dock-links i { width: 1px; height: 11px; background: var(--line); }

/* ---------- 表单 ---------- */
.form-view { background: #fff; }
.form { padding: 30px 24px calc(var(--safe-bottom) + 30px); }
.form-kicker { font-size: 11.5px; letter-spacing: 3px; color: var(--muted); }
.form-title { margin-top: 8px; font-size: 30px; font-weight: 800; letter-spacing: 2px; }
.form-sub { margin-top: 8px; font-size: 14px; color: var(--grey); }
.field { position: relative; display: block; padding: 16px 0 12px; border-bottom: 1px solid var(--line); }
.field::after { content: ""; position: absolute; left: 0; right: 0; bottom: -1px; height: 2px; background: #000; transform: scaleX(0); transform-origin: left; transition: transform .4s var(--ease); }
.field:focus-within::after { transform: scaleX(1); }
.field:first-of-type { margin-top: 18px; }
.field .lb { display: flex; justify-content: space-between; font-size: 12.5px; color: var(--grey); margin-bottom: 7px; }
.field .lb em { font-style: normal; color: var(--muted); }
.field input, .field select { width: 100%; border: 0; outline: 0; background: transparent; font-size: 17px; color: #000; padding: 2px 0; -webkit-appearance: none; appearance: none; border-radius: 0; }
.field input::placeholder { color: #BDBDBD; }
.field select { background: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8'%3E%3Cpath d='M1 1l5 5 5-5' fill='none' stroke='%23000' stroke-width='1.4'/%3E%3C/svg%3E") right 2px center no-repeat; padding-right: 20px; }
.field select.empty { color: #BDBDBD; }
.select-pair { display: flex; gap: 20px; }
.select-pair select { flex: 1; min-width: 0; }
.check { display: flex; gap: 10px; align-items: flex-start; margin-top: 22px; font-size: 12.5px; line-height: 1.6; color: var(--grey); }
.check input { flex: none; width: 17px; height: 17px; margin-top: 2px; accent-color: #000; border-radius: 0; }
.check a { color: #000; font-weight: 700; }
.form .btn { margin-top: 26px; }
.form-alt { margin-top: 18px; text-align: center; font-size: 13.5px; color: var(--grey); }
.form-alt b { color: #000; }
.note-line { margin-top: 26px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 12.5px; line-height: 1.8; color: var(--grey); }
.shake { animation: shake .45s ease; }

/* 报名页：湿地照片贯穿页面，双标识反白置于影像上方。 */
.signup-view { background: url("assets/p03-wetland-fullbleed-v86.webp") center top / cover no-repeat #14252a; }
.signup-view::before { content: ""; position: absolute; z-index: 0; top: 0; left: 0; right: 0; height: calc(var(--safe-top) + 204px); background: linear-gradient(180deg, rgba(7,22,30,.42), rgba(7,22,30,.24) 68%, rgba(7,22,30,.16)); pointer-events: none; }
.signup-brand { position: relative; z-index: 1; height: calc(var(--safe-top) + 64px); padding: 0 24px 16px; display: flex; align-items: end; justify-content: space-between; gap: 22px; background: transparent; }
.signup-brand img { filter: brightness(0) invert(1); }
.signup-brand img:first-child { display: block; width: 74px; height: auto; }
.signup-brand img:last-child { display: block; width: 88px; height: auto; }
.signup-header { position: relative; z-index: 1; min-height: 140px; padding: 27px 24px 24px; background: transparent; color: #fff; }
.signup-header-rule { display: block; width: 32px; height: 3px; margin-bottom: 15px; background: var(--red); }
.signup-header h1 { font-size: clamp(22px, 6.3vw, 27px); line-height: 1.25; font-weight: 700; letter-spacing: .01em; white-space: nowrap; text-shadow: 0 1px 12px rgba(0,0,0,.35); }
.signup-header p { margin-top: 10px; font-size: 13px; line-height: 1.4; color: rgba(255,255,255,.75); }
.signup-form {
  position: relative;
  z-index: 1;
  min-height: calc(100dvh - var(--safe-top) - 204px);
  padding-top: 10px;
  padding-bottom: calc(var(--safe-bottom) + 145px);
  background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,.99) 48%, rgba(255,255,255,.96) 63%, rgba(255,255,255,.54) 83%, rgba(255,255,255,.08) 100%);
}
.signup-form .field:first-of-type { margin-top: 0; }
.signup-form .field .lb { color: #171c1d; font-size: 13px; font-weight: 600; }
.signup-form .field .lb em { font-size: 11px; font-weight: 400; color: #858d90; }
.signup-form .field-path { display: block; margin-top: 10px; font-size: 11px; line-height: 1.55; color: #737d80; }
.signup-form input[name="member_card_number"]::placeholder { font-size: 11px; letter-spacing: 0; }
.signup-form .member-card-field { padding-bottom: 16px; }
.signup-form .check { margin-top: 24px; color: #626a6d; }
.signup-form .check input { accent-color: var(--red); }
.signup-dock { min-height: calc(var(--safe-bottom) + 121px); padding-top: 11px; padding-bottom: calc(var(--safe-bottom) + 32px); }
.signup-form .signup-dock .btn { margin-top: 0; }
.signup-form .signup-dock .form-alt { margin-top: 9px; font-size: 12px; line-height: 1.25; }
@media (max-width: 360px) {
  .signup-brand { padding-left: 24px; padding-right: 24px; }
  .signup-header { padding-left: 18px; padding-right: 18px; }
  .signup-form { padding-left: 18px; padding-right: 18px; }
  .signup-form { background-image: linear-gradient(180deg, #fff 0%, rgba(255,255,255,.99) 60%, rgba(255,255,255,.92) 78%, rgba(255,255,255,.64) 100%); }
}

/* ---------- ④ 提交页 ---------- */
.page-links { display: flex; justify-content: space-between; align-items: center; padding: 16px 24px 0; font-size: 14px; font-weight: 700; }
.page-links a:first-child { display: inline-flex; align-items: center; gap: 10px; }
.page-links a:last-child { font-weight: 400; color: var(--grey); }
.upload { padding-top: 16px; }
.status { position: relative; padding: 18px 18px 20px; background: #000; color: #fff; overflow: hidden; }
.status::after { content: ""; position: absolute; top: 0; bottom: 0; left: -60%; width: 40%; background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.09), rgba(255,255,255,0)); animation: shine 4.5s ease-in-out 1s infinite; }
.status-flight { position: absolute; inset: 0; z-index: 0; pointer-events: none; }
.status-bird { position: absolute; right: 17px; bottom: 20px; width: 72px; height: auto; opacity: 0; transform-origin: 50% 75%; }
.status-landing { position: absolute; right: 12px; bottom: 15px; width: 100px; height: 12px; border-top: 1px solid rgba(255,255,255,.26); border-radius: 50%; opacity: 0; }
.status-head { position: relative; z-index: 1; display: flex; justify-content: space-between; align-items: center; gap: 10px; }
.status-chip { display: inline-flex; align-items: center; gap: 6px; padding: 3px 9px; border: 1px solid rgba(255,255,255,.5); font-size: 11.5px; letter-spacing: 1px; }
.upload.is-open .status-chip { border-color: var(--red); background: var(--red); }
.upload.is-open .status-chip::before { content: ""; width: 6px; height: 6px; border-radius: 50%; background: #fff; animation: dotPulse 1.2s ease-in-out infinite; }
.status-title { position: relative; z-index: 1; margin-top: 16px; font-size: 22px; font-weight: 800; letter-spacing: 0; }
.upload.is-closed .status { background: #1F1F1F; }
.upload.is-closed .steps-box, .upload.is-closed .shot-row, .upload.is-closed .field-title { opacity: .4; transition: opacity .4s; }
.upload.is-closed .shot-pick input { pointer-events: none; }
.field-title { display: block; margin: 24px 0 10px; font-size: 15px; font-weight: 700; }
.field-title.small { margin-top: 24px; font-size: 13.5px; color: var(--grey); font-weight: 400; }
.steps-box { display: flex; align-items: center; height: 56px; padding: 0 16px; border: 1px solid var(--line); transition: border-color .3s; }
.steps-box:focus-within { border-color: #000; }
.steps-box input { flex: 1; min-width: 0; border: 0; outline: 0; background: transparent; font-size: 24px; font-weight: 700; letter-spacing: 1px; font-variant-numeric: tabular-nums; }
.steps-box input::placeholder { font-size: 15px; font-weight: 400; letter-spacing: 0; color: #BDBDBD; }
.steps-box span { font-size: 14px; color: var(--grey); }
.shot-row { display: flex; gap: 16px; align-items: flex-start; }
.shot-pick { position: relative; flex: none; width: 108px; height: 150px; border: 1px dashed #B3B3B3; overflow: hidden; display: flex; align-items: center; justify-content: center; background: #fff; transition: border-color .3s, transform .2s; }
.shot-pick:active { transform: scale(.97); }
.shot-pick input { position: absolute; top: 0; right: 0; bottom: 0; left: 0; opacity: 0; width: 100%; height: 100%; z-index: 3; cursor: pointer; }
.shot-empty { display: flex; flex-direction: column; align-items: center; gap: 10px; font-size: 12.5px; color: var(--grey); }
.shot-empty i { position: relative; width: 22px; height: 22px; }
.shot-empty i::before, .shot-empty i::after { content: ""; position: absolute; left: 50%; top: 50%; background: #000; transform: translate(-50%, -50%); }
.shot-empty i::before { width: 22px; height: 1.5px; }
.shot-empty i::after { width: 1.5px; height: 22px; }
.shot-preview { position: absolute; top: 0; right: 0; bottom: 0; left: 0; width: 100%; height: 100%; object-fit: cover; animation: fadeIn .5s ease both; }
.shot-ok { position: absolute; z-index: 2; right: 0; top: 0; width: 26px; height: 26px; background: var(--red); display: none; }
.shot-ok::after { content: ""; position: absolute; left: 9px; top: 5px; width: 6px; height: 11px; border-right: 2px solid #fff; border-bottom: 2px solid #fff; transform: rotate(45deg); }
.shot-pick.has-image { border: 1px solid var(--line); }
.shot-pick.has-image .shot-ok { display: block; animation: popIn .4s var(--ease) .1s both; }
.shot-tips { flex: 1; font-size: 13px; line-height: 1.8; color: var(--text); }
.shot-tips b { display: block; color: #000; }
.shot-tips small { display: block; margin-top: 10px; font-size: 12px; line-height: 1.6; color: var(--muted); text-wrap: pretty; }
.review-progress { margin-top: 16px; }
.review-progress p { margin-bottom: 10px; color: var(--text); font-size: 13px; line-height: 1.6; text-align: center; }
.review-progress-track { height: 3px; background: var(--line); overflow: hidden; }
.review-progress-track i { display: block; width: 0; height: 100%; background: var(--red); transition: width .65s ease-out; }
.review-progress-track.is-complete i { transition-duration: .28s; }
.form-foot { margin-top: 10px; text-align: center; font-size: 12px; color: var(--muted); }
.qa-tools { margin-top: 24px; padding: 17px 15px 16px; border: 1px solid var(--line); background: var(--soft); }
.qa-title { list-style: none; cursor: pointer; font-size: 14px; font-weight: 700; color: var(--ink); }
.qa-title::-webkit-details-marker { display: none; }
.qa-title::after { content: "+"; float: right; font-size: 19px; font-weight: 400; line-height: 16px; }
.qa-tools[open] .qa-title::after { content: "−"; }
.qa-copy { margin-top: 8px; font-size: 12px; line-height: 1.65; color: var(--grey); }
.qa-tools .btn { margin-top: 15px; height: 46px; font-size: 14px; }
.qa-tools .btn[disabled] { background: #fff; color: var(--muted); border-color: var(--line); }
.qa-card-note { margin-top: 16px; padding: 8px 10px; border-left: 2px solid var(--red); background: var(--soft); font-size: 12px; color: var(--text); }

/* 登录页与报名页共用顶部影像、反白标识和渐隐表单层。 */
.login-view { isolation: isolate; background: url("assets/p03-wetland-fullbleed-v86.webp") center bottom / auto 110% no-repeat #14252a; }
.login-view::before { content: ""; position: absolute; z-index: 0; top: 0; left: 0; right: 0; height: calc(var(--safe-top) + 230px); background: linear-gradient(180deg, rgba(7,22,30,.42), rgba(7,22,30,.24) 68%, rgba(7,22,30,.16)); pointer-events: none; }
.login-header { height: 166px; min-height: 0; padding: 0 24px; }
.login-header .signup-header-rule { position: absolute; top: 58px; left: 24px; margin: 0; }
.login-header .form-kicker { position: absolute; top: 84px; left: 24px; right: 24px; margin-top: 0; font-family: var(--audi-font-display); font-size: clamp(22px, 6.3vw, 27px); line-height: 1.2; font-weight: 700; letter-spacing: 0; white-space: nowrap; color: #fff; text-shadow: 0 2px 18px rgba(0,0,0,.3); }
.login-form { position: relative; z-index: 1; display: flex; flex-direction: column; min-height: calc(100dvh - var(--safe-top) - 230px); padding-top: 22px; padding-bottom: 0; background: linear-gradient(180deg, #fff 0%, rgba(255,255,255,.98) 22%, rgba(255,255,255,.85) 38%, rgba(255,255,255,.4) 55%, rgba(255,255,255,.08) 78%, rgba(255,255,255,0) 100%); }
.login-form .form-title { flex: none; margin: 0 0 10px; font-size: 24px; line-height: 1.25; font-weight: 700; letter-spacing: .01em; color: #171c1d; }
.login-form .field:first-of-type { margin-top: 0; }
.login-form .field .lb { color: #171c1d; font-size: 13px; font-weight: 600; }
.login-dock { position: relative; left: auto; bottom: auto; transform: none; width: calc(100% + 48px); max-width: none; min-height: calc(var(--safe-bottom) + 145px); margin: auto -24px 0; padding-top: 11px; padding-bottom: calc(var(--safe-bottom) + 22px); }
.login-form .login-dock .btn { margin-top: 0; }
.login-form .login-dock .form-alt { margin-top: 9px; font-size: 12px; line-height: 1.25; }
.login-form .login-dock .form-alt + .form-alt { margin-top: 7px; }
@media (max-width: 360px) {
  .login-form { padding-left: 18px; padding-right: 18px; }
  .login-dock { width: calc(100% + 36px); margin-left: -18px; margin-right: -18px; }
}
@media (max-height: 700px) {
  .login-header { height: 137px; }
  .login-header .signup-header-rule { top: 29px; }
  .login-header .form-kicker { top: 55px; }
  .login-form { min-height: calc(100dvh - var(--safe-top) - 201px); }
}
@media (max-height: 560px) {
  .login-view { background-size: cover; background-position: center top; }
  .login-form { background-image: linear-gradient(180deg, #fff 0%, #fff 58%, rgba(255,255,255,.9) 78%, rgba(255,255,255,.45) 100%); }
}

/* 每日提交沿用现有的湿地照片与卡片。 */
.view[data-view="upload"] { isolation: isolate; background: #14252a; }
.view[data-view="upload"]::before {
  content: ""; position: absolute; z-index: -1; inset: 0;
  background: linear-gradient(180deg, rgba(7,20,24,.23) 0%, rgba(9,26,30,.28) 25%, rgba(7,20,24,.79) 100%), url("assets/page-upload-wetland-walk-20260927.jpg") center top / cover no-repeat;
}
.view[data-view="upload"] { padding-bottom: 24px; }
.view[data-view="upload"] .page-links { position: relative; z-index: 1; padding: 22px 24px 0; color: #fff; text-shadow: 0 1px 8px rgba(0,0,0,.35); }
.view[data-view="upload"] .page-links a:last-child { color: rgba(255,255,255,.9); }
.view[data-view="upload"] .upload {
  position: relative; margin: clamp(96px, 14vh, 128px) 18px 0; padding: 22px 22px calc(var(--safe-bottom) + 28px);
  background: #f1f1eb; box-shadow: 0 20px 42px rgba(0,0,0,.18);
}
.view[data-view="upload"] .status {
  border-left: 3px solid var(--red);
  background-color: #182b2e;
  background-image: linear-gradient(90deg, rgba(11,28,32,.94), rgba(11,28,32,.8) 56%, rgba(11,28,32,.47)), url("assets/page-upload-wetland-walk-20260927.jpg");
  background-size: cover, cover;
  background-position: center, center 32%;
}
.view[data-view="upload"] .upload.is-closed .status { background-color: #2b3638; }
.view[data-view="upload"] .upload.is-reviewing .status { min-height: 138px; }
.view[data-view="upload"] .upload.is-reviewing .status::after { display: none; }
.upload.is-reviewing .status-title {
  max-width: 100%; padding-right: clamp(40px, 15vw, 65px);
  font-size: clamp(14px, 5vw, 21px); line-height: 1.35; white-space: nowrap;
}
.upload.is-reviewing .status-bird { animation: reviewBirdLoop 8.6s ease-in-out infinite; }
.upload.is-reviewing .status-landing { animation: reviewLanding 8.6s ease-in-out infinite; }
.view[data-view="upload"] .steps-box { background: #fff; border-color: #c6ccca; }
.view[data-view="upload"] .shot-pick { background: #fff; }
.view[data-view="upload"] .upload > .btn { background: #14252a; }
.view[data-view="upload"] .upload > .btn:active { background: #263c41; }
.view[data-view="upload"] .upload > .btn[disabled] { background: #b3b9b7; }
.view[data-view="upload"] .upload.is-complete { margin-top: clamp(72px, 10vh, 96px); padding: 0; background: #fff; box-shadow: 0 24px 52px rgba(0,0,0,.25); }
.view[data-view="upload"] .upload.is-complete .status { display: none; }
.upload-complete { text-align: left; }
.upload-complete-hero {
  display: flex; flex-direction: column; justify-content: space-between;
  min-height: clamp(300px, 39vh, 350px); padding: 24px 22px 27px; color: #fff;
  background: linear-gradient(180deg, rgba(8,18,22,.58), rgba(8,18,22,.07) 42%, rgba(8,18,22,.86)), url("assets/poster-scene-arrival-v20.jpg") center 70% / cover no-repeat;
  background-color: #14252a;
}
.upload-complete-label { display: flex; align-items: center; gap: 9px; font-size: 12px; font-weight: 700; letter-spacing: .07em; }
.upload-complete-label::before { content: ""; display: block; width: 18px; height: 2px; background: var(--red); }
.upload-complete-hero-bottom { animation: finishRise .55s var(--ease) both; }
.upload-complete-count { display: flex; align-items: flex-end; gap: 15px; font-variant-numeric: tabular-nums; }
.upload-complete-count b { font-size: clamp(102px, 27vw, 118px); font-weight: 800; line-height: .79; letter-spacing: -.075em; }
.upload-complete-count span { padding-bottom: 3px; font-size: clamp(24px, 7vw, 30px); font-weight: 800; line-height: 1.14; letter-spacing: -.03em; }
.upload-complete-route { display: flex; align-items: center; gap: 12px; margin-top: 28px; font-size: 11px; font-weight: 700; letter-spacing: .06em; white-space: nowrap; }
.upload-complete-route i { flex: 1; height: 2px; background: var(--red); }
.upload-complete-details { padding: 25px 22px 26px; background: #fff; }
.upload-complete-steps { color: var(--ink); font-variant-numeric: tabular-nums; }
.upload-complete-steps span { display: block; margin-bottom: 2px; color: #5a6060; font-size: 12px; font-weight: 700; letter-spacing: .08em; }
.upload-complete-steps strong { font-size: clamp(32px, 9vw, 39px); font-weight: 800; line-height: 1.2; letter-spacing: -.04em; }
.upload-complete-steps em { margin-left: 7px; font-size: 14px; font-style: normal; font-weight: 700; }
.upload-complete-note { display: flex; align-items: center; gap: 12px; margin-top: 19px; padding-top: 17px; border-top: 1px solid var(--line); }
.upload-complete-note i { position: relative; flex: none; width: 32px; height: 32px; border: 1px solid var(--red); }
.upload-complete-note i::after { content: ""; position: absolute; left: 10px; top: 6px; width: 8px; height: 14px; border-right: 2px solid var(--red); border-bottom: 2px solid var(--red); transform: rotate(45deg); }
.upload-complete-note b { display: block; font-size: 14px; color: #111; }
.upload-complete-note small { display: block; margin-top: 2px; font-size: 11.5px; color: #626868; }
.upload-complete .btn { width: 100%; margin-top: 22px; background: var(--red); }
.upload-complete .btn:active { background: #c90032; }
@keyframes finishRise { from { opacity: 0; transform: translateY(14px); } to { opacity: 1; transform: translateY(0); } }
@media (max-width: 360px) {
  .view[data-view="upload"] .upload { padding-left: 18px; padding-right: 18px; }
  .view[data-view="upload"] .shot-row { gap: 12px; }
  .view[data-view="upload"] .shot-pick { width: 96px; }
  .upload.is-reviewing .status-bird { right: 8px; width: 44px; }
  .upload.is-reviewing .status-landing { right: 2px; width: 58px; }
}
@media (max-width: 279px) {
  .upload.is-reviewing .status-title { padding-right: 0; font-size: clamp(10px, 5vw, 14px); }
  .upload.is-reviewing .status-bird, .upload.is-reviewing .status-landing { display: none; }
}

/* ---------- ⑥ 集章卡 ---------- */
.card-view { background: #fff; padding-bottom: calc(var(--safe-bottom) + 96px); }
.card-pool { padding: 28px 24px 50px; background: #000; color: #fff; }
.card-pool-top { display: flex; justify-content: space-between; align-items: center; }
.rules-link { font-size: 13px; color: rgba(255,255,255,.75); }
.card-pool .pool-number { margin-top: 25px; font-size: clamp(34px, 10.5vw, 43px); line-height: 1.15; }
.card-pool .pool-number small { margin-left: 2px; font-size: 14px; }
.card-pool.pool-enter .pool-number .odo-d { animation: none; }
@keyframes poolDigitFlip {
  0% { opacity: .18; transform: perspective(160px) rotateX(-82deg) translateY(8px); }
  58% { opacity: 1; transform: perspective(160px) rotateX(10deg) translateY(0); }
  100% { opacity: 1; transform: perspective(160px) rotateX(0) translateY(0); }
}
.card-inner { position: relative; padding: 0 20px; }
.route-intro { margin: 0 -20px; padding: 19px 24px 18px; border-bottom: 1px solid var(--line); background: #F8F8F7; }
.route-intro::before { content: ""; display: block; width: 30px; height: 3px; margin-bottom: 11px; background: var(--red); }
.route-intro-title, .route-intro-note { margin: 0; color: #111; font-size: 14px; font-weight: 700; line-height: 1.5; }
.route-intro-title span, .route-intro-note span { display: block; white-space: nowrap; }
.me { padding: 18px 0 16px; border-bottom: 1px solid var(--line); }
.me-row { display: flex; justify-content: space-between; align-items: center; gap: 8px; font-size: 13px; color: var(--text); }
.me-row .who { font-weight: 700; color: #000; }
.me-row .code { color: var(--muted); font-size: 11.5px; letter-spacing: .5px; }
.me-row .code b { color: var(--grey); font-weight: 400; }
.me-row.big { margin: 10px 0 12px; align-items: baseline; }
.me-row .lit { font-size: 15px; }
.me-row .lit b { font-size: 30px; font-weight: 800; color: #000; margin: 0 2px; }
.me-row .lit em { font-style: normal; color: var(--muted); }
.me-row .total b { font-weight: 700; color: #000; }
.banned-note { margin-top: 12px; padding: 10px 12px; background: #FDECF0; color: var(--red); font-size: 13px; font-weight: 700; }
.route { position: relative; padding-top: 20px; }
.route-line { position: absolute; left: 0; top: 0; overflow: visible; pointer-events: none; }
.route-line path { fill: none; stroke-linecap: round; }
.route-line .seg-off { stroke: #CFCFCF; stroke-width: 1.2; stroke-dasharray: 3 5; }
.route-line .seg-on { stroke: var(--red); stroke-width: 1.6; animation: draw .7s var(--ease) both; }
.route-gull { position: absolute; z-index: 3; left: 0; top: 0; width: 38px; height: auto; pointer-events: none; opacity: 0; transition: transform 1.3s cubic-bezier(.3,.1,.2,1), opacity .4s; }
.route-gull.show { opacity: 1; }
.route-gull.hover { animation: gullHover 2.4s ease-in-out infinite; }
.route-grid { position: relative; z-index: 2; display: grid; grid-template-columns: repeat(5, 1fr); row-gap: 24px; }
.cell { display: flex; flex-direction: column; align-items: center; gap: 7px; padding: 2px 0; }
.cell.pop { animation: popIn .55s var(--ease) both; }
.cell .name { font-size: 11px; white-space: nowrap; color: #000; }
.cell.unlit .name { color: #A6A6A6; }
.cell.selected .name { font-weight: 700; color: var(--red); }
.stamp { position: relative; flex: none; width: 46px; height: 46px; border-radius: 50%; display: flex; align-items: center; justify-content: center; background: #fff; border: 2px solid var(--red); box-shadow: 0 0 0 3px #fff; transition: transform .2s var(--ease); }
.cell:active .stamp { transform: scale(.9); }
.stamp img { width: 100%; height: 100%; position: relative; border-radius: 50%; object-fit: cover; }
.stamp b { position: absolute; right: -5px; bottom: -5px; min-width: 18px; height: 18px; padding: 0 4px; border: 2px solid #fff; background: var(--red); color: #fff; font-size: 10px; font-weight: 700; display: flex; align-items: center; justify-content: center; }
.cell.unlit .stamp { background: #fff; border: 1.5px dashed #C4C4C4; }
.cell.unlit .stamp img { opacity: .58; }
.cell.unlit .stamp b { background: #C4C4C4; }
.cell.selected .stamp { box-shadow: 0 0 0 3px #fff, 0 0 0 5px rgba(240,0,60,.45); }
.cell.unlit.selected .stamp { box-shadow: 0 0 0 3px #fff, 0 0 0 5px rgba(0,0,0,.2); }
.cell.newest .stamp::after { content: ""; position: absolute; top: -4px; right: -4px; bottom: -4px; left: -4px; border-radius: 50%; animation: pulseRing 1.8s ease-out 1.2s infinite; }
.cell.slam .stamp { animation: stampSlam .8s cubic-bezier(.2,1.3,.4,1) 1.1s both; }
/* 第24站位于末行第3列下方，终点印章居中承接路线。 */
.final-row { position: relative; z-index: 2; display: flex; justify-content: center; margin-top: 30px; }
.final-row .cell { flex-direction: column-reverse; gap: 7px; }
.final-row .stamp { width: 56px; height: 56px; }
.final-name { text-align: center; }
.final-name b { display: block; font-size: 14.5px; font-weight: 800; color: #000; }
.final-name span { font-size: 11.5px; color: var(--muted); }
.unlit .final-name b { color: #A6A6A6; }
.final-tag { display: inline-block; margin-right: 6px; padding: 0 6px; border: 1px solid #C4C4C4; color: #A6A6A6; font-size: 10.5px; font-style: normal; font-weight: 400; vertical-align: 2px; }
.lit .final-tag { border-color: var(--red); color: var(--red); }
.detail { margin-top: 20px; padding: 14px 0 0; border-top: 1px solid var(--line); min-height: 70px; }
.detail.swap { animation: fadeUp .45s var(--ease) both; }
.detail-head { display: flex; flex-wrap: wrap; justify-content: space-between; align-items: baseline; gap: 2px 8px; }
.detail-head strong { min-width: 0; font-size: 16px; font-weight: 800; overflow-wrap: anywhere; }
.detail-head strong span { display: block; margin-top: 2px; font-size: 12px; font-weight: 400; color: var(--muted); }
.detail-head em { font-style: normal; font-size: 12px; color: var(--muted); white-space: nowrap; }
.detail p { margin-top: 6px; font-size: 13.5px; line-height: 1.7; color: var(--text); }
.detail.unlit p { color: var(--muted); }
.detail-date-link { margin-top: 8px; border: 0; border-bottom: 1px solid var(--red); padding: 3px 0; background: transparent; color: var(--red); font: inherit; font-size: 13px; cursor: pointer; }
.day-archive { margin: 18px 0 8px; border-top: 1px solid var(--line); padding-top: 15px; }
.day-archive summary { color: var(--ink); font-size: 14px; font-weight: 700; cursor: pointer; }
.day-archive-list { display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; margin-top: 12px; }
.day-archive-date { display: flex; min-width: 0; flex-direction: column; align-items: flex-start; gap: 3px; border: 1px solid var(--line); padding: 10px 12px; background: #fff; color: var(--ink); text-align: left; font: inherit; cursor: pointer; }
.day-archive-date b { font-size: 13px; }
.day-archive-date span { max-width: 100%; overflow: hidden; color: var(--muted); font-size: 11px; text-overflow: ellipsis; white-space: nowrap; }
.day-archive-date:focus-visible, .detail-date-link:focus-visible { outline: 2px solid var(--red); outline-offset: 3px; }
.guardian-module { display: grid; grid-template-columns: 1fr; align-items: center; gap: 14px; margin: 22px 0 12px; padding: 18px; border: 1px solid var(--line); border-left: 3px solid var(--red); background: #fafafa; }
.guardian-module-eyebrow { margin: 0 0 5px; color: var(--grey); font-size: 11px; letter-spacing: 1px; }
.guardian-module h2 { margin: 0; color: var(--ink); font-size: clamp(17px, 4.5vw, 20px); font-weight: 800; }
.guardian-module p:last-child { margin-top: 6px; color: var(--grey); font-size: 12px; line-height: 1.5; }
.guardian-module button { width: 100%; min-height: 43px; padding: 9px 11px; background: #111; color: #fff; font: inherit; font-size: 12px; font-weight: 700; white-space: nowrap; }
.guardian-module button span { margin-left: 4px; }
.guardian-module button:disabled { background: #d0d0d0; color: #555; cursor: default; }
@media (max-width: 355px) { .guardian-module { grid-template-columns: 1fr; } .guardian-module button { width: 100%; } }
.dock-two { display: flex; gap: 10px; padding: 12px 20px calc(var(--safe-bottom) + 10px); }
.dock-two .btn { height: 50px; font-size: 15px; letter-spacing: 0; }
.dock-two .btn-ol { flex: 1; }
.dock-two .btn:not(.btn-ol) { flex: 1.3; }

/* ---------- 规则 ---------- */
.rules { background: #fff; }
.rules-body { padding: 30px 24px calc(var(--safe-bottom) + 40px); }
.rules-body h1 { margin-top: 8px; font-size: 30px; font-weight: 800; letter-spacing: 2px; }
.rules-test { margin-top: 16px; padding: 10px 12px; border-left: 2px solid var(--red); background: var(--soft); font-size: 12px; line-height: 1.7; color: var(--text); }
.rules-body h2 { margin-top: 26px; padding-top: 16px; border-top: 1px solid var(--line); font-size: 15px; font-weight: 800; }
.rules-body ol { margin-top: 8px; padding-left: 20px; }
.rules-body li { margin-top: 6px; font-size: 14px; line-height: 1.75; color: var(--text); }
.rules-pending { margin-top: 12px; font-size: 13px; line-height: 1.8; color: var(--grey); }
.rules-back { margin-top: 30px; }
.rules-back a { display: flex; align-items: center; justify-content: center; height: 50px; border: 1px solid #000; font-weight: 700; }

/* ---------- 弹层 ---------- */
.overlay { position: fixed; z-index: 80; top: 0; right: 0; bottom: 0; left: 0; background: rgba(0,0,0,.7); display: flex; align-items: center; justify-content: center; padding: 20px; overflow-y: auto; animation: fadeIn .25s ease both; }
#cert-dialog { align-items: flex-start; background: #090909; }
#cert-dialog .cert-wrap { margin: auto 0; }
.sheet { width: 100%; max-width: 342px; padding: 26px 22px 22px; background: #fff; text-align: center; animation: sheetIn .45s var(--ease) both; }
.stamp-title { margin-top: 12px; font-size: clamp(12px, 5vw, 20px); font-weight: 800; letter-spacing: .02em; line-height: 1.25; white-space: nowrap; color: #fff; }
@media (max-width: 239px) { .stamp-title { font-size: min(12px, 4.7vw); letter-spacing: 0; } }
.seal-wrap { position: relative; display: flex; justify-content: center; align-items: center; height: 224px; margin: 14px -22px 0; overflow: hidden; background: transparent; touch-action: none; }
.seal-index { position: absolute; z-index: 2; top: 9px; right: 18px; display: flex; flex-direction: column; align-items: flex-end; gap: 2px; color: rgba(255,255,255,.88); font-size: 11px; font-weight: 700; letter-spacing: .08em; text-shadow: 0 1px 4px rgba(3,19,32,.65); }
.seal-index .seal-progress { font-size: 10px; font-weight: 500; letter-spacing: .06em; }
.seal-index .seal-count { white-space: nowrap; }
.seal-index b { font-size: 16px; color: #fff; }
.seal-index small { font-size: 10px; }
.stamp-sheet.impact { animation: sheetIn .45s var(--ease) both, impact .3s ease .64s; }
.stamp-place { margin-top: 12px; font-size: 15px; font-weight: 600; line-height: 1.4; color: #fff; text-shadow: 0 1px 5px rgba(0,24,42,.75); animation: fadeUp .5s var(--ease) .8s both; }
.stamp-place strong, .stamp-place .stamp-name { font-size: 15px; font-weight: 600; }
.stamp-steps { margin-top: 4px; font-size: 13px; color: rgba(255,255,255,.9); text-shadow: 0 1px 5px rgba(0,24,42,.75); animation: fadeUp .5s var(--ease) 1s both; }
.stamp-steps b { color: #fff; font-size: 15px; }
.stamp-sheet { position: relative; isolation: isolate; overflow: hidden; background-color: #1d3651; background-position: center; background-size: cover; background-repeat: no-repeat; }
.stamp-sheet.scene-drift::before { content: ""; position: absolute; inset: -4%; z-index: 0; background-image: inherit; background-position: center; background-size: cover; background-repeat: no-repeat; pointer-events: none; animation: p06SceneDrift 7.2s ease-out both; }
.stamp-sheet > .stamp-scene-canvas { position: absolute; inset: 0; z-index: 1; display: block; width: 100%; height: 100%; pointer-events: none; mix-blend-mode: screen; }
.stamp-sheet > :not(.stamp-scene-canvas) { position: relative; z-index: 2; }
@keyframes p06SceneDrift { from { transform: scale(1.075) translateX(var(--scene-drift-from, -1%)); } to { transform: scale(1.005) translateX(var(--scene-drift-to, 1%)); } }
#stamp-dialog { align-items: flex-start; }
#stamp-dialog .stamp-sheet { margin: auto 0; }
.stamp-sheet .btn { margin-top: 22px; background: #fff; color: #122d3a; animation: fadeUp .5s var(--ease) 1.2s both; }
.stamp-sheet .btn:focus-visible { outline: 2px solid #d7e9f1; outline-offset: 3px; }
.stamp-sheet .btn:active { background: #e8eef0; }
.fail-sheet h2 { font-size: 20px; font-weight: 800; }
.fail-sheet p { margin-top: 10px; font-size: 14.5px; line-height: 1.75; color: var(--text); text-wrap: balance; }
.fail-sheet .btn { margin-top: 22px; }
.cert-wrap { display: flex; flex-direction: column; align-items: center; width: 100%; max-width: 340px; }
.cert-heading { color: #fff; font-size: 18px; font-weight: 700; margin-bottom: 12px; }
.cert-heading.framed { box-sizing: border-box; width: 100%; min-height: 41px; padding: 8px 12px; border: 1px solid rgba(255,255,255,.6); text-align: center; }
.poster-choices { display: flex; width: 100%; margin-bottom: 12px; gap: 5px; }
.poster-choices button { flex: 1; min-width: 0; padding: 7px 4px; border: 1px solid rgba(255,255,255,.6); color: #fff; font-size: 12px; white-space: nowrap; }
.poster-choices button.active { background: #fff; color: #000; }
.poster-choices button:disabled { opacity: .42; cursor: default; }
.poster-choices button.active:disabled { opacity: 1; }
.poster-choices[hidden], .cert-share-button[hidden], .cert-back[hidden] { display: none; }
.cert-frame { position: relative; overflow: hidden; line-height: 0; touch-action: pan-y; box-shadow: 0 16px 40px rgba(0,0,0,.45); }
.cert-frame.show { animation: certIn .75s var(--ease) both; }
.cert-frame.show::after { content: ""; position: absolute; top: 0; bottom: 0; left: -50%; width: 45%; background: linear-gradient(90deg, rgba(255,255,255,0), rgba(255,255,255,.5), rgba(255,255,255,0)); animation: shine 1.3s ease-in-out .75s both; pointer-events: none; }
.guardian-mode .cert-frame.show { animation: guardianPosterReveal 1.2s ease-in-out both; }
.guardian-mode .cert-frame.show::after { width: 34%; background: linear-gradient(90deg, transparent, rgba(255,255,255,.19), transparent); animation: guardianPosterSheen 1.05s ease-out 1s both; }
@keyframes guardianPosterReveal {
  0% { opacity: .2; clip-path: inset(0 0 100% 0); transform: translateY(18px) scale(.985); }
  30% { opacity: 1; }
  100% { opacity: 1; clip-path: inset(0 0 0 0); transform: none; }
}
@keyframes guardianPosterSheen {
  from { transform: translateX(0) skewX(-14deg); }
  to { transform: translateX(480%) skewX(-14deg); }
}
.cert-image { width: 100%; max-width: 320px; max-height: 72vh; object-fit: contain; -webkit-touch-callout: default; -webkit-user-select: auto; user-select: auto; }
.guardian-mode .cert-image { max-width: 340px; max-height: 76vh; }
#cert-dialog.guardian-mode { padding: 0; overflow: hidden; background: linear-gradient(180deg, #244664 0%, #315c76 55%, #142f43 100%); }
#cert-dialog.guardian-mode .cert-wrap { position: relative; width: min(100vw, 46.201dvh); max-width: none; height: min(100dvh, 216.444vw); margin: auto; overflow: hidden; }
.guardian-mode .cert-heading, .guardian-mode .cert-hint { display: none; }
.guardian-mode .cert-frame { flex: 1; width: 100%; height: 100%; box-shadow: none; background-size: 100% 100%; background-repeat: no-repeat; }
.guardian-mode .cert-image { display: block; position: absolute; left: 0; top: 0; width: 100%; height: 77.9261%; max-width: none; max-height: none; object-fit: fill; }
.guardian-mode .cert-loading { position: absolute; top: 48%; left: 50%; transform: translate(-50%, -50%); }
.guardian-mode .cert-back { display: none; }
.guardian-mode .close-round { position: absolute; z-index: 2; top: calc(95% - 35px); left: calc(50% - 35px); width: 70px; height: 70px; margin: 0; opacity: 0; }
.cert-loading { display: flex; align-items: center; gap: 10px; color: #fff; font-size: 14px; padding: 60px 0; }
.cert-loading i { width: 18px; height: 18px; border-radius: 50%; border: 2px solid rgba(255,255,255,.35); border-top-color: #fff; animation: spin .8s linear infinite; }
.cert-hint { display: flex; align-items: center; gap: 8px; margin-top: 18px; color: #fff; font-size: 14px; animation: fadeUp .5s var(--ease) .9s both; }
.cert-hint svg { width: 16px; height: 16px; fill: none; stroke: #fff; stroke-width: 1.6; stroke-linecap: round; stroke-linejoin: round; animation: hintDown 1.4s ease-in-out 1.4s infinite; }
.cert-share-button { width: 100%; min-height: 48px; margin-top: 16px; padding: 10px 16px; background: var(--red); color: #fff; font-size: 14px; font-weight: 700; letter-spacing: .5px; }
.cert-share-button span { margin-right: 9px; font-size: 19px; vertical-align: -1px; }
.cert-back { width: 100%; min-height: 48px; margin-top: 16px; border: 1px solid rgba(255,255,255,.75); color: #fff; font-size: 14px; font-weight: 700; }
.close-round { margin-top: 16px; width: 40px; height: 40px; border-radius: 50%; border: 1px solid rgba(255,255,255,.8); color: #fff; font-size: 16px; transition: transform .25s; }
.close-round:active { transform: rotate(90deg) scale(.9); }

/* ---------- 分享发帖引导 ---------- */
.share-overlay { z-index: 90; padding: 0; background: #000; }
.share-guide { position: relative; width: 100%; max-width: 480px; height: 100dvh; margin: 0 auto; overflow-y: auto; background: #fff; -webkit-overflow-scrolling: touch; }
.share-page-image { display: block; width: 100%; height: auto; }
.share-back-hit { position: absolute; top: 1.5%; left: 3%; width: 38%; height: 7%; border: 0; background: transparent; cursor: pointer; }
.share-back-hit:focus-visible { outline: 2px solid #fff; outline-offset: -3px; background: rgba(0,0,0,.12); }

.toast {
  position: fixed; z-index: 100; left: 50%; top: 44%; transform: translate(-50%, -40%);
  max-width: 84%; padding: 13px 20px; background: #000; color: #fff;
  font-size: 14px; text-align: center; line-height: 1.55; letter-spacing: .5px; text-wrap: balance;
  opacity: 0; pointer-events: none; transition: opacity .25s, transform .35s var(--ease);
}
.toast.show { opacity: 1; transform: translate(-50%, -50%); }

/* ---------- 关键帧 ---------- */
@keyframes viewIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes slideUp { from { opacity: 0; transform: translateY(70px); } to { opacity: 1; transform: none; } }
@keyframes fadeIn { from { opacity: 0; } to { opacity: 1; } }
@keyframes fadeUp { from { opacity: 0; transform: translateY(20px); } to { opacity: 1; transform: none; } }
@keyframes sheetIn { from { opacity: 0; transform: translateY(24px); } to { opacity: 1; transform: none; } }
@keyframes popIn { 0% { opacity: 0; transform: scale(.4); } 70% { opacity: 1; transform: scale(1.06); } 100% { opacity: 1; transform: scale(1); } }
@keyframes charIn { from { opacity: 0; transform: translateY(30px); filter: blur(6px); } to { opacity: 1; transform: none; filter: none; } }
@keyframes kenburns { from { transform: scale(1.14); } to { transform: scale(1); } }
@keyframes birdFly { from { transform: translateX(0) translateY(0); } 50% { transform: translateX(-70vw) translateY(-12px); } to { transform: translateX(-140vw) translateY(4px); } }
@keyframes flap { 0%, 100% { transform: scaleY(1); } 50% { transform: scaleY(.3); } }
@keyframes nudge { 0%, 70%, 100% { transform: translateX(0); } 80% { transform: translateX(5px); } 90% { transform: translateX(0); } }
@keyframes hintBounce { 0%, 100% { transform: translateY(2px) rotate(45deg); opacity: .9; } 50% { transform: translateY(-5px) rotate(45deg); opacity: .35; } }
@keyframes hintDown { 0%, 100% { transform: translateY(0); } 50% { transform: translateY(3px); } }
@keyframes livePulse { 0% { box-shadow: 0 0 0 0 rgba(240,0,60,.7); } 80%, 100% { box-shadow: 0 0 0 8px rgba(240,0,60,0); } }
@keyframes dotPulse { 0%, 100% { opacity: 1; } 50% { opacity: .25; } }
@keyframes draw { to { stroke-dashoffset: 0; } }
@keyframes spin { to { transform: rotate(360deg); } }
@keyframes shine { from { transform: translateX(0) skewX(-18deg); } to { transform: translateX(420%) skewX(-18deg); } }
@keyframes shake { 0%, 100% { transform: translateX(0); } 20% { transform: translateX(-6px); } 40% { transform: translateX(5px); } 60% { transform: translateX(-4px); } 80% { transform: translateX(3px); } }
@keyframes stampSlam { 0% { opacity: 0; transform: scale(2.2) rotate(-18deg); } 55% { opacity: 1; transform: scale(.92) rotate(2deg); } 75% { transform: scale(1.04) rotate(0); } 100% { opacity: 1; transform: scale(1) rotate(0); } }
@keyframes ripple { 0% { opacity: .6; transform: scale(.8); } 100% { opacity: 0; transform: scale(1.75); } }
@keyframes impact { 0% { transform: none; } 30% { transform: translateY(4px); } 100% { transform: none; } }
@keyframes pulseRing { 0% { box-shadow: 0 0 0 0 rgba(240,0,60,.55); } 100% { box-shadow: 0 0 0 14px rgba(240,0,60,0); } }
@keyframes certIn { from { opacity: 0; transform: translateY(26px) scale(.94); } to { opacity: 1; transform: none; } }
@keyframes gullHover { 0%, 100% { translate: 0 0; } 50% { translate: 0 -5px; } }
@keyframes plusUp { 0% { opacity: 0; transform: translateY(8px); } 12% { opacity: 1; transform: none; } 75% { opacity: 1; transform: none; } 100% { opacity: 0; transform: translateY(-10px); } }
@keyframes reviewBirdLoop {
  0%, 100% { opacity: 0; transform: translate(-32px, 12px) scale(.57); }
  9% { opacity: .72; transform: translate(-28px, 6px) scale(.59) rotate(-3deg); }
  28% { opacity: .9; transform: translate(-8px, -34px) scale(.72) rotate(-10deg); }
  46% { opacity: .76; transform: translate(23px, -49px) scale(.65) rotate(-4deg); }
  54% { opacity: 0; transform: translate(35px, -48px) scale(.57); }
  59% { opacity: 0; transform: translate(32px, -46px) scaleX(-.57) scaleY(.57); }
  73% { opacity: .72; transform: translate(8px, -28px) scaleX(-.68) scaleY(.68) rotate(4deg); }
  88% { opacity: .82; transform: translate(-26px, 6px) scaleX(-.57) scaleY(.57) rotate(9deg); }
  96% { opacity: 0; transform: translate(-32px, 12px) scaleX(-.57) scaleY(.57); }
}
@keyframes reviewLanding { 0%, 7%, 77%, 100% { opacity: 0; transform: scaleX(.65); } 91% { opacity: .55; transform: scaleX(1); } 97% { opacity: 0; transform: scaleX(1.25); } }

@media (min-width: 481px) { .app { box-shadow: 0 0 40px rgba(0,0,0,.4); } }
/* 矮屏（如 360×640）：标题整体上移、略缩小，少压到 KV 里的红嘴鸥 */
@media (max-height: 700px) {
  .cover-title { top: calc(var(--safe-top) + 119px); }
  .cover-sub { margin-top: 8px; }
  .cover-dates { margin-top: 16px; font-size: 13px; }
  .route-intro-title, .route-intro-note { font-size: 13px; }
}
@media (prefers-reduced-motion: reduce) {
  *, *::before, *::after { animation: none !important; transition: none !important; }
  .anim, .reveal, .lines > span { opacity: 1 !important; transform: none !important; }
  .route-line .seg-on { stroke-dashoffset: 0; }
  .upload.is-reviewing .status-bird { opacity: .65; transform: translate(2px, -22px) scale(.65); }
}

/* v63 · P07 集章卡：当站故事与顺序站点目录 */
.card-view .me { padding: 23px 3px 20px; }
.card-view .me-row .who { font-size: 16px; }
.card-view .me-caption { color: #73797a; font-size: 11px; letter-spacing: .08em; }
.card-view .me-row.big { display: grid; grid-template-columns: 1fr 1fr; gap: 0; margin: 14px 0 17px; }
.card-view .me-row.big > span { display: block; min-width: 0; }
.card-view .me-row.big .total { padding-left: 23px; border-left: 1px solid #d9dbdb; }
.card-view .me-row.big b { display: block; margin: 0; color: #111; font-size: clamp(30px, 9.8vw, 38px); font-weight: 800; line-height: 1; letter-spacing: -.045em; font-variant-numeric: tabular-nums; }
.card-view .me-row.big em { display: block; margin-top: 6px; color: #656b6e; font-size: 11px; font-weight: 400; font-style: normal; }
.card-view .route { padding-top: 26px; }
.route-section-head { display: flex; justify-content: space-between; align-items: end; gap: 10px; padding: 0 2px 18px; border-bottom: 1px solid #cfd3d3; }
.route-section-head span { color: var(--red); font-size: 11px; font-weight: 800; letter-spacing: .14em; }
.route-section-head h2 { margin-top: 5px; font-size: 28px; line-height: 1.1; letter-spacing: -.035em; }
.route-section-head p { margin-bottom: 3px; color: #7a8081; font-size: 11px; white-space: nowrap; }
.card-view .detail { display: grid; grid-template-columns: 102px minmax(0, 1fr); gap: 0 15px; min-height: 137px; margin-top: 18px; padding: 16px; border: 1px solid #dce0df; border-top: 3px solid var(--red); background: #f8f8f7; }
.card-view .detail-art { width: 102px; height: 102px; background: #fff; }
.card-view .detail-art img { display: block; width: 100%; height: 100%; object-fit: cover; }
.card-view .detail-main { min-width: 0; }
.card-view .detail-kicker { color: var(--red); font-size: 10px; font-weight: 800; letter-spacing: .08em; }
.card-view .detail h3 { margin-top: 7px; font-size: 18px; line-height: 1.24; letter-spacing: -.02em; }
.card-view .detail p.detail-region { margin-top: 4px; color: #6b7273; font-size: 11px; line-height: 1.45; }
.card-view .detail p.detail-story { margin-top: 12px; padding-top: 11px; border-top: 1px solid #dfe2e1; color: #3d4547; font-size: 12px; line-height: 1.58; }
.card-view .detail.unlit p.detail-story { color: #6b7273; }
.card-view .detail p.detail-steps { margin-top: 10px; color: #5f6768; font-size: 11px; line-height: 1.4; }
.card-view .detail-date-link { margin-top: 7px; font-size: 11px; font-weight: 700; }
.station-index-head { display: flex; justify-content: space-between; align-items: baseline; margin: 23px 2px 10px; }
.station-index-head span { font-size: 13px; font-weight: 800; }
.station-index-head small { color: #7a8182; font-size: 10px; }
.card-view .route-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 8px; }
.route-tile { position: relative; display: grid; grid-template-columns: 47px 23px minmax(0, 1fr) 9px; align-items: center; gap: 7px; min-width: 0; min-height: 71px; padding: 9px 8px; border: 1px solid #dfe2e1; background: #fff; color: var(--ink); text-align: left; transition: background .2s, border-color .2s; }
.route-tile:hover { border-color: #aaa; }
.route-tile:focus-visible { outline: 2px solid var(--red); outline-offset: 2px; }
.route-tile.selected { border-color: #111; background: #f6f7f6; }
.route-tile.selected::before { position: absolute; top: -1px; bottom: -1px; left: -1px; width: 3px; background: var(--red); content: ""; }
.route-tile img { display: block; width: 47px; height: 47px; object-fit: cover; background: #f4f4f1; filter: grayscale(1); opacity: .82; }
.route-tile.lit img { filter: none; opacity: 1; }
.route-tile-number { color: #858b8c; font-size: 10px; font-weight: 800; letter-spacing: .04em; }
.route-tile.lit .route-tile-number, .route-tile.selected .route-tile-number { color: var(--red); }
.route-tile-text { display: block; min-width: 0; }
.route-tile-text strong, .route-tile-text small { display: block; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.route-tile-text strong { font-size: 12px; font-weight: 700; }
.route-tile-text small { margin-top: 3px; color: #858b8c; font-size: 9px; }
.route-tile-arrow { color: #9fa5a5; font-size: 10px; }
.route-tile.selected .route-tile-arrow { color: var(--red); }
.route-tile.pop { animation: popIn .55s var(--ease) both; }
@media (max-width: 350px) {
  .card-view .detail { grid-template-columns: 82px minmax(0, 1fr); gap: 0 12px; padding: 12px; }
  .card-view .detail-art { width: 82px; height: 82px; }
  .route-tile { grid-template-columns: 39px 18px minmax(0, 1fr); gap: 5px; min-height: 63px; padding: 7px 5px; }
  .route-tile img { width: 39px; height: 39px; }
  .route-tile-arrow { display: none; }
  .route-tile-text strong { font-size: 11px; }
}

/* P02 上半段：沿用客户截图的四行引入、分隔线和三行发起方。 */
.intro-hero-copy .intro-overline { font-size: 16px; line-height: 1.55; font-weight: 700; letter-spacing: 0; }
.intro-hero-copy .intro-launch { max-width: none; margin-top: 19px; padding-top: 16px; border-top: 1px solid rgba(255,255,255,.58); color: #fff; font-size: 23px; line-height: 1.33; font-weight: 800; letter-spacing: 0; text-shadow: 0 2px 15px rgba(0,0,0,.35); }
@media (max-width: 360px) { .intro-hero-copy .intro-overline { font-size: 14px; } .intro-hero-copy .intro-launch { font-size: 20px; } }

/* P07 · 24 站透明插画与浅色水彩天空 */
.card-view .detail {
  grid-template-columns: 112px minmax(0, 1fr);
  column-gap: 15px;
  row-gap: 0;
  min-height: 0;
  padding: 16px 16px 18px;
  overflow: hidden;
  border-color: #d8e1e3;
  border-top-color: var(--red);
  background-color: #fff;
  background-image: linear-gradient(180deg, rgba(255, 255, 255, .08), rgba(255, 255, 255, .28) 29%, rgba(255, 255, 255, .83) 58%, #fff 82%), url("assets/station-sketches/p07-watercolor-sky.png");
  background-position: center, center top;
  background-size: cover, auto 205%;
}
.card-view .detail .detail-art {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 112px;
  height: 119px;
  background: transparent;
}
.card-view .detail .detail-art img {
  width: 112px;
  height: 112px;
  object-fit: contain;
  background: transparent;
  filter: drop-shadow(0 2px 5px rgba(30, 60, 75, .22));
}
.card-view .detail .detail-main {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  padding-top: 8px;
}
.card-view .detail .detail-kicker {
  font-size: 10px;
  letter-spacing: .04em;
}
.card-view .detail h3 {
  margin-top: 10px;
  font-size: 22px;
  line-height: 1.15;
  color: #172226;
}
.card-view .detail p.detail-region {
  margin-top: 7px;
  font-size: 12px;
  color: #5f6b70;
}
.card-view .detail p.detail-story {
  grid-column: 1 / -1;
  width: 100%;
  margin-top: 12px;
  padding-top: 13px;
  border-top: 1px solid #d8e0e2;
  font-size: 12.5px;
  line-height: 1.65;
  color: #344147;
}
.card-view .detail p.detail-steps,
.card-view .detail .detail-date-link {
  grid-column: 1 / -1;
}
.card-view .detail p.detail-steps {
  margin-top: 11px;
  font-size: 11px;
  color: #657175;
}
.card-view .detail .detail-date-link {
  justify-self: start;
  margin-top: 6px;
  color: var(--red);
  border-bottom-color: var(--red);
}
.card-view .route-tile img {
  background: transparent;
}
@media (max-width: 350px) {
  .card-view .detail {
    grid-template-columns: 88px minmax(0, 1fr);
    column-gap: 10px;
    padding: 12px;
  }
  .card-view .detail .detail-art {
    width: 88px;
    height: 100px;
  }
  .card-view .detail .detail-art img {
    width: 88px;
    height: 88px;
  }
  .card-view .detail h3 { font-size: 18px; }
}

.card-view .route-tile img { object-fit: contain; }


/* P02 活动说明｜湖面延伸、正文层级与字幕轨迹。 */
.intro-fullbleed {
  isolation: isolate;
  display: flex;
  flex-direction: column;
  min-height: max(100svh, 1050px);
  background: #071522;
  color: #fff;
}
.intro-fullbleed .intro-hero {
  position: absolute;
  inset: 0;
  z-index: -1;
  width: 100%;
  height: auto;
  min-height: 0;
  max-height: none;
  background: #071522;
}
.intro-fullbleed .intro-hero-bg {
  inset: 0;
  background: url("assets/poster-wetland-extended-v2.png") 18% bottom / auto 112% no-repeat;
  animation: none;
  transform: translate3d(0, var(--p02-photo-shift, 0px), 0) scale(1.025);
  transform-origin: center 36%;
}
.intro-fullbleed .intro-hero-shade {
  background:
    linear-gradient(to bottom, rgba(1,8,17,.76), rgba(1,8,17,.23) 16%, transparent 27%),
    linear-gradient(to bottom, transparent 0%, transparent 30%, rgba(2,10,20,.38) 42%, rgba(2,10,20,.60) 58%, rgba(2,10,20,.56) 78%, rgba(2,10,20,.54) 100%);
}
.intro-fullbleed .intro-hero-copy { display: none; }
.intro-fullbleed .intro-body {
  position: relative;
  z-index: 1;
  display: flex;
  flex: 1;
  flex-direction: column;
  padding: 26px 20px 0;
  background: transparent;
}
.intro-fullbleed .intro-brand-rings {
  position: absolute;
  top: 25px;
  left: 20px;
  display: block;
  width: 56px;
  height: auto;
}
.intro-fullbleed .intro-theme {
  margin: 53px 0 0;
  color: #fff;
  font-size: clamp(18px, 5.3vw, 21px);
  font-weight: 750;
  line-height: 1.3;
  letter-spacing: -.025em;
  white-space: nowrap;
}
.intro-fullbleed .intro-theme::after {
  display: block;
  width: 33px;
  height: 2px;
  margin-top: 14px;
  background: #f0003c;
  content: "";
}
.intro-fullbleed .intro-copy {
  position: relative;
  padding-top: 270px;
  padding-left: 30px;
  color: rgba(255,255,255,.97);
  font-size: 14px;
  font-weight: 400;
  line-height: 1.58;
  letter-spacing: .01em;
  text-align: center;
  text-shadow: 0 1px 8px rgba(0,0,0,.68);
}
.intro-fullbleed .intro-copy p { margin: 0; font-size: 14px; font-weight: 400; line-height: 1.58; }
.intro-fullbleed .intro-copy > .copy-block { margin-top: 20px; padding: 0; border: 0; }
.intro-fullbleed .caption-group { position: relative; }
.intro-fullbleed .caption-group:nth-child(3)::before,
.intro-fullbleed .caption-group:nth-child(4)::before {
  position: absolute;
  top: -11px;
  left: calc(50% - 21px);
  width: 42px;
  height: 1px;
  background: rgba(255,255,255,.53);
  content: "";
}
.intro-fullbleed.p02-caption-ready .caption-group:nth-child(3)::before,
.intro-fullbleed.p02-caption-ready .caption-group:nth-child(4)::before { opacity: 0; transform: scaleX(0); }
.intro-fullbleed.p02-caption-ready .caption-group:nth-child(3).is-playing::before,
.intro-fullbleed.p02-caption-ready .caption-group:nth-child(4).is-playing::before {
  animation: p02-section-rule 500ms cubic-bezier(.2,.7,.2,1) var(--marker-delay, 0ms) both;
}
.intro-fullbleed .intro-progress-rail {
  position: absolute;
  top: 285px;
  bottom: 12px;
  left: 5px;
  width: 1px;
  background: linear-gradient(to bottom, #f0003c, rgba(255,255,255,.74) 20%, rgba(255,255,255,.37));
  pointer-events: none;
}
.intro-fullbleed.p02-caption-ready .intro-progress-rail {
  bottom: auto;
  height: var(--p02-rail-height, 0px);
  transition: height var(--p02-rail-duration, 850ms) cubic-bezier(.2,.7,.2,1);
}
.intro-fullbleed .caption-marker {
  position: absolute;
  z-index: 2;
  top: 4px;
  left: -36px;
  display: block;
  width: 22px;
  height: 22px;
  color: rgba(255,255,255,.95);
  filter: drop-shadow(0 1px 4px rgba(0,0,0,.4));
}
.intro-fullbleed .caption-marker svg {
  display: block;
  width: 22px;
  height: 22px;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.35;
  stroke-linecap: round;
  stroke-linejoin: round;
}
.intro-fullbleed .caption-marker circle { fill: currentColor; stroke: none; }
.intro-fullbleed .caption-line { display: block; }
.intro-fullbleed .caption-group > .caption-line,
.intro-fullbleed .caption-group > p:not(.copy-subblock) .caption-line { color: #fff; font-weight: 500; }
.intro-fullbleed .copy-subblock .caption-line { color: rgba(255,255,255,.87); font-weight: 400; }
.intro-fullbleed .copy-subblock { margin-top: 8px !important; }
.intro-fullbleed .route-sentence { margin-top: 6px; }
.intro-fullbleed .action-tail,
.intro-fullbleed .route-tail { display: block; }
.intro-fullbleed .intro-audience {
  margin-top: auto;
  padding: 16px 0 12px;
  border-top: 1px solid rgba(255,255,255,.33);
  color: rgba(255,255,255,.78);
  font-size: 11px;
  font-weight: 400;
  line-height: 1.6;
}
.intro-fullbleed .intro-audience small { display: block; margin: 0; color: inherit; font-size: 11px; }
.intro-fullbleed .dock {
  position: relative;
  left: auto;
  bottom: auto;
  z-index: 1;
  transform: none;
  min-height: 0;
  padding: 0 20px 20px;
  border: 0;
  background: transparent;
  -webkit-backdrop-filter: none;
  backdrop-filter: none;
}
.intro-fullbleed .dock .btn {
  justify-content: space-between;
  height: 44px;
  padding: 0 16px;
  border: 1px solid #fff;
  background: #fff;
  color: #081625;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .06em;
  transition: transform 120ms ease-out, background-color 120ms ease-out;
}
.intro-fullbleed .dock .btn:active { transform: scale(.985); background-color: #f3f3f3; }
.intro-fullbleed .dock-links { margin-top: 9px; color: rgba(255,255,255,.72); font-size: 10.5px; }
.intro-fullbleed .dock-links b { color: inherit; }
.intro-fullbleed .dock-links i { background: rgba(255,255,255,.42); }
.intro-fullbleed.p02-caption-ready .intro-brand-rings,
.intro-fullbleed.p02-caption-ready .intro-theme { animation: p02-arrive 550ms cubic-bezier(.2,.7,.2,1) both; }
.intro-fullbleed.p02-caption-ready .intro-theme { animation-delay: 100ms; }
.intro-fullbleed.p02-caption-ready .intro-theme::after { animation: p02-rule 650ms cubic-bezier(.2,.7,.2,1) 350ms both; transform-origin: left; }
.intro-fullbleed.p02-caption-ready .caption-marker { opacity: 0; transform: translateY(5px) scale(.9); }
.intro-fullbleed.p02-caption-ready .caption-group.is-playing .caption-marker {
  animation: p02-marker-pop 440ms cubic-bezier(.16,.84,.33,1) var(--marker-delay, 0ms) both;
}
.intro-fullbleed.p02-caption-ready .caption-glyph {
  display: inline-block;
  opacity: 0;
  transform: translateY(6px) scale(.985);
  white-space: pre;
}
.intro-fullbleed.p02-caption-ready .caption-group.is-playing .caption-glyph {
  animation: p02-subtitle-pop 440ms cubic-bezier(.16,.84,.33,1) var(--caption-delay, 0ms) both;
}
@keyframes p02-arrive { from { opacity: 0; translate: 0 9px; } to { opacity: 1; translate: 0 0; } }
@keyframes p02-rule { from { opacity: 0; scale: .15 1; } to { opacity: 1; scale: 1 1; } }
@keyframes p02-subtitle-pop { from { opacity: 0; transform: translateY(6px) scale(.985); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes p02-marker-pop { from { opacity: 0; transform: translateY(5px) scale(.9); } to { opacity: 1; transform: translateY(0) scale(1); } }
@keyframes p02-section-rule { from { opacity: 0; transform: scaleX(0); } to { opacity: 1; transform: scaleX(1); } }
@media (prefers-reduced-motion: reduce) {
  .intro-fullbleed .intro-hero-bg { transform: none; }
  .intro-fullbleed.p02-caption-ready .intro-brand-rings,
  .intro-fullbleed.p02-caption-ready .intro-theme,
  .intro-fullbleed.p02-caption-ready .intro-theme::after,
  .intro-fullbleed.p02-caption-ready .caption-group.is-playing .caption-marker,
  .intro-fullbleed.p02-caption-ready .caption-group.is-playing .caption-glyph { animation: none; }
  .intro-fullbleed.p02-caption-ready .caption-glyph { opacity: 1; transform: none; }
  .intro-fullbleed.p02-caption-ready .caption-marker { opacity: 1; transform: none; }
  .intro-fullbleed.p02-caption-ready .intro-progress-rail { bottom: 12px; height: auto; transition: none; }
  .intro-fullbleed.p02-caption-ready .caption-group:nth-child(3)::before,
  .intro-fullbleed.p02-caption-ready .caption-group:nth-child(4)::before { opacity: 1; transform: none; animation: none; }
  .intro-fullbleed .dock .btn { transition: none; }
}
@media (min-width: 361px) {
  .intro-fullbleed { min-height: max(100svh, 1030px); }
  .intro-fullbleed .intro-body { padding-right: 24px; padding-left: 24px; }
  .intro-fullbleed .intro-brand-rings { left: 24px; }
  .intro-fullbleed .action-tail,
  .intro-fullbleed .route-tail { display: inline; }
  .intro-fullbleed .dock { padding-right: 24px; padding-left: 24px; }
}


/* P02：内容图标、自然湖色与奥迪字体组合。 */
/* P02 使用全站品牌字体栈。 */
.intro-fullbleed { min-height: 1295px; background: #152b3b; font-family: var(--audi-font-body); font-synthesis: none; }
.intro-fullbleed::before {
  position: absolute;
  z-index: 0;
  inset: 340px 0 181px;
  background: linear-gradient(to bottom, rgba(230,230,222,0), rgba(231,231,220,.62) 76px, rgba(227,232,225,.78) 132px, rgba(215,230,228,.80) calc(100% - 115px), rgba(208,227,229,0) 100%);
  content: "";
  pointer-events: none;
}
.intro-fullbleed .intro-hero-bg { background-position: 18% bottom; background-size: auto 112%; filter: brightness(1.1) saturate(1.02); }
.intro-fullbleed .intro-hero-shade { background: transparent; }
.intro-fullbleed .intro-body { padding: 0 18px; background: transparent; }
.intro-fullbleed .intro-brand-rings { top: 30px; left: 50%; width: 62px; transform: translateX(-50%); filter: drop-shadow(0 1px 4px rgba(0,0,0,.42)); }
.intro-fullbleed .intro-theme {
  position: absolute;
  top: calc(var(--safe-top) + 148px);
  right: 24px;
  left: 24px;
  z-index: 2;
  margin: 0;
  color: #fff;
  font-size: clamp(21px, 6.85vw, 28px);
  font-weight: 800;
  line-height: 1.2;
  letter-spacing: 0;
  white-space: nowrap;
  text-align: left;
  text-shadow: 0 2px 12px rgba(0,0,0,.74), 0 0 3px rgba(0,0,0,.55);
}
.intro-fullbleed .intro-theme::after { display: none; }
.intro-fullbleed .intro-copy {
  margin-top: 415px;
  padding: 0 16px 0 52px;
  color: #15384c;
  text-align: left;
  text-shadow: none;
}
.intro-fullbleed .intro-copy > .copy-block { margin-top: 35px; }
.intro-fullbleed .caption-group,
.intro-fullbleed .intro-copy > .copy-block.caption-group { position: relative; padding-top: 19px; }
.intro-fullbleed .caption-group > .caption-line,
.intro-fullbleed .caption-group > p:not(.copy-subblock) .caption-line { color: #12364b; font-weight: 400; }
.intro-fullbleed .copy-subblock .caption-line { color: #33586c; font-weight: 400; }
.intro-fullbleed .copy-subblock { margin-top: 9px !important; }
.intro-fullbleed .caption-node { position: absolute; top: 5px; left: -38px; display: block; width: 9px; height: 9px; border: 1px solid #a74355; border-radius: 50%; background: #e4e9e3; }
.intro-fullbleed .caption-highlight { background: linear-gradient(to bottom, transparent 82%, rgba(160,52,71,.45) 82%, rgba(160,52,71,.45) 93%, transparent 93%); }
.intro-fullbleed .intro-progress-rail {
  top: 10px;
  left: 18px;
  width: 1px;
  background: repeating-linear-gradient(to bottom, rgba(50,90,111,.6) 0 2px, transparent 2px 5px);
}
.intro-fullbleed .caption-marker { top: 0; left: 0; width: 19px; height: 19px; color: #a33f50; filter: none; }
.intro-fullbleed .caption-marker::after { position: absolute; top: 9px; left: 27px; width: 29px; height: 1px; background: rgba(159,65,81,.58); content: ""; }
.intro-fullbleed .caption-marker svg { width: 19px; height: 19px; fill: none; stroke: currentColor; stroke-width: 1.45; stroke-linecap: round; stroke-linejoin: round; }
.intro-fullbleed .caption-marker circle { fill: none; stroke: currentColor; }
.intro-fullbleed .caption-group:nth-child(2)::before,
.intro-fullbleed .caption-group:nth-child(3)::before,
.intro-fullbleed .caption-group:nth-child(4)::before { position: absolute; top: -18px; left: 0; width: 49px; height: 1px; background: rgba(53,100,121,.36); content: ""; }
.intro-fullbleed.p02-caption-ready .caption-group:nth-child(2)::before { opacity: 0; transform: scaleX(0); }
.intro-fullbleed.p02-caption-ready .caption-group:nth-child(2).is-playing::before { animation: p02-section-rule 500ms cubic-bezier(.2,.7,.2,1) var(--marker-delay, 0ms) both; }
.intro-fullbleed.p02-caption-ready .caption-node { opacity: 0; transform: translateY(4px); }
.intro-fullbleed.p02-caption-ready .caption-group.is-playing .caption-node { animation: p02-marker-pop 440ms cubic-bezier(.16,.84,.33,1) var(--marker-delay, 0ms) both; }
.intro-fullbleed .intro-audience {
  margin: auto 0 0;
  padding: 23px 16px 13px 52px;
  border-top: 1px solid rgba(255,255,255,.40);
  color: rgba(255,255,255,.94);
  font-size: 11px;
  line-height: 1.7;
  text-align: left;
  text-shadow: none;
}
.intro-fullbleed .intro-audience .audience-label { display: inline-block; margin-right: 11px; padding-left: 9px; border-left: 2px solid #ef4964; color: #fff; font-size: 11px; font-weight: 700; }
.intro-fullbleed .intro-audience .audience-value { color: #fff; }
.intro-fullbleed .intro-audience small { margin-top: 8px; color: rgba(255,255,255,.83); }
.intro-fullbleed .dock { padding: 0 38px 30px; background: transparent; }
.intro-fullbleed .dock .btn { position: relative; justify-content: center; height: 47px; border: 0; background: #fff; color: #15384c; font-size: 12px; }
.intro-fullbleed .dock .btn .arr { position: absolute; right: 16px; }
.intro-fullbleed .dock .btn:active { background: #edf2f4; }
.intro-fullbleed .dock-links { color: rgba(255,255,255,.86); text-align: center; }
.intro-fullbleed .dock-links i { background: rgba(255,255,255,.48); }
@media (prefers-reduced-motion: reduce) {
  .intro-fullbleed.p02-caption-ready .caption-group:nth-child(2)::before,
  .intro-fullbleed.p02-caption-ready .caption-node { opacity: 1; transform: none; animation: none; }
}
@media (max-width: 360px) {
  .intro-fullbleed { min-height: 1370px; }
  .intro-fullbleed::before { top: 360px; }
  .intro-fullbleed .intro-copy { margin-top: 435px; padding-left: 47px; padding-right: 8px; }
  .intro-fullbleed .intro-progress-rail { left: 17px; }
  .intro-fullbleed .caption-node { left: -35px; }
  .intro-fullbleed .intro-audience { padding-left: 47px; }
  .intro-fullbleed .dock { padding-right: 30px; padding-left: 30px; }
}
@media (max-height: 700px) { .intro-fullbleed .intro-theme { top: calc(var(--safe-top) + 119px); } }


/* P02 PSB full-image artwork; only the interactive controls are DOM elements. */
.intro-psb-full { min-height: 100vh; background: #f7f7f7; color: #1a1a1a; }
.intro-psb-full .intro-psb-art { display: block; width: 100%; height: auto; }
.intro-psb-full .intro-psb-actions {
  padding: 12px 20px calc(22px + var(--safe-bottom));
  background: #f7f7f7 url("assets/p02-psb-paper-tail-v110.png") center top / 100% auto repeat-y;
}
.intro-psb-full .intro-psb-actions .btn { height: 52px; background: #000; color: #fff; font-size: 14px; font-weight: 600; letter-spacing: .04em; }
.intro-psb-full .intro-psb-actions .btn:active { background: #252525; }
.intro-psb-full .intro-psb-links { display: flex; justify-content: center; align-items: center; gap: 13px; margin-top: 13px; color: #555; font-size: 11px; line-height: 1.5; text-align: center; }
.intro-psb-full .intro-psb-links b { color: #1a1a1a; font-weight: 600; }
.intro-psb-full .intro-psb-links i { width: 1px; height: 11px; background: #aaa; }
.intro-psb-full .intro-psb-links a:focus-visible { outline: 2px solid #f0003c; outline-offset: 4px; }

/* 2025 一汽奥迪品牌字体层级：标题 Extended；交互 Wide；其他正文为 Audi Type / 华康金刚黑。 */
body { font-synthesis: none; }
h1, h2, h3, .cover-heading, .cover-sub, .intro-headline, .intro-theme,
.intro-poster-mission, .form-title, .status-title, .stamp-title, .cert-heading,
.rules-body h1, .rules-body h2, .guardian-module h2, .intro-purpose h2,
.intro-fullbleed .caption-highlight { font-family: var(--audi-font-display); }
.cover-heading { font-size: clamp(18px, 5.7vw, 23px); letter-spacing: -.01em; }
button, .btn, .page-links a, .cert-share-button, .cert-back, .rules-back a,
.guardian-module button { font-family: var(--audi-font-ui); }
/* P11 保留无文字原画面，设计文字改为可维护的品牌字体层。 */
.share-page { min-height: 100%; background: #fff; color: #17272d; }
.share-hero { position: relative; height: 153.6vw; max-height: 737px; overflow: hidden; }
.share-hero-art { display: block; width: 100%; height: 100%; object-fit: cover; object-position: top; }
.share-back { position: absolute; top: 5.6vw; left: 5.6vw; display: flex; align-items: center; gap: 1.5vw; color: #171717; font-size: 3.7vw; font-weight: 700; line-height: 1; }
.share-back svg { width: 6vw; height: 6vw; }
.share-hero-title { position: absolute; left: 4vw; bottom: 1vw; margin: 0; color: #161616; font-family: var(--audi-font-display); font-size: 8.3vw; font-weight: 700; line-height: 1.12; letter-spacing: -.01em; }
.share-hero-title::after { content: ""; display: block; height: 2px; width: 100%; margin-top: 1vw; background: #f0003c; }
.share-steps { padding: 0 4vw 6vw; }
.share-step { display: grid; grid-template-columns: 6vw minmax(0,1fr); column-gap: 3vw; padding: 2.3vw 0; border-bottom: 1px solid #d2dddf; }
.share-step:last-child { border-bottom: 0; }
.share-step-icon { color: #f0003c; font-family: var(--audi-font-ui); font-size: 6vw; font-weight: 700; line-height: 1; }
.share-step-icon svg { display: block; width: 6vw; height: 6vw; }
.share-step-copy { color: #17272d; font-family: var(--audi-font-body); font-size: 3.85vw; font-weight: 600; line-height: 1.37; }
.share-step-copy strong { font-weight: 600; }
.share-platforms { display: inline-flex; align-items: center; gap: 1vw; vertical-align: middle; }
.share-platforms img { width: auto; height: 3.5vw; max-height: 18px; }
.share-platforms .xhs { width: 3.5vw; }
.share-topic { margin-top: 1vw; }
/* P02 PSB 无字原画与品牌字体叠层，保留当前正式版／测试版不同配色。 */
.intro-psb-artwork { position: relative; width: 100%; line-height: 0; --p02-accent: #F0003C; }
.intro-psb-artwork.mode-qa { --p02-accent: #407EB8; }
.intro-psb-artwork .intro-psb-art { display: block; width: 100%; height: auto; }
.intro-psb-typography { position: absolute; inset: 0; display: block; width: 100%; height: 100%; overflow: visible; }
.intro-psb-typography text { font-synthesis: none; }
.intro-psb-typography .p02-font-body { font-family: var(--audi-font-body); }
.intro-psb-typography .p02-font-display { font-family: var(--audi-font-display); }
@media (min-width: 480px) {
  .share-back { top: 27px; left: 27px; gap: 7px; font-size: 18px; }
  .share-back svg { width: 29px; height: 29px; }
  .share-hero-title { left: 19px; bottom: 5px; font-size: 40px; }
  .share-steps { padding: 0 19px 29px; }
  .share-step { grid-template-columns: 29px minmax(0,1fr); column-gap: 14px; padding: 11px 0; }
  .share-step-icon { font-size: 29px; }
  .share-step-icon svg { width: 29px; height: 29px; }
  .share-step-copy { font-size: 18px; }
  .share-platforms img { height: 17px; }
  .share-platforms .xhs { width: 17px; }
}

/* P02 湖景长图 v120：文字独立排版，品牌双 Logo 与 P01 同位同尺寸。 */
.intro-lake-v120 { min-height: 100vh; background: #bcc0c0; color: #000; }
.intro-lake-v120 .intro-hero-bg,
.intro-lake-v120 .intro-hero-copy { display: none; }
.intro-lake-v120 .p02-lake-poster {
  position: relative; width: 100%; aspect-ratio: 640 / 1730; overflow: hidden;
  background: url("assets/p02-lake-bg-v120.png") center top / 100% auto no-repeat;
}
.intro-lake-v120 .p02-brand-plate {
  position: absolute; z-index: 4; top: 0; left: 0; right: 0; height: calc(var(--safe-top) + 64px);
  display: flex; align-items: end; justify-content: space-between; gap: 22px;
  padding: 0 24px 16px;
  background: linear-gradient(180deg, rgba(8,35,74,.34), rgba(8,35,74,0));
}
.intro-lake-v120 .p02-brand-rings {
  display: block; width: 64px; height: auto;
  filter: brightness(0) invert(1) drop-shadow(0 1px 2px rgba(0,0,0,.62));
}
.intro-lake-v120 .p02-brand-faw {
  display: block; width: 88px; height: auto;
  filter: brightness(0) invert(1) drop-shadow(0 1px 2px rgba(0,0,0,.62));
}
.intro-lake-v120 .p02-lake-poster::before {
  content: ''; position: absolute; z-index: 0; left: 0; right: 0; top: 0; height: 104.62%; pointer-events: none;
  background:
    radial-gradient(ellipse 48% 9% at 50% 33%, rgba(24,49,68,.43), rgba(75,101,114,.20) 52%, transparent 100%),
    radial-gradient(ellipse 50% 9% at 50% 45%, rgba(239,238,232,.90), rgba(239,238,232,.52) 55%, transparent 100%),
    radial-gradient(ellipse 49% 8% at 50% 54%, rgba(234,236,231,.71), rgba(234,236,231,.36) 54%, transparent 100%),
    radial-gradient(ellipse 49% 8% at 50% 64%, rgba(232,236,234,.68), rgba(232,236,234,.34) 54%, transparent 100%),
    radial-gradient(ellipse 52% 12% at 50% 77%, rgba(234,237,233,.77), rgba(234,237,233,.39) 55%, transparent 100%),
    radial-gradient(ellipse 47% 8% at 50% 88%, rgba(236,238,233,.66), rgba(236,238,233,.33) 53%, transparent 100%);
}
.intro-lake-v120 .p02-lake-poster::after {
  content: ''; position: absolute; z-index: 1; left: 0; right: 0; bottom: 0; height: 5.5%;
  background: linear-gradient(transparent, #bcc0c0); pointer-events: none;
}
.intro-lake-v120 .p02-lake-decor {
  position: absolute; z-index: 1; left: 0; top: 0; display: block; width: 100%; height: 104.62%; pointer-events: none;
}
.intro-lake-v120 .p02-group { position: absolute; z-index: 2; left: 0; width: 100%; padding: 0 24px; text-align: center; }
.intro-lake-v120 .p02-group p { margin: 0; }
.intro-lake-v120 .p02-title {
  top: 32.7%; margin: 0; color: #fff; font-family: var(--audi-font-display);
  font-size: clamp(18px, 5.7vw, 23px); font-weight: 400; letter-spacing: -.01em;
  line-height: 1.2; white-space: nowrap; text-shadow: 0 1px 6px rgba(12,35,48,.45);
}
.intro-lake-v120 .p02-body {
  color: #000; font-family: var(--audi-font-body); font-size: 14px; font-weight: 400;
  letter-spacing: .42px; line-height: 1.45; font-synthesis: none;
}
.intro-lake-v120 .p02-intro { top: 45%; }
.intro-lake-v120 .p02-organizer { top: 54.4%; }
.intro-lake-v120 .p02-walk { top: 64.3%; }
.intro-lake-v120 .p02-purpose { top: 74.8%; }
.intro-lake-v120 .p02-audience { top: 90%; }
.intro-lake-v120 .p02-qualify {
  margin-top: 8px; font-size: clamp(6.5px, 1.85vw, 7.2px);
  font-weight: 400; letter-spacing: 0; line-height: 1.3;
}
.intro-lake-v120 .intro-psb-actions { padding: 0 24px calc(18px + var(--safe-bottom)); background: #bcc0c0; }
.intro-lake-v120 .intro-psb-actions .btn {
  height: 52px; border: 0; background: #000; color: #fff;
  font-family: var(--audi-font-ui); font-size: 16px; font-weight: 700; letter-spacing: 1px;
}
.intro-lake-v120 .intro-psb-actions .btn:active { background: #252525; }
.intro-lake-v120 .intro-psb-links { margin-top: 11px; color: #000; font-family: var(--audi-font-body); font-size: 11px; letter-spacing: .25px; }
.intro-lake-v120 .intro-psb-links b { color: #000; font-weight: 400; }
@media (max-width: 360px) {
  .intro-lake-v120 .p02-group { padding-left: 18px; padding-right: 18px; }
  .intro-lake-v120 .p02-body { font-size: 13px; }
}

/* P02 本地待确认：中段正文对齐线上 P13 荣誉纪念正文。 */
.intro-lake-v120 .p02-intro,
.intro-lake-v120 .p02-organizer,
.intro-lake-v120 .p02-walk,
.intro-lake-v120 .p02-purpose {
  font-family: var(--audi-font-body);
  font-size: 12px;
  font-weight: 400;
  letter-spacing: .07em;
  line-height: 1.75;
  font-synthesis: none;
}
@media (max-width: 360px) {
  .intro-lake-v120 .p02-intro,
  .intro-lake-v120 .p02-organizer,
  .intro-lake-v120 .p02-walk,
  .intro-lake-v120 .p02-purpose { font-size: 11px; }
}