:root {
  --ink: #244c45;
  --ink-deep: #183c36;
  --text: #233630;
  --muted: #6d756d;
  --paper: #f6f0e4;
  --paper-light: #fffaf0;
  --line: rgba(139, 113, 72, .34);
  --gold: #b18a50;
  --gold-dark: #8d6836;
  --shadow: 0 22px 60px rgba(44, 35, 22, .16);
  --radius: 8px;
  --top-controls-x: 0px;
  --top-controls-y: 0px;
  --guide-hotspot-x: 5px;
  --guide-hotspot-y: 10px;
  --vertical-seal-x: 0px;
  --vertical-seal-y: 0px;
  --mode-strip-x: 0px;
  --mode-strip-y: 18px;
  --mode-strip-w: calc((100% - 62px) / 2);
  --guide-grid-x: 0px;
  --guide-grid-y: 38px;
  --guide-grid-w: calc(100% - 4px);
  --cta-row-x: 0px;
  --cta-row-y: 12px;
  --cta-row-w: 320px;
  --reserve-btn-x: 0px;
  --reserve-btn-y: 0px;
  --reserve-btn-w: 100%;
  --reserve-btn-h: 54px;
  --ink-cta-x: 0px;
  --ink-cta-y: 0px;
  --ink-cta-w: 88px;
  --ink-cta-h: 88px;
}

* {
  box-sizing: border-box;
}

html {
  overflow-x: hidden;
  scroll-behavior: smooth;
  background: #efe5d6;
}

body {
  margin: 0;
  min-height: 100vh;
  overflow-x: hidden;
  font-family: "Songti SC", "STSong", "Noto Serif SC", "PingFang SC", "Microsoft YaHei", serif;
  color: var(--text);
  background:
    radial-gradient(circle at 18% 8%, rgba(255, 255, 255, .78), transparent 34%),
    radial-gradient(circle at 84% 18%, rgba(213, 200, 174, .34), transparent 36%),
    linear-gradient(180deg, #f8f1e6 0%, #eadfcd 100%);
  letter-spacing: 0;
}

button {
  font: inherit;
}

.scroll-page-hint {
  position: fixed;
  right: max(8px, env(safe-area-inset-right));
  top: 58%;
  z-index: 12;
  display: grid;
  justify-items: center;
  gap: 4px;
  color: var(--ink-deep);
  opacity: 0;
  pointer-events: none;
  transform: translate(12px, -50%);
  transition: opacity .28s ease, transform .28s ease;
}

.scroll-page-hint.is-visible {
  opacity: .76;
  transform: translate(0, -50%);
}

.scroll-page-hint-arrows {
  display: block;
  font-family: Arial, sans-serif;
  font-size: 19px;
  font-weight: 700;
  line-height: .52;
  text-align: center;
  animation: scroll-page-hint-rise 1.5s ease-in-out infinite;
}

.scroll-page-hint-label {
  writing-mode: vertical-rl;
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .12em;
  text-shadow: 0 1px 0 rgba(255, 250, 240, .9), 0 0 8px rgba(255, 250, 240, .9);
}

@keyframes scroll-page-hint-rise {
  0%, 100% {
    opacity: .42;
    transform: translateY(4px);
  }

  50% {
    opacity: 1;
    transform: translateY(-4px);
  }
}

@media (prefers-reduced-motion: reduce) {
  .scroll-page-hint-arrows {
    animation: none;
  }
}

.app-shell {
  width: min(100%, 520px);
  min-height: 100vh;
  margin: 0 auto;
  background: rgba(255, 250, 240, .52);
}

.hero-scroll {
  padding: 0;
}

.hero-card {
  position: relative;
  min-height: calc(min(100vw, 520px) * 1.7768);
  overflow: hidden;
  border: 0;
  border-radius: 0;
  background: #f7efe3;
  box-shadow: none;
  isolation: isolate;
}

.hero-card::before,
.hero-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
  z-index: -1;
}

.hero-card::before {
  background: url("assets/images/home-hero-bg-no-guide.png?v=20260713-1") center top / cover no-repeat;
}

.hero-card::after {
  border-radius: inherit;
  box-shadow: inset 0 0 34px rgba(101, 83, 49, .1);
}

.hero-bg {
  display: none;
  position: absolute;
  inset: auto 0 27% 0;
  height: 48%;
  background:
    linear-gradient(180deg, transparent 0%, rgba(245, 238, 224, .14) 54%, rgba(245, 238, 224, .8) 100%);
  pointer-events: none;
}

.mist {
  display: none;
  position: absolute;
  width: 180px;
  height: 180px;
  border-radius: 999px;
  filter: blur(24px);
  opacity: .38;
  background: rgba(255, 255, 255, .72);
  pointer-events: none;
}

.mist-left {
  left: -70px;
  top: 28%;
}

.mist-right {
  right: -80px;
  top: 18%;
}

.hero-title-relocated {
  position: absolute;
  left: 0;
  top: 90px;
  z-index: 0;
  width: 520px;
  height: 220px;
  pointer-events: none;
}

.hero-title-relocated::before,
.hero-title-relocated::after {
  content: "";
  position: absolute;
}

.hero-title-relocated::before {
  inset: 0;
  background: url("assets/images/home-hero-bg-no-guide.png?v=20260713-1") center top / 520px 2032px no-repeat;
  -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 86%, transparent 100%);
  mask-image: linear-gradient(180deg, transparent 0%, #000 16%, #000 86%, transparent 100%);
}

.hero-title-relocated::after {
  top: 51px;
  left: 108px;
  width: 304px;
  height: 161px;
  background: url("assets/images/home-hero-bg-no-guide.png?v=20260713-1") -108px -125px / 520px auto no-repeat;
  -webkit-mask-image: radial-gradient(ellipse at center, #000 66%, rgba(0, 0, 0, .82) 82%, transparent 100%);
  mask-image: radial-gradient(ellipse at center, #000 66%, rgba(0, 0, 0, .82) 82%, transparent 100%);
}

.hero-safe-content {
  position: absolute;
  inset: 0;
  z-index: 2;
  transform: translate(-8px, 60px);
}

.top-controls {
  position: relative;
  top: 0;
  z-index: 3;
  display: flex;
  justify-content: flex-end;
  gap: 0;
  align-items: center;
  padding: 28px 44px 0;
  transform: translate(var(--top-controls-x, 0px), var(--top-controls-y, 0px));
}

.top-controls .nav-chip:first-child,
.top-controls .progress-dots {
  display: none;
}

.nav-chip,
.mode-strip,
.guide-item,
.reserve-btn,
.ink-cta,
.vertical-seal,
.modal-close {
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.nav-chip,
.mode-strip,
.guide-item,
.reserve-btn,
.ink-cta,
.vertical-seal {
  overflow: hidden;
}

.nav-chip {
  position: relative;
  display: inline-flex;
  align-items: center;
  gap: 6px;
  min-height: 42px;
  padding: 0 15px;
  border: 0;
  border-radius: 0;
  color: var(--ink-deep);
  background: none;
  box-shadow: none;
  font-size: 15px;
  font-weight: 700;
  white-space: nowrap;
  isolation: isolate;
}

.nav-chip::before,
.nav-chip::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
}

.nav-chip::before {
  background: url("assets/images/reserve-button-frame.png") center / 100% 100% no-repeat;
  opacity: .7;
  z-index: -1;
}

.nav-chip::after {
  display: none;
}

.chip-icon,
.guide-icon {
  display: inline-grid;
  place-items: center;
  color: var(--ink);
}

.chip-icon {
  width: 22px;
  height: 22px;
  padding: 3px;
  border: 0;
  border-radius: 0;
  background: rgba(36, 76, 69, .08);
}

svg {
  display: block;
  width: 100%;
  height: 100%;
  fill: none;
  stroke: currentColor;
  stroke-width: 1.9;
  stroke-linecap: round;
  stroke-linejoin: round;
}

.progress-dots {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 8px;
  min-width: 0;
}

.dot {
  width: 8px;
  height: 8px;
  border: 1px solid rgba(141, 104, 54, .5);
  border-radius: 999px;
  background: rgba(233, 219, 195, .86);
  box-shadow: inset 0 0 0 1px rgba(255, 255, 255, .55);
}

.dot.active {
  width: 13px;
  height: 13px;
  border-color: rgba(25, 65, 58, .4);
  background: var(--ink);
  box-shadow: 0 0 0 4px rgba(36, 76, 69, .08);
}

.title-group {
  display: none;
  position: relative;
  z-index: 2;
  padding: 72px 22px 0;
  text-align: center;
}

.hero-kicker {
  margin: 0 0 10px;
  color: var(--ink-deep);
  font-size: clamp(16px, 4.6vw, 22px);
  font-weight: 700;
  letter-spacing: .1em;
}

h1 {
  margin: 0;
  color: var(--ink-deep);
  font-size: clamp(42px, 12vw, 56px);
  line-height: 1.1;
  font-weight: 800;
  letter-spacing: .03em;
  text-shadow: 0 2px 0 rgba(255, 255, 255, .35), 0 10px 28px rgba(15, 48, 42, .1);
}

h1 span {
  display: block;
  white-space: nowrap;
}

.vertical-seal {
  position: absolute;
  left: auto;
  right: 18px;
  top: 146px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 62px;
  min-height: 97px;
  padding: 0;
  border: 0;
  border-radius: 0;
  appearance: none;
  color: transparent;
  background: none;
  box-shadow: none;
  font-family: inherit;
  font-size: 0;
  font-weight: 800;
  writing-mode: vertical-rl;
  letter-spacing: .08em;
  transform: translate(var(--vertical-seal-x, 0px), var(--vertical-seal-y, 0px));
}

.vertical-seal::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  display: block;
  border: 0;
  border-radius: 0;
  background: url("assets/images/easter-egg-ink-seal.png") center / contain no-repeat;
  box-shadow: none;
  opacity: 1;
  filter: none;
  mix-blend-mode: multiply;
  pointer-events: none;
}

.vertical-seal::after {
  display: none;
}

.guide-hotspot {
  position: absolute;
  left: 50%;
  top: calc(min(100vw, 520px) * 1.275);
  z-index: 5;
  width: var(--guide-hotspot-w, min(68%, 320px));
  height: var(--guide-hotspot-h, 76px);
  padding: 0;
  border: 0;
  background: transparent;
  transform: translate(calc(-50% + var(--guide-hotspot-x, 0px)), var(--guide-hotspot-y, 0px));
  -webkit-tap-highlight-color: transparent;
}

.guide-hotspot::before,
.guide-hotspot::after {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 72%;
  height: 42%;
  border: 1px solid rgba(38, 87, 76, .46);
  border-radius: 50%;
  box-shadow:
    0 0 0 7px rgba(55, 101, 89, .2),
    0 0 0 15px rgba(91, 126, 108, .15),
    0 0 0 24px rgba(147, 145, 105, .11),
    0 0 0 34px rgba(185, 158, 108, .07);
  opacity: .18;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(.62);
  animation: guide-water-pulse 4.2s ease-out infinite;
}

.guide-hotspot::after {
  width: 88%;
  height: 58%;
  border-color: rgba(177, 138, 80, .3);
  box-shadow:
    0 0 0 9px rgba(76, 116, 101, .13),
    0 0 0 20px rgba(177, 151, 103, .09);
  animation-delay: .42s;
}

.guide-hotspot-label {
  position: absolute;
  left: 0;
  right: 0;
  top: 50%;
  z-index: 2;
  display: grid;
  gap: 2px;
  color: #153f37;
  font-family: "Songti SC", "STSong", "Noto Serif SC", serif;
  font-size: 22px;
  font-weight: 800;
  line-height: 1.22;
  letter-spacing: .1em;
  text-align: center;
  text-shadow: 0 1px 0 rgba(255, 250, 240, .92), 0 0 8px rgba(255, 250, 240, .7);
  transform: translateY(-50%);
}

.guide-water-arrow {
  position: absolute;
  left: 50%;
  top: calc(100% - 2px);
  width: 58px;
  height: 44px;
  color: rgba(24, 70, 61, .94);
  filter: drop-shadow(0 1px 0 rgba(255, 250, 240, .95)) drop-shadow(0 0 6px rgba(255, 250, 240, .82));
  pointer-events: none;
  transform: translateX(-50%);
  animation: guide-arrow-rise 2.6s ease-in-out infinite;
}

.guide-water-arrow::before {
  content: "⌃";
  position: absolute;
  inset: -16px 0 auto;
  font-family: Arial, sans-serif;
  font-size: 39px;
  font-weight: 700;
  line-height: 1;
  text-align: center;
  text-shadow:
    0 5px 0 rgba(69, 111, 99, .4),
    0 10px 0 rgba(177, 138, 80, .24);
}

.guide-water-arrow::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: 0;
  width: 52px;
  height: 16px;
  border: 2px solid rgba(39, 91, 80, .56);
  border-radius: 50%;
  box-shadow: 0 0 0 7px rgba(177, 138, 80, .22), 0 0 10px rgba(255, 250, 240, .86);
  transform: translateX(-50%) scale(.48);
  animation: guide-arrow-ripple 2.6s ease-out infinite;
}

@keyframes guide-water-pulse {
  0%, 62% {
    opacity: .16;
    transform: translate(-50%, -50%) scale(.62);
  }

  70% {
    opacity: .68;
  }

  100% {
    opacity: .08;
    transform: translate(-50%, -50%) scale(1.08);
  }
}

@keyframes guide-arrow-rise {
  0%, 44%, 100% {
    opacity: .52;
    transform: translate(-50%, 5px);
  }

  62% {
    opacity: 1;
    transform: translate(-50%, -4px);
  }
}

@keyframes guide-arrow-ripple {
  0%, 48% {
    opacity: 0;
    transform: translateX(-50%) scale(.48);
  }

  62% {
    opacity: .94;
  }

  88%, 100% {
    opacity: 0;
    transform: translateX(-50%) scale(1.28);
  }
}

@media (prefers-reduced-motion: reduce) {
  .guide-hotspot::before,
  .guide-hotspot::after,
  .guide-water-arrow,
  .guide-water-arrow::after {
    animation: none;
  }
}

.hero-bottom {
  position: absolute;
  left: 0;
  right: 0;
  top: calc(min(100vw, 520px) * 1.19);
  z-index: 4;
  margin-top: 0;
  padding: 0 48px 26px;
  transform: translate(var(--hero-bottom-x, 0px), var(--hero-bottom-y, 0px));
}

.mode-strip {
  position: relative;
  top: -18px;
  display: grid;
  grid-template-columns: 1fr;
  gap: 2px;
  align-items: center;
  justify-items: center;
  width: var(--mode-strip-w, 100%);
  min-height: var(--mode-strip-h, 46px);
  margin: 0 auto;
  padding: 4px 12px;
  border: 0;
  border-radius: 0;
  color: var(--ink-deep);
  background: none;
  box-shadow: none;
  text-align: center;
  transform: translate(var(--mode-strip-x, 0px), var(--mode-strip-y, 0px));
}

.mode-strip::before,
.mode-strip::after {
  content: "";
  position: absolute;
  pointer-events: none;
}

.mode-strip::before {
  inset: 0;
  border-radius: inherit;
  background: url("assets/images/reserve-button-frame.png") center / 100% 100% no-repeat;
  opacity: .7;
  z-index: -1;
}

.mode-strip::after {
  display: none;
}

.mode-strip strong {
  display: block;
  font-size: 13px;
  letter-spacing: .02em;
  white-space: nowrap;
}

.mode-strip span {
  display: block;
  font-size: 11px;
  color: #53645f;
  white-space: nowrap;
}

.strip-arrow {
  display: none;
  font-size: 18px;
}

.mode-strip .strip-arrow {
  display: none;
}

.section-heading {
  display: none;
  grid-template-columns: 1fr auto 1fr;
  gap: 10px;
  align-items: center;
  margin: 21px 0 15px;
  color: var(--ink-deep);
}

.section-heading span {
  height: 1px;
  background:
    linear-gradient(90deg, transparent, rgba(153, 118, 66, .55));
}

.section-heading span:last-child {
  background:
    linear-gradient(90deg, rgba(153, 118, 66, .55), transparent);
}

.section-heading h2 {
  margin: 0;
  font-size: 20px;
  line-height: 1.2;
  letter-spacing: .08em;
}

.guide-grid {
  display: grid;
  grid-template-columns: repeat(3, 1fr);
  width: var(--guide-grid-w, 100%);
  min-height: var(--guide-grid-h, auto);
  gap: 9px 10px;
  margin: calc(16px + var(--guide-grid-y, 0px)) auto 0;
  transform: translateX(var(--guide-grid-x, 0px));
}

.guide-item {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  align-items: center;
  min-height: 46px;
  padding: 8px 10px;
  border: 0;
  border-radius: 0;
  color: #12362f;
  background: none;
  box-shadow: none;
  font-size: 13px;
  font-weight: 700;
  text-align: center;
  text-shadow: 0 1px 0 rgba(255, 255, 255, .68);
  isolation: isolate;
}

.guide-item::before,
.guide-item::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
}

.guide-item::before {
  background: url("assets/images/reserve-button-frame.png") center / 100% 100% no-repeat;
  opacity: .7;
  z-index: -1;
}

.guide-item::after {
  display: none;
}

.guide-icon {
  width: 21px;
  height: 21px;
  border-radius: 999px;
  background: transparent;
  box-shadow: none;
}

.cta-row {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  gap: 0;
  align-items: center;
  width: var(--cta-row-w, 100%);
  margin: 24px auto 0;
  transform: translate(var(--cta-row-x, 0px), var(--cta-row-y, 0px));
}

.hero-bottom-cta-only .cta-row {
  margin-top: 178px;
}

.reserve-btn {
  position: relative;
  width: var(--reserve-btn-w, 100%);
  min-height: var(--reserve-btn-h, 48px);
  border: 0;
  border-radius: 0;
  color: var(--ink-deep);
  background: none;
  box-shadow: none;
  font-size: 18px;
  font-weight: 800;
  text-shadow: 0 1px 0 rgba(255, 250, 240, .72);
  isolation: isolate;
  transform: translate(var(--reserve-btn-x, 0px), var(--reserve-btn-y, 0px));
}

.reserve-btn::before,
.reserve-btn::after {
  content: "";
  position: absolute;
  inset: 0;
  border-radius: inherit;
  pointer-events: none;
}

.reserve-btn::before {
  display: block;
  background: url("assets/images/reserve-button-frame.png") center / 100% 100% no-repeat;
  opacity: .7;
  z-index: -1;
}

.reserve-btn::after {
  display: none;
}

.ink-cta {
  position: relative;
  display: grid;
  place-items: center;
  width: var(--ink-cta-w, 72px);
  height: var(--ink-cta-h, 72px);
  border: 0;
  border-radius: 999px;
  color: #fffaf0;
  background: none;
  box-shadow: none;
  font-size: 16px;
  font-weight: 800;
  line-height: 1.35;
  isolation: isolate;
  transform: translate(var(--ink-cta-x, 0px), var(--ink-cta-y, 0px));
}

.ink-cta::before {
  content: "";
  position: absolute;
  left: 50%;
  top: 50%;
  width: 168px;
  height: 198px;
  z-index: -1;
  background: url("assets/images/consult-lotus-cluster.png") center / 100% 100% no-repeat;
  opacity: .78;
  transform: translate(-50%, -49%);
  -webkit-mask-image: radial-gradient(ellipse at 50% 48%, #000 0 17%, rgba(0, 0, 0, .82) 32%, rgba(0, 0, 0, .5) 51%, rgba(0, 0, 0, .2) 70%, transparent 94%);
  mask-image: radial-gradient(ellipse at 50% 48%, #000 0 17%, rgba(0, 0, 0, .82) 32%, rgba(0, 0, 0, .5) 51%, rgba(0, 0, 0, .2) 70%, transparent 94%);
  pointer-events: none;
}

.ink-cta::after {
  display: none;
}

.nav-chip:active,
.mode-strip:active,
.guide-item:active,
.reserve-btn:active,
.ink-cta:active,
.vertical-seal:active {
  filter: saturate(.96) brightness(.98);
}

.nav-chip,
.mode-strip,
.guide-item,
.reserve-btn,
.ink-cta,
.vertical-seal {
  transition: filter .22s ease, transform .22s ease;
}

.nav-chip:hover,
.mode-strip:hover,
.guide-item:hover,
.reserve-btn:hover,
.ink-cta:hover,
.vertical-seal:hover {
  filter: saturate(1.02) brightness(1.03);
}

.button-glass-shine,
.button-ripple {
  position: absolute;
  pointer-events: none;
  border-radius: inherit;
}

.button-glass-shine {
  inset: -18%;
  z-index: 4;
  display: block;
  background:
    radial-gradient(ellipse at 50% 50%, rgba(255, 255, 255, .28), transparent 42%),
    radial-gradient(ellipse at 50% 66%, rgba(36, 76, 69, .1), transparent 58%);
  opacity: 0;
  mix-blend-mode: screen;
  filter: blur(5px);
  transform: scale(.82);
  transition: opacity .26s ease, transform .38s ease;
}

.nav-chip:hover .button-glass-shine,
.mode-strip:hover .button-glass-shine,
.guide-item:hover .button-glass-shine,
.reserve-btn:hover .button-glass-shine,
.ink-cta:hover .button-glass-shine,
.vertical-seal:hover .button-glass-shine {
  animation: none;
  opacity: .56;
  transform: scale(1);
}

.button-ripple {
  left: var(--ripple-x, 50%);
  top: var(--ripple-y, 50%);
  z-index: 3;
  width: var(--ripple-size, 80px);
  height: var(--ripple-size, 80px);
  border: 1px solid rgba(255, 255, 255, .72);
  background:
    radial-gradient(circle, rgba(255, 255, 255, .42) 0 18%, rgba(36, 76, 69, .16) 19% 31%, transparent 32%),
    radial-gradient(circle, transparent 0 45%, rgba(255, 255, 255, .42) 46% 49%, transparent 50%);
  box-shadow: 0 0 18px rgba(255, 255, 255, .28);
  opacity: .8;
  transform: translate(-50%, -50%) scale(.12);
  animation: ink-ripple .72s ease-out forwards;
}

.water-ripple {
  position: absolute;
  left: var(--ripple-x, 50%);
  top: var(--ripple-y, 50%);
  z-index: 5;
  width: var(--water-width, 120px);
  height: var(--water-height, 64px);
  border: 2px solid rgba(65, 112, 101, .48);
  border-radius: 50%;
  opacity: 0;
  pointer-events: none;
  transform: translate(-50%, -50%) scale(.18);
  animation: water-surface-ripple 3s cubic-bezier(.16, .62, .22, 1) forwards;
}

.water-ripple::before,
.water-ripple::after {
  content: "";
  position: absolute;
  border: 2px solid rgba(65, 112, 101, .54);
  border-radius: inherit;
}

.water-ripple::before {
  inset: 14%;
}

.water-ripple::after {
  inset: 29%;
  border-color: rgba(177, 138, 80, .46);
}

.water-ripple-wide {
  filter: drop-shadow(0 2px 5px rgba(36, 76, 69, .12));
}

.water-ripple-round {
  border-color: rgba(218, 231, 220, .62);
  box-shadow:
    0 0 0 7px rgba(56, 103, 92, .32),
    0 0 0 14px rgba(68, 112, 101, .29),
    0 0 0 22px rgba(82, 123, 111, .26),
    0 0 0 31px rgba(98, 135, 119, .23),
    0 0 0 41px rgba(116, 145, 124, .2),
    0 0 0 52px rgba(139, 154, 126, .17),
    0 0 0 64px rgba(159, 157, 116, .14),
    0 0 0 77px rgba(177, 153, 105, .11),
    0 0 0 91px rgba(194, 170, 124, .08),
    0 0 20px 100px rgba(247, 239, 227, .06);
}

@keyframes glass-sweep {
  0% {
    opacity: 0;
    transform: translateX(-14%) scale(.98);
  }

  45% {
    opacity: .82;
    transform: translateX(0) scale(1);
  }

  100% {
    opacity: .48;
    transform: translateX(4%) scale(1);
  }
}

@keyframes ink-ripple {
  0% {
    opacity: .8;
    transform: translate(-50%, -50%) scale(.12);
  }

  72% {
    opacity: .28;
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1);
  }
}

@keyframes water-surface-ripple {
  0% {
    opacity: .82;
    transform: translate(-50%, -50%) scale(.18);
  }

  58% {
    opacity: .58;
  }

  100% {
    opacity: 0;
    transform: translate(-50%, -50%) scale(1.27);
  }
}

@media (prefers-reduced-motion: reduce) {
  .nav-chip:hover .button-glass-shine,
  .mode-strip:hover .button-glass-shine,
  .guide-item:hover .button-glass-shine,
  .reserve-btn:hover .button-glass-shine,
  .ink-cta:hover .button-glass-shine,
  .button-ripple {
    animation: none;
  }
}

.content-preview {
  position: relative;
  overflow: hidden;
  margin: 14px 10px;
  padding: 34px 22px;
  border: 1px solid rgba(139, 113, 72, .22);
  border-radius: 18px;
  background:
    linear-gradient(rgba(255, 250, 240, .78), rgba(255, 250, 240, .9)),
    url("assets/images/review-hero-bg.jpg") center top / cover no-repeat;
}

.content-preview .eyebrow {
  margin: 0 0 8px;
  color: var(--gold-dark);
  font-size: 13px;
  font-weight: 800;
}

.content-preview h2 {
  margin: 0 0 12px;
  color: var(--ink-deep);
  font-size: 25px;
  line-height: 1.25;
}

.content-preview p {
  margin: 0;
  color: var(--muted);
  font-size: 15px;
  line-height: 1.8;
}

.modal-backdrop {
  position: fixed;
  inset: 0;
  z-index: 20;
  display: grid;
  place-items: center;
  padding: 22px;
  background:
    linear-gradient(180deg, rgba(39, 52, 48, .58), rgba(39, 52, 48, .66)),
    rgba(20, 31, 28, .58);
}

.modal-backdrop[hidden] {
  display: none;
}

.guide-modal-backdrop {
  z-index: 22;
}

.guide-modal {
  position: relative;
  width: min(100%, 430px);
  padding: 38px 22px 22px;
  border: 18px solid transparent;
  border-image: url("assets/images/reserve-button-frame.png") 90 110 fill / 18px / 0 round;
  color: var(--ink-deep);
  background:
    linear-gradient(rgba(255, 250, 240, .82), rgba(255, 250, 240, .9)),
    url("assets/images/review-hero-bg.jpg") center bottom / cover no-repeat;
  box-shadow: 0 30px 90px rgba(10, 20, 18, .34);
}

.guide-modal-title {
  margin: 0;
  color: var(--ink-deep);
  font-size: 22px;
  line-height: 1.25;
  text-align: center;
  letter-spacing: .04em;
}

.guide-modal-lead {
  margin: 7px 0 16px;
  color: rgba(35, 61, 53, .72);
  font-size: 13px;
  line-height: 1.5;
  text-align: center;
}

.guide-home-button {
  display: grid;
  width: 100%;
  min-height: 58px;
  margin: 0 auto 14px;
  padding: 9px 24px;
  border: 0;
  color: var(--ink-deep);
  background: url("assets/images/reserve-button-frame.png") center / 100% 100% no-repeat;
  place-content: center;
  gap: 1px;
}

.guide-home-button small,
.guide-modal-grid small {
  color: rgba(111, 80, 31, .76);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .08em;
}

.guide-home-button strong {
  font-size: 18px;
  font-weight: 800;
}

.guide-modal-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 13px;
}

.guide-modal-grid button {
  display: grid;
  min-height: 64px;
  padding: 10px 8px;
  border: 0;
  color: #12362f;
  background: url("assets/images/reserve-button-frame.png") center / 100% 100% no-repeat;
  place-content: center;
  gap: 3px;
}

.guide-modal-grid strong {
  font-size: 15px;
  font-weight: 800;
  line-height: 1.25;
}

.guide-modal-footer {
  display: flex;
  justify-content: center;
  margin-top: 18px;
}

.guide-consult-button {
  width: 100%;
  min-height: 48px;
  padding: 10px 18px;
  border: 1px solid rgba(198, 166, 90, .68);
  border-radius: 3px;
  color: #fffaf0;
  background: rgba(27, 67, 59, .9);
  box-shadow: 0 8px 24px rgba(24, 60, 54, .2);
  font-size: 16px;
  font-weight: 800;
}

.qr-modal {
  position: relative;
  width: min(100%, 380px);
  padding: 34px 24px 28px;
  border: 18px solid transparent;
  border-image: url("assets/images/reserve-button-frame.png") 90 110 fill / 18px / 0 round;
  border-radius: 0;
  clip-path: inset(0 round 18px);
  color: var(--ink-deep);
  background: rgba(255, 250, 240, .82);
  box-shadow: 0 30px 90px rgba(10, 20, 18, .34);
  text-align: center;
}

.qr-modal::before {
  content: none;
}

.qr-modal > * {
  position: relative;
  z-index: 1;
}

.modal-close {
  position: absolute;
  right: 12px;
  top: 12px;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 33px;
  height: 33px;
  border: 0;
  border-radius: 0;
  color: var(--ink-deep);
  background: transparent;
  font-size: 26px;
  line-height: 1;
}

.qr-modal h2 {
  margin: 0 0 20px;
  font-size: 27px;
  letter-spacing: .08em;
}

.qr-frame {
  width: min(270px, 76vw);
  margin: 0 auto 18px;
  padding: 10px;
  border: 1px solid rgba(150, 116, 68, .42);
  border-radius: var(--radius);
  background: #fff;
  box-shadow: 0 12px 26px rgba(65, 50, 27, .1);
}

.qr-frame img {
  display: block;
  width: 100%;
  height: auto;
}

.qr-modal p {
  margin: 0;
  font-size: 16px;
  font-weight: 700;
}

.ink-modal-backdrop {
  z-index: 24;
  align-items: start;
  padding: 18px;
  overflow-y: auto;
}

.ink-modal {
  position: relative;
  width: min(100%, 500px);
  max-height: calc(100vh - 36px);
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(150, 116, 68, .34);
  border-radius: 8px;
  color: var(--ink-deep);
  background:
    radial-gradient(circle at 18% 12%, rgba(211, 222, 205, .46), transparent 28%),
    radial-gradient(circle at 86% 4%, rgba(220, 199, 154, .28), transparent 24%),
    linear-gradient(180deg, rgba(255, 251, 242, .97), rgba(248, 241, 226, .97));
  box-shadow: 0 30px 90px rgba(10, 20, 18, .38);
}

.ink-modal-scroll {
  max-height: calc(100vh - 36px);
  overflow-y: auto;
  -webkit-overflow-scrolling: touch;
}

.ink-hero-image {
  display: grid;
  place-items: center;
  margin: 0;
  border-bottom: 1px solid rgba(150, 116, 68, .25);
  background: rgba(244, 250, 247, .72);
}

.ink-hero-image img {
  display: block;
  width: 100%;
  height: min(72vh, 720px);
  object-fit: contain;
  object-position: center;
}

.ink-modal-content {
  padding: 24px 24px 28px;
}

.ink-modal-kicker {
  display: inline-flex;
  margin: 0 0 12px;
  padding: 5px 12px;
  border-radius: 999px;
  color: #7d5a26;
  background: rgba(216, 199, 164, .42);
  font-size: 14px;
  font-weight: 800;
}

.ink-modal h2 {
  margin: 0 0 14px;
  color: var(--ink-deep);
  font-size: clamp(30px, 7.8vw, 42px);
  line-height: 1.16;
  letter-spacing: .03em;
}

.ink-lead {
  margin: 0 0 22px;
  color: #385f58;
  font-size: 18px;
  line-height: 1.85;
  font-weight: 700;
}

.ink-text-block,
.ink-video-block {
  margin-top: 20px;
  padding-top: 20px;
  border-top: 1px solid rgba(150, 116, 68, .24);
}

.ink-text-block h3,
.ink-video-block h3 {
  margin: 0 0 10px;
  color: var(--ink-deep);
  font-size: 21px;
  line-height: 1.35;
}

.ink-text-block p {
  margin: 0 0 12px;
  color: #38524c;
  font-size: 16px;
  line-height: 1.9;
  text-align: justify;
}

.ink-text-block p:last-child {
  margin-bottom: 0;
}

.ink-video-block video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 1px solid rgba(27, 76, 68, .16);
  border-radius: 8px;
  background: #0f2d28;
  box-shadow: 0 16px 36px rgba(25, 42, 37, .16);
}

.layout-editing [data-layout-target] {
  position: relative;
  outline: 2px dashed rgba(35, 115, 100, .82);
  outline-offset: 4px;
  cursor: move;
}

.layout-editing [data-layout-resizable="true"] {
  overflow: visible;
}

.layout-resize-handle {
  position: absolute;
  right: -8px;
  bottom: -8px;
  z-index: 31;
  width: 15px;
  height: 15px;
  border-right: 3px solid #1c8f7a;
  border-bottom: 3px solid #1c8f7a;
  border-radius: 2px;
  background: rgba(255, 252, 244, .85);
  cursor: nwse-resize;
  pointer-events: auto;
}

.layout-editing [data-layout-target]::selection {
  background: transparent;
}

.layout-target-label {
  position: absolute;
  left: 0;
  top: -24px;
  z-index: 30;
  padding: 3px 7px;
  border-radius: 5px;
  color: #fff;
  background: rgba(24, 60, 54, .9);
  font-size: 12px;
  line-height: 1;
  white-space: nowrap;
  pointer-events: none;
}

.layout-editing .is-dragging {
  outline-color: #1c8f7a;
  filter: drop-shadow(0 8px 18px rgba(24, 60, 54, .22));
}

.layout-editor-panel {
  position: fixed;
  right: 16px;
  bottom: 16px;
  z-index: 100;
  width: min(330px, calc(100vw - 32px));
  padding: 12px;
  border: 1px solid rgba(36, 76, 69, .28);
  border-radius: 10px;
  color: #173c35;
  background: rgba(255, 252, 244, .94);
  box-shadow: 0 18px 50px rgba(44, 35, 22, .2);
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
}

.layout-editor-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
  cursor: move;
  touch-action: none;
}

.layout-editor-header button {
  min-width: 48px;
  min-height: 28px;
  border: 1px solid rgba(36, 76, 69, .28);
  border-radius: 5px;
  color: #173c35;
  background: #fffaf0;
  font-size: 12px;
  font-weight: 700;
  cursor: pointer;
}

.layout-editor-body {
  display: block;
}

.layout-editor-panel.is-collapsed {
  width: auto;
  padding: 8px 10px;
}

.layout-editor-panel.is-collapsed .layout-editor-body {
  display: none;
}

.layout-editor-panel strong,
.layout-editor-panel span {
  display: block;
}

.layout-editor-panel strong {
  font-size: 14px;
}

.layout-editor-panel span {
  margin-top: 4px;
  color: #5e6b65;
  font-size: 12px;
  line-height: 1.5;
}

.layout-editor-actions {
  display: flex;
  gap: 8px;
  margin-top: 10px;
}

.layout-editor-actions button {
  flex: 1;
  min-height: 32px;
  border: 1px solid rgba(36, 76, 69, .28);
  border-radius: 7px;
  color: #173c35;
  background: #fffaf0;
  font-size: 12px;
  font-weight: 700;
}

.layout-editor-panel pre {
  max-height: 160px;
  margin: 10px 0 0;
  padding: 8px;
  overflow: auto;
  border-radius: 7px;
  color: #2b413b;
  background: rgba(36, 76, 69, .07);
  font-size: 11px;
  line-height: 1.45;
  white-space: pre-wrap;
}

@media (max-width: 390px) {
  .hero-scroll {
    padding: 0;
  }

  .hero-card {
    border-radius: 0;
  }

  .top-controls {
    padding-inline: 10px;
    gap: 5px;
  }

  .nav-chip {
    padding-inline: 8px;
    font-size: 12px;
  }

  .progress-dots {
    gap: 5px;
  }

  .title-group {
    padding-top: 55px;
  }

  h1 {
    font-size: clamp(39px, 11.3vw, 44px);
  }

  .hero-bottom {
    padding-inline: 26px;
    top: calc((100vw - 12px) * 1.19);
  }

  .guide-grid {
    gap: 8px;
  }

  .guide-item {
    grid-template-columns: 1fr;
    padding-inline: 7px;
    font-size: 10px;
  }

  .cta-row {
    grid-template-columns: 1fr 92px;
  }

  .ink-cta {
    width: 86px;
    height: 86px;
  }
}

/* Fifth screen: teaching, management and student support rebuilt from verified project materials. */
.support-redesign {
  overflow: hidden;
}

.support-scene-heading,
.support-video-module > header,
.support-management-module > header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
}

.support-scene-heading {
  margin-top: 22px;
}

.support-scene-heading strong,
.support-video-module h3,
.support-management-module h3 {
  margin: 0;
  color: var(--ink-deep);
  font-size: 18px;
  line-height: 1.35;
}

.support-scene-heading span,
.support-video-module > header > span,
.support-management-module > header > span {
  flex: 0 0 auto;
  color: #6f7c76;
  font-size: 11px;
  line-height: 1.4;
}

.support-scene-gallery {
  grid-auto-columns: 76%;
  margin-top: 12px;
  margin-bottom: 8px;
  gap: 10px;
}

.support-scene-gallery img,
.support-scene-gallery img:nth-child(2n),
.support-scene-gallery img:nth-child(3n) {
  aspect-ratio: 4 / 3;
  border-width: 5px;
  border-radius: 4px;
  object-fit: contain;
  transform: none;
  box-shadow: 0 12px 26px rgba(30, 62, 53, .13);
}

.support-value-strip {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  margin: 8px 0 24px;
  border-block: 1px solid rgba(160, 128, 76, .24);
  background: rgba(255, 252, 244, .48);
}

.support-value-strip > span {
  min-width: 0;
  padding: 12px 7px;
  text-align: center;
}

.support-value-strip > span + span {
  border-left: 1px solid rgba(160, 128, 76, .2);
}

.support-value-strip b,
.support-value-strip small {
  display: block;
}

.support-value-strip b {
  color: var(--ink-deep);
  font-size: 12px;
  line-height: 1.35;
}

.support-value-strip small {
  margin-top: 4px;
  color: #6c7872;
  font-size: 9px;
  line-height: 1.4;
}

.support-video-module,
.support-management-module {
  margin-top: 22px;
}

.support-video-module > header small,
.support-management-module > header small,
.support-detail-grid small,
.support-lunch-card small {
  display: block;
  margin-bottom: 3px;
  color: var(--gold-dark);
  font-size: 10px;
  line-height: 1.35;
  font-weight: 800;
  letter-spacing: .08em;
}

.support-video-card {
  width: 100%;
  margin-top: 11px;
  padding: 6px;
  aspect-ratio: 16 / 9;
  border: 1px solid rgba(164, 129, 76, .38);
  border-radius: 4px;
  background: linear-gradient(135deg, #173d35, #0b2822);
  box-shadow: 0 13px 28px rgba(26, 48, 41, .16);
}

.support-video-card > .unified-video-player {
  width: 100%;
  height: 100%;
  aspect-ratio: 16 / 9;
  border-radius: 2px;
  object-fit: contain;
}

.support-video-card .unified-video-inline-play {
  inset: 6px;
}

.support-video-card .video-play {
  top: 50%;
  width: 56px;
  height: 56px;
}

.support-video-card .video-play::before {
  left: 23px;
  top: 17px;
  width: 17px;
  height: 22px;
}

.support-video-card .school-video-fullscreen-button {
  right: 12px;
  bottom: 12px;
}

.support-management-module {
  padding-top: 22px;
  border-top: 1px solid rgba(159, 125, 73, .22);
}

.support-accordion {
  display: grid;
  gap: 8px;
  margin-top: 12px;
}

.support-accordion details {
  overflow: hidden;
  border: 1px solid rgba(139, 113, 72, .23);
  border-radius: 5px;
  background: rgba(255, 251, 242, .68);
  box-shadow: 0 7px 18px rgba(44, 35, 22, .05);
}

.support-accordion summary {
  position: relative;
  display: grid;
  gap: 3px;
  min-height: 52px;
  padding: 11px 42px 11px 13px;
  cursor: pointer;
  list-style: none;
}

.support-accordion summary::-webkit-details-marker {
  display: none;
}

.support-accordion summary::after {
  content: "+";
  position: absolute;
  right: 13px;
  top: 50%;
  color: var(--gold-dark);
  font-size: 22px;
  line-height: 1;
  transform: translateY(-50%);
}

.support-accordion details[open] summary::after {
  content: "−";
}

.support-accordion summary b {
  color: var(--ink-deep);
  font-size: 14px;
  line-height: 1.35;
}

.support-accordion summary span {
  color: #66736d;
  font-size: 11px;
  line-height: 1.45;
}

.support-accordion details > p {
  margin: 0;
  padding: 0 13px 13px;
  color: #4f615a;
  font-size: 12px;
  line-height: 1.7;
}

.support-detail-grid {
  display: grid;
  grid-template-columns: 1fr;
  gap: 9px;
  margin-top: 22px;
}

.support-detail-grid button {
  position: relative;
  display: grid;
  gap: 2px;
  width: 100%;
  min-height: 76px;
  padding: 13px 42px 13px 15px;
  border: 1px solid rgba(139, 113, 72, .25);
  border-radius: 5px;
  color: inherit;
  background:
    linear-gradient(90deg, rgba(255, 252, 244, .94), rgba(244, 239, 224, .82)),
    var(--paper-texture);
  box-shadow: 0 9px 22px rgba(44, 35, 22, .07);
  text-align: left;
  cursor: pointer;
}

.support-detail-grid button::after {
  content: "›";
  position: absolute;
  right: 15px;
  top: 50%;
  color: var(--gold-dark);
  font-size: 25px;
  transform: translateY(-50%);
}

.support-detail-grid strong {
  color: var(--ink-deep);
  font-size: 16px;
  line-height: 1.35;
}

.support-detail-grid button > span {
  color: #65726c;
  font-size: 11px;
  line-height: 1.45;
}

.support-lunch-card {
  position: relative;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr) 18px;
  align-items: center;
  gap: 12px;
  width: 100%;
  margin-top: 12px;
  padding: 15px 13px;
  border: 1px solid rgba(171, 132, 70, .34);
  border-radius: 5px;
  color: inherit;
  background:
    radial-gradient(circle at 12% 18%, rgba(185, 142, 72, .12), transparent 29%),
    rgba(255, 250, 238, .84);
  box-shadow: 0 11px 25px rgba(44, 35, 22, .08);
  text-align: left;
  cursor: pointer;
}

.support-lunch-seal {
  display: grid;
  place-items: center;
  width: 48px;
  height: 48px;
  border: 1px solid rgba(177, 138, 80, .56);
  border-radius: 50%;
  color: #fffaf0;
  background: var(--ink);
  box-shadow: 0 0 0 4px rgba(177, 138, 80, .13);
  font: 800 20px/1 "STKaiti", "Kaiti SC", serif;
}

.support-lunch-card strong,
.support-lunch-card em {
  display: block;
}

.support-lunch-card strong {
  color: var(--ink-deep);
  font-size: 18px;
  line-height: 1.3;
}

.support-lunch-card em {
  margin-top: 4px;
  color: #596a63;
  font-size: 11px;
  line-height: 1.55;
  font-style: normal;
}

.support-lunch-card > b {
  color: var(--gold-dark);
  font-size: 26px;
  line-height: 1;
}

.support-source-note {
  margin: 13px 0 0;
  color: #76807b;
  font-size: 10px;
  line-height: 1.55;
}

.support-detail-grid button:focus-visible,
.support-lunch-card:focus-visible,
.support-accordion summary:focus-visible {
  outline: 3px solid rgba(177, 138, 80, .58);
  outline-offset: 2px;
}

@media (min-width: 480px) {
  .support-scene-gallery {
    grid-auto-columns: 54%;
  }

  .support-detail-grid {
    grid-template-columns: repeat(3, minmax(0, 1fr));
  }

  .support-detail-grid button {
    min-height: 126px;
    padding-right: 18px;
  }

  .support-detail-grid button::after {
    right: 11px;
    top: auto;
    bottom: 9px;
    transform: none;
  }
}

.content-section {
  position: relative;
  padding: 46px 26px 50px;
  border-top: 1px solid rgba(139, 113, 72, .18);
  background:
    linear-gradient(rgba(255, 250, 240, .78), rgba(255, 250, 240, .9)),
    url("assets/images/review-hero-bg.jpg") center top / cover no-repeat;
}

#school {
  padding: 0;
}

.school-screen,
.school-details {
  padding: 46px 26px 50px;
}

.school-screen {
  height: 100svh;
  min-height: 100svh;
  display: flex;
  flex-direction: column;
  padding: 150px 26px 50px;
  overflow: hidden;
}

.school-guide-button {
  position: absolute;
  right: 52px;
  top: 88px;
  z-index: 10;
}

.integrated-project-section {
  height: auto;
  min-height: 0;
  overflow: visible;
  padding: 78px 24px 46px;
}

.integrated-project-content {
  display: flex;
  height: auto;
  min-height: 0;
  flex-direction: column;
}

.integrated-project-content h2 span {
  display: block;
  white-space: nowrap;
}

.integrated-project-content .section-lead {
  max-width: 430px;
  margin: 8px 0 10px;
  font-size: 13px;
  line-height: 1.5;
}

.integrated-project-section > .auto-image-wall,
.integrated-project-section > .auto-video-wall {
  display: none !important;
}

.project-accordion {
  display: grid;
  gap: 5px;
  min-height: 0;
}

.project-accordion-item {
  border: 1px solid rgba(139, 113, 72, .22);
  background: rgba(255, 250, 240, .7);
  box-shadow: 0 5px 13px rgba(46, 55, 46, .06);
}

.project-accordion-toggle {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: 44px;
  padding: 6px 12px;
  border: 0;
  color: var(--ink-deep);
  background: transparent;
  text-align: left;
}

.project-accordion-toggle > span {
  display: grid;
  grid-template-columns: 22px auto 1fr;
  align-items: baseline;
  width: 100%;
  min-width: 0;
  column-gap: 7px;
}

.project-accordion-toggle b {
  color: var(--gold-dark);
  font: 700 10px/1 Georgia, serif;
}

.project-accordion-toggle strong {
  font-size: 15px;
  white-space: nowrap;
}

.project-accordion-toggle small {
  overflow: hidden;
  color: #69736d;
  font-size: 10px;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-accordion-toggle i {
  position: relative;
  flex: 0 0 18px;
  width: 18px;
  height: 18px;
  margin-left: 8px;
}

.project-accordion-toggle i::before,
.project-accordion-toggle i::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 8px;
  width: 10px;
  height: 1px;
  background: var(--ink);
  transition: transform .28s ease;
}

.project-accordion-toggle i::after {
  transform: rotate(90deg);
}

.project-accordion-item.is-open {
  border-color: rgba(139, 113, 72, .38);
  background: rgba(255, 250, 240, .88);
}

.project-accordion-item.is-open .project-accordion-toggle i::after {
  transform: rotate(0deg);
}

.project-accordion-panel {
  display: grid;
  grid-template-rows: 0fr;
  transition: grid-template-rows .32s ease;
}

.project-accordion-item.is-open .project-accordion-panel {
  grid-template-rows: 1fr;
}

.project-accordion-panel-inner {
  min-height: 0;
  overflow: hidden;
  padding: 0 12px;
  color: #4a5d56;
}

.project-accordion-item.is-open .project-accordion-panel-inner {
  padding-bottom: 10px;
}

.project-accordion-panel p {
  margin: 0;
  font-size: 11px;
  line-height: 1.55;
}

.project-accordion-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 4px;
  margin-top: 7px;
}

.project-accordion-tags span {
  padding: 3px 6px;
  border: 1px solid rgba(36, 76, 69, .14);
  color: var(--ink-deep);
  background: rgba(230, 235, 222, .5);
  font-size: 9px;
}

.project-route-tabs {
  display: grid;
  grid-template-columns: 1fr 1fr;
  gap: 5px;
  margin-bottom: 7px;
}

.project-route-tabs button {
  min-height: 28px;
  border: 1px solid rgba(36, 76, 69, .18);
  border-radius: 3px;
  color: #53665f;
  background: rgba(255, 250, 240, .65);
  font-size: 10px;
  font-weight: 800;
}

.project-route-tabs button.is-active {
  color: #fffaf0;
  background: var(--ink);
}

.project-route-panel strong {
  display: block;
  margin-bottom: 3px;
  color: var(--ink-deep);
  font-size: 12px;
}

.project-route-note,
.project-policy-note {
  margin-top: 5px !important;
  color: #7a7162;
  font-size: 9px !important;
}

.project-overseas-cert {
  display: grid;
  grid-template-columns: minmax(0, 1fr) 66px;
  gap: 9px;
  align-items: center;
}

.project-cert-thumb {
  position: relative;
  width: 66px;
  height: 82px;
  overflow: hidden;
  padding: 3px;
  border: 1px solid rgba(139, 113, 72, .28);
  border-radius: 2px;
  background: #fffaf0;
  box-shadow: 0 5px 12px rgba(46, 55, 46, .12);
}

.project-cert-thumb img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top;
}

.project-cert-thumb span {
  position: absolute;
  inset: auto 3px 3px;
  padding: 3px 1px;
  color: #fffaf0;
  background: rgba(22, 56, 49, .82);
  font-size: 8px;
  text-align: center;
}

.project-path-summary {
  margin-top: auto;
  padding: 9px 10px 7px;
  border-top: 1px solid rgba(139, 113, 72, .2);
  text-align: center;
}

.project-path-summary strong {
  display: block;
  color: var(--ink-deep);
  font-size: 12px;
}

.project-path-summary p {
  margin: 4px 0 0;
  color: #66736d;
  font-size: 9px;
  line-height: 1.4;
}

.project-assessment-button {
  display: flex;
  align-items: center;
  justify-content: center;
  gap: 16px;
  width: 100%;
  min-height: 44px;
  margin-top: 5px;
  border: 0;
  color: var(--ink-deep);
  background: url("assets/images/reserve-button-frame.png") center / 100% 100% no-repeat;
  font-size: 14px;
  font-weight: 800;
}

.project-assessment-button span {
  font-size: 22px;
  line-height: 1;
}

/* Third screen: decision-first project presentation. */
.integrated-project-content .eyebrow {
  margin-bottom: 4px;
}

.integrated-project-content h2 {
  font-size: 25px;
  line-height: 1.22;
}

.integrated-project-content .section-lead {
  margin: 5px 0 9px;
  font-size: 12px;
  line-height: 1.45;
}

.project-feature-grid {
  display: grid;
  grid-template-columns: minmax(0, .86fr) minmax(0, 1.42fr);
  gap: 9px;
  min-height: 232px;
  margin-bottom: 8px;
}

.project-interview-card {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  overflow: hidden;
  border: 7px solid transparent;
  border-image: url("assets/images/reserve-button-frame.png") 90 110 fill / 7px / 0 stretch;
  color: var(--ink-deep);
  background: rgba(255, 250, 240, .78);
  box-shadow: 0 9px 18px rgba(47, 43, 33, .12);
}

.project-interview-poster {
  position: relative;
  display: grid;
  flex: 1 1 auto;
  min-height: 148px;
  place-items: center;
  overflow: hidden;
  background:
    linear-gradient(rgba(20, 51, 45, .12), rgba(14, 42, 36, .48)),
    url("assets/content/classroom.jpg") center / cover no-repeat;
}

.project-interview-poster .video-play {
  position: relative;
  left: auto;
  top: auto;
  width: 44px;
  height: 44px;
  border: 1px solid rgba(255, 250, 240, .6);
  background: rgba(255, 250, 240, .88);
  box-shadow: 0 8px 20px rgba(20, 40, 35, .2);
  transform: none;
}

.project-interview-poster .video-play::before {
  left: 18px;
  top: 13px;
  width: 13px;
  height: 18px;
  background: var(--ink);
}

.project-interview-poster > span {
  position: absolute;
  inset: auto 6px 6px;
  padding: 4px 5px;
  color: #fffaf0;
  background: rgba(21, 55, 48, .82);
  font-size: 8px;
  text-align: center;
}

.project-interview-copy {
  padding: 6px 3px 2px;
}

.project-interview-copy small,
.project-mini-heading small,
.project-timeline-heading small {
  display: block;
  color: var(--gold-dark);
  font-size: 8px;
  font-weight: 800;
}

.project-interview-copy strong {
  display: block;
  margin-top: 2px;
  font-size: 11px;
  line-height: 1.35;
}

.project-interview-copy p {
  margin: 3px 0 0;
  color: #68736d;
  font-size: 7px;
  line-height: 1.35;
}

.project-route-showcase {
  display: flex;
  min-width: 0;
  flex-direction: column;
}

.project-mini-heading {
  display: flex;
  align-items: end;
  justify-content: space-between;
  gap: 6px;
  margin: 1px 1px 5px;
}

.project-mini-heading strong,
.project-timeline-heading strong {
  display: block;
  color: var(--ink-deep);
  font-size: 13px;
  line-height: 1.25;
}

.project-mini-heading > span {
  color: #6c746d;
  font-size: 7px;
  white-space: nowrap;
}

.project-route-posters {
  display: grid;
  flex: 1 1 auto;
  grid-template-columns: 1fr 1fr;
  gap: 7px;
}

.project-route-poster {
  position: relative;
  display: flex;
  min-width: 0;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-end;
  overflow: hidden;
  padding: 11px 9px 9px;
  border: 7px solid transparent;
  border-image: url("assets/images/reserve-button-frame.png") 90 110 fill / 7px / 0 stretch;
  color: #fffaf0;
  text-align: left;
  box-shadow: 0 9px 18px rgba(47, 43, 33, .12);
  isolation: isolate;
}

.project-route-poster::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background-position: center;
  background-size: cover;
  filter: saturate(.78);
  transform: scale(1.02);
}

.project-route-poster::after {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: linear-gradient(180deg, rgba(19, 49, 42, .08) 8%, rgba(15, 49, 42, .82) 88%);
}

.project-route-poster.route-a::before {
  background-image: url("assets/content/campus-gate.jpg");
}

.project-route-poster.route-b::before {
  background-image: url("assets/content/art-building.jpg");
}

.project-route-poster .project-route-kicker {
  position: absolute;
  left: 8px;
  top: 8px;
  padding: 3px 5px;
  color: var(--ink-deep);
  background: rgba(255, 250, 240, .82);
  font-size: 7px;
  font-weight: 800;
}

.project-route-poster strong {
  font: 700 21px/1 Georgia, serif;
}

.project-route-poster b {
  margin-top: 3px;
  font-size: 12px;
}

.project-route-poster small {
  margin-top: 3px;
  font-size: 7px;
  line-height: 1.3;
}

.project-accordion {
  gap: 4px;
}

.project-accordion-toggle {
  min-height: 37px;
  padding: 4px 10px;
}

.project-accordion-toggle > span {
  grid-template-columns: 20px 66px 1fr;
  column-gap: 5px;
}

.project-accordion-toggle strong {
  font-size: 13px;
}

.project-accordion-toggle small {
  font-size: 9px;
}

.project-accordion-item.is-open .project-accordion-panel-inner {
  padding-bottom: 7px;
}

.project-accordion-panel p {
  font-size: 10px;
  line-height: 1.45;
}

.project-accordion-tags {
  margin-top: 5px;
}

.project-support-timeline {
  display: grid;
  grid-template-columns: 104px minmax(0, 1fr);
  gap: 10px;
  align-items: center;
  margin-top: 8px;
  padding: 12px 0;
  border-top: 1px solid rgba(139, 113, 72, .25);
  border-bottom: 1px solid rgba(139, 113, 72, .2);
}

.project-support-timeline ol {
  position: relative;
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 2px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.project-support-timeline ol::before {
  content: "";
  position: absolute;
  left: 8%;
  right: 8%;
  top: 9px;
  height: 1px;
  background: linear-gradient(90deg, rgba(151, 117, 69, .3), rgba(36, 76, 69, .72), rgba(151, 117, 69, .3));
}

.project-support-timeline li {
  position: relative;
  min-width: 0;
  text-align: center;
}

.project-support-timeline li b {
  position: relative;
  z-index: 1;
  display: grid;
  width: 19px;
  height: 19px;
  margin: 0 auto 4px;
  place-items: center;
  border: 2px solid rgba(255, 250, 240, .9);
  border-radius: 50%;
  color: #fffaf0;
  background: var(--ink);
  box-shadow: 0 0 0 1px rgba(139, 113, 72, .36);
  font: 700 6px/1 Georgia, serif;
}

.project-support-timeline li span,
.project-support-timeline li small {
  display: block;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-support-timeline li span {
  color: var(--ink-deep);
  font-size: 8px;
  font-weight: 800;
}

.project-support-timeline li small {
  margin-top: 2px;
  color: #73776e;
  font-size: 6px;
}

.project-assessment-button {
  min-height: 42px;
  margin-top: auto;
}

.project-assessment-note {
  margin: 2px 0 0;
  color: #71776f;
  font-size: 8px;
  line-height: 1.2;
  text-align: center;
}

.project-route-backdrop {
  z-index: 28;
  align-items: end;
  padding: 16px;
  background: rgba(16, 39, 34, .48);
}

.project-route-drawer {
  position: relative;
  width: min(100%, 480px);
  max-height: min(78svh, 680px);
  overflow: auto;
  padding: 38px 28px 26px;
  border: 14px solid transparent;
  border-image: url("assets/images/reserve-button-frame.png") 90 110 fill / 14px / 0 stretch;
  color: var(--ink-deep);
  background:
    linear-gradient(rgba(255, 250, 240, .94), rgba(255, 250, 240, .96)),
    url("assets/images/review-hero-bg.jpg") center / cover no-repeat;
  box-shadow: 0 -18px 50px rgba(10, 30, 25, .28);
}

.project-route-detail .eyebrow {
  margin: 0 0 5px;
}

.project-route-detail h2 {
  margin: 0;
  font-size: 27px;
  line-height: 1.2;
}

.project-route-detail-lead {
  margin: 12px 0 14px;
  color: #4d6059;
  font-size: 13px;
  line-height: 1.7;
}

.project-route-detail h3 {
  margin: 0 0 8px;
  font-size: 15px;
}

.project-route-fit {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
}

.project-route-fit span {
  padding: 6px 9px;
  border: 1px solid rgba(36, 76, 69, .16);
  color: var(--ink-deep);
  background: rgba(230, 235, 222, .5);
  font-size: 11px;
}

.project-route-flow {
  display: grid;
  grid-template-columns: 1fr auto 1fr auto 1fr;
  gap: 5px;
  align-items: center;
  margin-top: 18px;
  padding: 12px 10px;
  border-top: 1px solid rgba(139, 113, 72, .25);
  border-bottom: 1px solid rgba(139, 113, 72, .2);
  text-align: center;
}

.project-route-flow span {
  font-size: 11px;
  font-weight: 800;
}

.project-route-flow i {
  color: var(--gold-dark);
  font-style: normal;
}

.project-route-disclaimer {
  margin: 14px 0 0;
  color: #7a7162;
  font-size: 9px;
  line-height: 1.5;
}

.school-screen .section-lead {
  margin: 12px 0 14px;
  font-size: 15px;
  line-height: 1.6;
}

.school-title span {
  display: block;
  white-space: nowrap;
}

.school-screen .school-fact-strip {
  margin-top: 10px;
}

.school-fact-strip {
  position: relative;
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  margin: 12px 0 14px;
  padding: 8px 11px;
  border: 0;
  background:
    linear-gradient(rgba(255, 250, 240, .82), rgba(250, 243, 230, .76));
  box-shadow: 0 12px 24px rgba(61, 54, 39, .1);
  isolation: isolate;
}

.school-fact-strip::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: -1;
  background: url("assets/images/reserve-button-frame.png") center / 100% 100% no-repeat;
  opacity: .82;
  pointer-events: none;
}

.school-fact-strip button {
  position: relative;
  min-width: 0;
  min-height: 78px;
  padding: 10px 5px 8px;
  border: 0;
  color: inherit;
  background: transparent;
  text-align: center;
  cursor: pointer;
}

.school-fact-strip button + button {
  border-left: 1px solid rgba(139, 113, 72, .34);
}

.school-fact-strip button + button::before {
  content: "◇";
  position: absolute;
  left: -7px;
  top: 50%;
  width: 13px;
  color: rgba(177, 138, 80, .88);
  background: #fbf5e9;
  font: 700 12px/1 serif;
  text-align: center;
  transform: translateY(-50%);
}

.school-fact-strip strong {
  display: block;
  color: var(--ink);
  font-size: 20px;
  line-height: 1.15;
  white-space: nowrap;
}

.school-fact-strip strong::after {
  content: "";
  display: block;
  width: 52px;
  height: 9px;
  margin: 9px auto 0;
  background:
    radial-gradient(circle at center, rgba(177, 138, 80, .72) 0 2px, transparent 2.5px),
    linear-gradient(90deg, transparent, rgba(177, 138, 80, .5) 24%, rgba(177, 138, 80, .5) 76%, transparent) center / 100% 1px no-repeat;
}

.school-fact-strip span {
  display: block;
  margin-top: 5px;
  color: #5b625a;
  font-size: 10px;
  line-height: 1.4;
}

.school-fact-strip button:active {
  background: rgba(177, 138, 80, .08);
}

#school .school-gallery {
  flex: 1 1 220px;
  min-height: 96px;
  max-height: 300px;
  grid-template-rows: minmax(0, 1fr);
  grid-auto-columns: 72%;
  margin-top: 12px;
  margin-right: 0;
  margin-bottom: 5px;
  margin-left: 0;
  padding-right: 0;
  padding-bottom: 12px;
  padding-left: 0;
}

.school-media-heading {
  display: flex;
  align-items: baseline;
  justify-content: space-between;
  gap: 12px;
  margin-top: 18px;
}

.school-media-heading strong {
  color: var(--ink-deep);
  font-size: 16px;
}

.school-media-heading span {
  color: #68736d;
  font-size: 10px;
}

.school-video-card {
  position: relative;
  display: block;
  width: 100%;
  aspect-ratio: 4 / 3;
  overflow: hidden;
  padding: 12px;
  border: 0;
  border-radius: 3px;
  background: rgba(250, 244, 232, .96);
  box-shadow: 0 14px 28px rgba(47, 43, 33, .18);
  scroll-snap-align: start;
  isolation: isolate;
}

.school-video-card::before,
.school-video-card::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.school-video-card::before {
  z-index: 3;
  box-sizing: border-box;
  border: 10px solid transparent;
  border-image: url("assets/images/reserve-button-frame.png") 90 110 / 10px / 0 stretch;
  opacity: .88;
}

.school-video-card::after {
  content: none;
}

.school-video-feature {
  width: 100%;
  aspect-ratio: auto;
  margin-top: 6px;
}

#school .school-video-card > video {
  position: relative;
  z-index: 0;
  display: block;
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: 2px;
  object-fit: contain;
  background: #0b100e;
}

.school-video-inline-play {
  position: absolute;
  z-index: 4;
  inset: 12px;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.school-video-card.is-playing .school-video-inline-play {
  display: none;
}

.school-video-card .video-play {
  z-index: 4;
  position: absolute;
  left: 50%;
  top: 44%;
  width: 66px;
  height: 66px;
  border: 1px solid rgba(139, 113, 72, .2);
  background: rgba(255, 250, 240, .92);
  box-shadow: 0 12px 25px rgba(52, 48, 38, .22), 0 0 0 7px rgba(255, 250, 240, .12);
  transform: translate(-50%, -50%);
}

.school-video-card .video-play::before {
  left: 27px;
  top: 20px;
  width: 19px;
  height: 25px;
  background: #53685b;
}

.school-video-fullscreen-button {
  position: absolute;
  z-index: 5;
  right: 18px;
  bottom: 18px;
  min-height: 44px;
  padding: 0 14px;
  border: 1px solid rgba(255, 250, 240, .5);
  border-radius: 3px;
  color: #fffaf0;
  background: rgba(18, 38, 34, .82);
  box-shadow: 0 8px 20px rgba(10, 20, 18, .22);
  font-size: 13px;
  font-weight: 700;
  letter-spacing: 0;
}

.school-video-fullscreen-button span {
  margin-right: 4px;
  font-size: 18px;
}

.school-photo-frame {
  position: relative;
  box-sizing: border-box;
  height: 100%;
  min-width: 0;
  overflow: hidden;
  margin: 0;
  padding: 9px;
  border: 10px solid transparent;
  border-image: url("assets/images/reserve-button-frame.png") 90 110 fill / 10px / 0 stretch;
  border-radius: 3px;
  background: rgba(250, 244, 232, .94);
  box-shadow: 0 12px 24px rgba(47, 43, 33, .17);
  scroll-snap-align: center;
  isolation: isolate;
}

.school-photo-frame::after {
  content: none;
}

#school .school-gallery .school-photo-frame > img {
  cursor: zoom-in;
}

#school .school-gallery .school-photo-frame > img {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  border: 1px solid rgba(139, 113, 72, .2);
  border-radius: 1px;
  object-fit: cover;
  box-shadow: inset 0 0 16px rgba(36, 51, 47, .08);
  transform: none;
}

.school-screen .image-caption {
  flex: 0 0 auto;
  margin: 0;
  text-align: center;
}

.school-details {
  border-top: 1px solid rgba(139, 113, 72, .18);
  background: rgba(255, 250, 240, .28);
}

.school-detail-backdrop {
  z-index: 23;
}

.school-detail-modal {
  position: relative;
  width: min(100%, 430px);
  max-height: calc(100svh - 36px);
  overflow: auto;
  padding: 42px 26px 28px;
  border: 16px solid transparent;
  border-image: url("assets/images/reserve-button-frame.png") 90 110 fill / 16px / 0 round;
  color: var(--ink-deep);
  background:
    linear-gradient(rgba(255, 250, 240, .9), rgba(255, 250, 240, .94)),
    url("assets/images/review-hero-bg.jpg") center / cover no-repeat;
  box-shadow: 0 28px 82px rgba(10, 20, 18, .34);
}

.school-detail-tabs {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 5px;
  margin-bottom: 24px;
}

.school-detail-tabs button {
  min-height: 36px;
  padding: 5px 2px;
  border: 1px solid rgba(36, 76, 69, .2);
  border-radius: 4px;
  color: #49615a;
  background: rgba(255, 250, 240, .62);
  font-size: 10px;
  font-weight: 700;
}

.school-detail-tabs button.is-active {
  color: #fffaf0;
  background: var(--ink);
}

.school-detail-modal h2 {
  margin: 6px 0 16px;
  font-size: 26px;
  line-height: 1.25;
}

.school-detail-copy p {
  margin: 0 0 12px;
  color: #41564f;
  font-size: 15px;
  line-height: 1.8;
}

.project-cert-backdrop {
  z-index: 26;
  padding: 18px;
}

.project-cert-modal {
  position: relative;
  width: min(100%, 420px);
  max-height: calc(100svh - 36px);
  margin: 0;
  overflow: auto;
  padding: 14px 14px 12px;
  border: 12px solid transparent;
  border-image: url("assets/images/reserve-button-frame.png") 90 110 fill / 12px / 0 round;
  background: rgba(255, 250, 240, .96);
  box-shadow: 0 28px 82px rgba(10, 20, 18, .38);
}

.project-cert-modal img {
  display: block;
  width: 100%;
  height: auto;
  max-height: calc(100svh - 115px);
  object-fit: contain;
  background: #eef6f8;
}

.project-cert-modal figcaption {
  margin-top: 8px;
  color: #59675f;
  font-size: 10px;
  line-height: 1.5;
  text-align: center;
}

.school-video-fullscreen-stage {
  position: fixed;
  z-index: 60;
  inset: 0;
  overflow: hidden;
  background: #080d0b;
}

.school-video-landscape-shell {
  position: absolute;
  inset: 0;
  overflow: hidden;
  background: #080d0b;
}

.school-video-fullscreen-slot,
.school-video-fullscreen-slot > video {
  width: 100%;
  height: 100%;
}

.school-video-fullscreen-slot > video {
  display: block;
  border: 0;
  background: #080d0b;
  object-fit: contain;
}

.school-video-return-button {
  position: absolute;
  z-index: 2;
  top: max(18px, env(safe-area-inset-top));
  left: max(18px, env(safe-area-inset-left));
  min-height: 44px;
  padding: 0 16px;
  border: 1px solid rgba(255, 255, 255, .36);
  border-radius: 3px;
  color: #fff;
  background: rgba(8, 13, 11, .72);
  font-size: 14px;
  font-weight: 700;
  letter-spacing: 0;
  backdrop-filter: blur(5px);
}

@media (orientation: portrait) {
  .school-video-landscape-shell {
    inset: auto;
    left: 50%;
    top: 50%;
    width: 100vh;
    height: 100vw;
    transform: translate(-50%, -50%) rotate(90deg);
  }
}

.content-section:nth-of-type(odd) {
  background:
    linear-gradient(rgba(255, 250, 240, .78), rgba(255, 250, 240, .9)),
    url("assets/images/review-hero-bg.jpg") center top / cover no-repeat;
}

.content-section .eyebrow {
  margin: 0 0 10px;
  color: var(--gold-dark);
  font-size: 13px;
  font-weight: 800;
}

.content-section h2 {
  margin: 0;
  color: var(--ink-deep);
  font-size: 28px;
  line-height: 1.22;
  font-weight: 900;
}

.section-lead {
  margin: 14px 0 22px;
  color: #42554f;
  font-size: 16px;
  line-height: 1.75;
}

.stat-grid,
.feature-list,
.problem-grid,
.major-grid,
.support-grid,
.route-grid,
.special-row,
.video-grid,
.apply-flow {
  display: grid;
  gap: 12px;
}

.stat-grid {
  grid-template-columns: repeat(3, 1fr);
  margin: 20px 0 22px;
}

.stat-grid article,
.feature-list article,
.problem-grid article,
.major-grid article,
.support-grid article,
.route-card,
.cert-box,
.special-row article,
.video-card,
.feature-video,
.apply-flow article,
.final-cta {
  position: relative;
  border: 1px solid rgba(139, 113, 72, .23);
  border-radius: var(--radius);
  background: rgba(255, 250, 240, .72);
  box-shadow: 0 12px 28px rgba(44, 35, 22, .08);
}

.stat-grid article {
  min-height: 88px;
  padding: 13px 8px;
  text-align: center;
}

.stat-grid strong {
  display: block;
  color: var(--ink);
  font-size: 25px;
  line-height: 1;
}

.stat-grid span {
  display: block;
  margin-top: 8px;
  color: #5d675f;
  font-size: 11px;
  line-height: 1.45;
}

.image-wall,
.offer-wall {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 58%;
  gap: 14px;
  margin: 20px -26px 16px;
  padding: 0 26px 18px;
  overflow-x: auto;
  overflow-y: visible;
  scroll-snap-type: x proximity;
  -webkit-overflow-scrolling: touch;
}

.image-wall::-webkit-scrollbar,
.offer-wall::-webkit-scrollbar {
  height: 7px;
}

.image-wall::-webkit-scrollbar-track,
.offer-wall::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(36, 76, 69, .08);
}

.image-wall::-webkit-scrollbar-thumb,
.offer-wall::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(36, 76, 69, .42);
}

.image-wall,
.offer-wall {
  scrollbar-width: thin;
  scrollbar-color: rgba(36, 76, 69, .42) rgba(36, 76, 69, .08);
}

.image-wall img,
.offer-wall img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  border: 8px solid rgba(255, 250, 240, .86);
  border-radius: 6px;
  background: #fffaf0;
  box-shadow: 0 16px 30px rgba(36, 51, 47, .14);
  scroll-snap-align: center;
  transform: rotate(-1.5deg);
}

.image-wall img:nth-child(2n),
.offer-wall img:nth-child(2n) {
  transform: rotate(1.4deg) translateY(8px);
}

.image-wall img:nth-child(3n),
.offer-wall img:nth-child(3n) {
  transform: rotate(-0.6deg) translateY(-4px);
}

.offer-wall.offer-showcase {
  display: grid;
  grid-auto-flow: initial;
  grid-auto-columns: initial;
  gap: 2px;
  margin: 11px -26px 9px;
  padding: 11px 0 13px;
  overflow: hidden;
  scroll-snap-type: none;
  scrollbar-width: none;
  border-top: 1px solid rgba(174, 127, 67, .22);
  border-bottom: 1px solid rgba(174, 127, 67, .22);
  background:
    linear-gradient(90deg, rgba(248, 241, 224, .2), rgba(255, 253, 247, .74) 50%, rgba(248, 241, 224, .2)),
    repeating-linear-gradient(0deg, transparent 0 21px, rgba(113, 87, 46, .025) 21px 22px);
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 7%, #000 93%, transparent);
}

.offer-showcase::-webkit-scrollbar,
.offer-lane::-webkit-scrollbar {
  display: none;
}

.offer-lane {
  width: 100%;
  padding: 5px 0 10px;
  overflow-x: auto;
  overflow-y: hidden;
  scrollbar-width: none;
  touch-action: pan-x pan-y;
  -webkit-overflow-scrolling: touch;
}

#results .offer-lane {
  padding: 4px 0 8px;
  scroll-snap-type: x proximity;
}

#results .offer-lane + .offer-lane {
  margin-top: -5px;
}

#results .offer-sequence {
  gap: 8px;
  padding: 0 28px;
}

#results .offer-lane-2 .offer-sequence {
  padding-left: 52px;
}

#results .offer-sequence .offer-card {
  position: relative;
  flex-basis: 82px;
  width: 82px;
  margin-left: 0;
  border: 1px solid rgba(119, 83, 43, .18);
  border-radius: 4px;
  box-shadow: 0 8px 15px rgba(39, 48, 43, .15);
  scroll-snap-align: start;
  transform: rotate(-2deg) translateY(2px);
}

#results .offer-sequence .offer-card:first-child {
  margin-left: 0;
}

#results .offer-sequence .offer-card:nth-child(2n) {
  transform: rotate(1.6deg) translateY(-1px);
}

#results .offer-sequence .offer-card:nth-child(3n) {
  transform: rotate(-.5deg) translateY(3px);
}

#results .offer-sequence .offer-card:hover,
#results .offer-sequence .offer-card:focus-visible {
  z-index: 2;
  transform: translateY(-5px) rotate(0);
}

.offer-track,
.offer-sequence {
  display: flex;
  width: max-content;
  align-items: center;
}

.offer-sequence {
  gap: 12px;
  padding-right: 12px;
}

.offer-card {
  flex: 0 0 136px;
  width: 136px;
  padding: 0;
  border: 0;
  border-radius: 6px;
  background: transparent;
  box-shadow: 0 14px 28px rgba(36, 51, 47, .16);
  cursor: pointer;
  transform: rotate(-1.2deg);
}

.offer-card:nth-child(2n) {
  transform: rotate(1deg) translateY(5px);
}

.offer-card:nth-child(3n) {
  transform: rotate(-.4deg) translateY(-3px);
}

.offer-showcase .offer-card img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  border: 4px solid rgba(255, 250, 240, .94);
  border-radius: 4px;
  object-fit: cover;
  object-position: top center;
  background: #fffaf0;
  box-shadow: none;
  transform: none;
}

.results-offer-section,
.results-video-section {
  margin-top: 18px;
}

.results-module-header {
  display: flex;
  align-items: flex-end;
  justify-content: space-between;
  gap: 14px;
}

.results-module-header small {
  display: block;
  margin-bottom: 3px;
  color: var(--gold-dark);
  font-size: 10px;
  font-weight: 800;
  letter-spacing: .14em;
}

.results-module-header h3 {
  margin: 0;
  color: var(--ink-deep);
  font-size: 18px;
  line-height: 1.3;
}

.results-module-header > span {
  flex: 0 0 auto;
  color: #728079;
  font-size: 10px;
  line-height: 1.4;
}

.results-offer-section .image-caption {
  margin: 5px 0 0;
  font-size: 11px;
}

.results-offer-interview {
  position: relative;
  display: grid;
  grid-template-columns: 84px minmax(0, 1fr) 36px;
  align-items: center;
  gap: 12px;
  min-height: 98px;
  margin-top: 10px;
  padding: 8px 10px 8px 8px;
  overflow: hidden;
  border: 1px solid rgba(157, 111, 52, .34);
  border-left: 4px solid rgba(33, 76, 67, .9);
  border-radius: 9px 9px 4px 4px;
  color: inherit;
  background:
    radial-gradient(circle at 88% 18%, rgba(194, 151, 83, .14) 0 34px, transparent 35px),
    linear-gradient(105deg, rgba(248, 239, 216, .98), rgba(255, 253, 247, .98)),
    var(--paper);
  box-shadow: 0 8px 20px rgba(47, 58, 51, .12);
  text-decoration: none;
}

.results-offer-interview::after {
  position: absolute;
  right: 12px;
  bottom: 7px;
  width: 80px;
  height: 1px;
  content: "";
  background: linear-gradient(90deg, transparent, rgba(157, 111, 52, .35));
}

.results-offer-interview + .offer-wall.offer-showcase {
  margin-top: -1px;
  border-top: 0;
  border-radius: 0 0 8px 8px;
}

.results-offer-interview-media {
  position: relative;
  display: block;
  height: 82px;
  overflow: hidden;
  border: 3px solid rgba(255, 252, 243, .98);
  border-radius: 5px;
  background: #ece5d6;
  box-shadow: 0 4px 10px rgba(49, 57, 51, .13);
}

.results-offer-interview-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.results-offer-interview-play {
  position: absolute;
  inset: 0;
  display: grid;
  place-items: center;
  background: linear-gradient(rgba(20, 42, 37, .02), rgba(20, 42, 37, .2));
}

.results-offer-interview-play .video-play {
  width: 28px;
  height: 28px;
  border: 1px solid rgba(255, 255, 255, .76);
  box-shadow: 0 4px 10px rgba(19, 44, 38, .22);
}

.results-offer-interview-media-label {
  position: absolute;
  left: 5px;
  bottom: 5px;
  padding: 2px 5px;
  border-radius: 999px;
  color: #fffaf0;
  background: rgba(29, 68, 60, .9);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .08em;
}

.results-offer-interview-copy {
  display: grid;
  min-width: 0;
  gap: 3px;
}

.results-offer-interview-copy small {
  color: var(--gold-dark);
  font-size: 9px;
  font-weight: 800;
  letter-spacing: .1em;
}

.results-offer-interview-copy strong {
  color: var(--ink-deep);
  font-size: 15px;
  line-height: 1.35;
}

.results-offer-interview-copy > span {
  color: #5e6b66;
  font-size: 10.5px;
  line-height: 1.5;
}

.results-offer-interview-seal {
  display: grid;
  width: 32px;
  height: 32px;
  place-items: center;
  border: 1px solid rgba(180, 139, 73, .65);
  border-radius: 50%;
  color: #fff9e8;
  background: var(--ink);
  box-shadow: 0 0 0 3px rgba(180, 139, 73, .12);
  font-family: "STKaiti", "KaiTi", serif;
  font-size: 15px;
  font-weight: 800;
  text-align: center;
}

.results-offer-interview:hover,
.results-offer-interview:focus-visible {
  border-color: rgba(101, 72, 35, .48);
  transform: translateY(-1px);
}

.results-offer-composite {
  position: relative;
  display: block;
  min-height: 232px;
  margin-top: 10px;
  overflow: hidden;
  border-radius: 9px;
  isolation: isolate;
}

.results-offer-composite::before {
  position: absolute;
  inset: 8px 0 8px 25%;
  z-index: 0;
  border: 1px solid rgba(157, 111, 52, .22);
  border-radius: 8px;
  content: "";
  background:
    radial-gradient(circle at 100% 0, rgba(36, 76, 69, .1), transparent 42%),
    linear-gradient(160deg, rgba(255, 253, 247, .97), rgba(245, 235, 210, .9));
}

.results-offer-composite .results-offer-interview {
  position: relative;
  z-index: 6;
  grid-template-columns: 1fr;
  align-content: start;
  gap: 7px;
  width: 56%;
  min-height: 232px;
  margin: 0;
  padding: 7px;
  border-left-width: 1px;
  border-radius: 8px;
  background:
    linear-gradient(155deg, rgba(248, 239, 216, .98), rgba(255, 253, 247, .98)),
    var(--paper);
  box-shadow: 8px 9px 22px rgba(36, 50, 43, .2);
}

.results-offer-composite .results-offer-interview::after {
  display: none;
}

.results-offer-composite .results-offer-interview-media {
  height: 124px;
}

.results-offer-composite .results-offer-interview-copy {
  gap: 3px;
  padding: 0 3px 3px;
}

.results-offer-composite .results-offer-interview-copy strong {
  font-size: 12px;
  line-height: 1.4;
}

.results-offer-composite .results-offer-interview-copy > span {
  font-size: 9px;
  line-height: 1.45;
}

.results-offer-stack {
  position: absolute;
  inset: 8px -5px 8px 28%;
  z-index: 1;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
  border: 0;
  border-radius: 8px;
  background: transparent;
  box-shadow: none;
}

.results-offer-stack-head {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  padding: 8px 10px 2px 108px;
}

.results-offer-stack-head small {
  color: var(--ink-deep);
  font-size: 9px;
  font-weight: 900;
  letter-spacing: .08em;
}

.results-offer-stack-head span {
  color: var(--gold-dark);
  font-size: 8px;
  white-space: nowrap;
}

.results-offer-stack .offer-wall.offer-showcase {
  display: block;
  height: 169px;
  margin: 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  -webkit-mask-image: linear-gradient(90deg, #000 0, #000 88%, transparent);
  mask-image: linear-gradient(90deg, #000 0, #000 88%, transparent);
}

#results .results-offer-stack .offer-lane {
  height: 169px;
  padding: 17px 0 10px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: none;
}

#results .results-offer-stack .offer-sequence {
  gap: 0;
  align-items: flex-end;
  padding: 2px 60px 9px 4px;
}

#results .results-offer-stack .offer-sequence .offer-card {
  z-index: 1;
  flex-basis: 94px;
  width: 94px;
  margin-left: -34px;
  box-shadow: -4px 6px 12px rgba(34, 47, 41, .18);
  scroll-snap-align: none;
  transform: rotate(8deg) translateY(8px);
  transform-origin: 50% 100%;
}

#results .results-offer-stack .offer-sequence .offer-card:first-child {
  margin-left: 0;
  transform: rotate(-9deg) translateY(11px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(2) {
  margin-left: -74px;
  transform: rotate(-6deg) translateY(7px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(3) {
  margin-left: -70px;
  transform: rotate(-3deg) translateY(4px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(4) {
  margin-left: -64px;
  transform: rotate(0) translateY(2px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(5) {
  margin-left: -56px;
  transform: rotate(3deg) translateY(3px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(6) {
  margin-left: -46px;
  transform: rotate(6deg) translateY(5px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(n + 7) {
  margin-left: -34px;
  transform: rotate(8deg) translateY(8px);
}

#results .results-offer-stack .offer-sequence .offer-card:hover,
#results .results-offer-stack .offer-sequence .offer-card:focus-visible {
  z-index: 12;
  transform: translateY(-4px) rotate(0);
}

.results-offer-stack-note {
  padding: 1px 10px 7px 112px;
  color: #6b756f;
  font-size: 8px;
  line-height: 1.3;
}

/* 第六屏：居中视频主卡 + 后置弧形 Offer 成果册 */
.results-offer-composite {
  min-height: 342px;
  overflow: hidden;
}

.results-offer-composite::before {
  inset: 166px 8px 8px;
  border-radius: 10px;
  background:
    radial-gradient(ellipse at 50% 100%, rgba(36, 76, 69, .1), transparent 58%),
    linear-gradient(165deg, rgba(255, 253, 247, .96), rgba(244, 233, 207, .92));
}

.results-offer-composite .results-offer-interview {
  z-index: 6;
  width: 78%;
  min-height: 238px;
  margin: 0 auto;
  padding: 8px;
  border-radius: 9px;
  box-shadow: 0 11px 25px rgba(36, 50, 43, .22);
}

.results-offer-composite .results-offer-interview-media {
  height: 146px;
}

.results-offer-composite .results-offer-interview-copy {
  padding: 1px 5px 4px;
}

.results-offer-composite .results-offer-interview-copy strong {
  font-size: 14px;
}

.results-offer-composite .results-offer-interview-copy > span {
  font-size: 10px;
}

.results-offer-stack {
  inset: 166px 0 8px;
  z-index: 1;
  display: block;
  overflow: hidden;
}

.results-offer-stack-head {
  position: absolute;
  right: 8px;
  bottom: 5px;
  z-index: 3;
  display: block;
  padding: 3px 7px;
  border: 1px solid rgba(157, 111, 52, .28);
  border-radius: 999px;
  background: rgba(255, 251, 240, .88);
}

.results-offer-stack-head small {
  display: none;
}

.results-offer-stack .offer-wall.offer-showcase {
  height: 176px;
  -webkit-mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
  mask-image: linear-gradient(90deg, transparent, #000 5%, #000 95%, transparent);
}

#results .results-offer-stack .offer-lane {
  height: 176px;
  padding: 12px 0 30px;
}

#results .results-offer-stack .offer-sequence {
  align-items: flex-start;
  padding: 5px 56px 28px 28px;
}

#results .results-offer-stack .offer-sequence .offer-card {
  flex-basis: 94px;
  width: 94px;
  margin-left: -58px;
  transform: rotate(10deg) translateY(14px);
  transform-origin: 50% 100%;
}

#results .results-offer-stack .offer-sequence .offer-card:first-child {
  margin-left: 0;
  transform: rotate(-11deg) translateY(15px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(2) {
  margin-left: -60px;
  transform: rotate(-7deg) translateY(9px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(3) {
  margin-left: -59px;
  transform: rotate(-4deg) translateY(4px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(4) {
  margin-left: -58px;
  transform: rotate(-1deg) translateY(1px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(5) {
  margin-left: -58px;
  transform: rotate(2deg) translateY(2px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(6) {
  margin-left: -57px;
  transform: rotate(5deg) translateY(5px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(7) {
  margin-left: -56px;
  transform: rotate(8deg) translateY(9px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(n + 8) {
  margin-left: -55px;
  transform: rotate(11deg) translateY(14px);
}

.results-offer-stack-note {
  position: absolute;
  left: 8px;
  bottom: 7px;
  z-index: 3;
  padding: 0;
}

/* 第六屏：曹文娜重点 Offer 斜叠于视频右侧 */
.results-offer-composite {
  min-height: 352px;
}

.results-offer-composite::before {
  inset: 168px 6px 8px;
}

.results-offer-composite .results-offer-interview {
  z-index: 12;
  width: 78%;
  min-height: 238px;
  margin: 0 auto;
}

.results-cao-offer-card {
  position: absolute;
  top: -6px;
  right: 1%;
  z-index: 4;
  display: block;
  width: 42%;
  padding: 5px;
  overflow: hidden;
  border: 1px solid rgba(135, 89, 37, .38);
  border-radius: 6px;
  color: inherit;
  background: #fff9ea;
  box-shadow: -10px 14px 28px rgba(35, 48, 42, .25);
  cursor: pointer;
  transform: rotate(6deg);
  transform-origin: 50% 100%;
}

.results-cao-offer-card img {
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  border-radius: 3px;
  object-fit: cover;
  object-position: top center;
}

.results-cao-offer-label {
  position: absolute;
  right: 9px;
  bottom: 9px;
  left: 9px;
  display: grid;
  gap: 1px;
  padding: 5px 6px;
  border: 1px solid rgba(231, 205, 150, .5);
  border-radius: 4px;
  color: #fff9e9;
  background: rgba(28, 67, 59, .9);
  text-align: left;
}

.results-cao-offer-label small {
  font-size: 7px;
  font-weight: 800;
  letter-spacing: .12em;
}

.results-cao-offer-label strong {
  font-size: 9px;
  line-height: 1.3;
}

.results-cao-offer-hint {
  position: absolute;
  top: 9px;
  right: 9px;
  padding: 2px 5px;
  border-radius: 999px;
  color: #fff9e9;
  background: rgba(28, 67, 59, .88);
  font-size: 7px;
  font-weight: 800;
}

.results-cao-offer-card:hover,
.results-cao-offer-card:focus-visible {
  z-index: 5;
  outline: 2px solid rgba(36, 76, 69, .52);
  outline-offset: 2px;
  transform: rotate(4deg);
}

.results-offer-stack {
  inset: 168px 0 8px;
}

.results-offer-stack .offer-wall.offer-showcase,
#results .results-offer-stack .offer-lane {
  height: 176px;
}

#results .results-offer-stack .offer-lane {
  padding-top: 13px;
}

#results .results-offer-stack .offer-sequence {
  padding: 5px 64px 30px 24px;
}

#results .results-offer-stack .offer-sequence .offer-card {
  flex-basis: 110px;
  width: 110px;
  margin-left: -64px;
}

#results .results-offer-stack .offer-sequence .offer-card:first-child {
  margin-left: 0;
  transform: rotate(-12deg) translateY(15px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(2) {
  margin-left: -64px;
  transform: rotate(-8deg) translateY(8px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(3) {
  margin-left: -64px;
  transform: rotate(-4deg) translateY(3px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(4) {
  margin-left: -64px;
  transform: rotate(0) translateY(0);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(5) {
  margin-left: -64px;
  transform: rotate(4deg) translateY(3px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(6) {
  margin-left: -64px;
  transform: rotate(8deg) translateY(8px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(7) {
  margin-left: -64px;
  transform: rotate(12deg) translateY(15px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(8) {
  margin-left: -64px;
  transform: rotate(-12deg) translateY(15px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(9) {
  margin-left: -64px;
  transform: rotate(-8deg) translateY(8px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(10) {
  margin-left: -64px;
  transform: rotate(-4deg) translateY(3px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(11) {
  margin-left: -64px;
  transform: rotate(0) translateY(0);
}

/* 第六屏：学生故事与录取成果清晰分层 */
.results-offer-composite {
  display: grid;
  grid-template-columns: minmax(0, 42%) minmax(0, 58%);
  grid-template-areas:
    "story story"
    "featured deck";
  gap: 10px;
  min-height: 0;
  overflow: visible;
}

.results-offer-composite::before {
  display: none;
}

.results-offer-composite .results-offer-interview {
  position: relative;
  grid-area: story;
  width: 82%;
  min-height: 238px;
  margin: 0 auto;
  z-index: 1;
  box-shadow: 0 10px 22px rgba(36, 50, 43, .16);
}

.results-cao-offer-card {
  position: relative;
  grid-area: featured;
  top: auto;
  right: auto;
  z-index: 1;
  width: 100%;
  align-self: stretch;
  margin: 0;
  transform: rotate(-1.5deg);
  box-shadow: 0 8px 18px rgba(35, 48, 42, .16);
}

.results-cao-offer-card:hover,
.results-cao-offer-card:focus-visible {
  z-index: 2;
  transform: rotate(0) translateY(-2px);
}

.results-offer-stack {
  position: relative;
  inset: auto;
  grid-area: deck;
  z-index: 1;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  min-height: 276px;
  overflow: hidden;
  border: 1px solid rgba(157, 111, 52, .26);
  border-radius: 8px;
  background:
    radial-gradient(circle at 100% 0, rgba(36, 76, 69, .08), transparent 44%),
    linear-gradient(160deg, rgba(255, 253, 247, .97), rgba(245, 235, 210, .9));
  box-shadow: 0 8px 18px rgba(47, 58, 51, .1);
}

.results-offer-stack-head {
  position: relative;
  right: auto;
  bottom: auto;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 5px;
  padding: 9px 9px 4px;
  border: 0;
  border-radius: 0;
  background: transparent;
}

.results-offer-stack-head small {
  display: block;
}

.results-offer-stack .offer-wall.offer-showcase,
#results .results-offer-stack .offer-lane {
  height: 210px;
}

#results .results-offer-stack .offer-lane {
  padding: 10px 0 22px;
}

#results .results-offer-stack .offer-sequence {
  align-items: center;
  padding: 4px 52px 18px 17px;
}

#results .results-offer-stack .offer-sequence .offer-card,
#results .results-offer-stack .offer-sequence .offer-card:nth-child(n) {
  flex-basis: 108px;
  width: 108px;
  margin-left: -66px;
  transform: rotate(2deg) translateY(4px);
}

#results .results-offer-stack .offer-sequence .offer-card:first-child {
  margin-left: 0;
  transform: rotate(-3deg) translateY(2px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(3n) {
  transform: rotate(-1deg) translateY(6px);
}

.results-offer-stack-note {
  position: relative;
  left: auto;
  bottom: auto;
  z-index: 2;
  padding: 0 9px 8px;
}

/* 第六屏：曹文娜故事主卡 + 成果回执 + 横滑录取册 */
.results-offer-composite {
  display: flex;
  flex-direction: column;
  gap: 0;
  min-height: 0;
  padding: 10px 10px 12px;
  overflow: hidden;
  border: 1px solid rgba(146, 103, 48, .26);
  border-radius: 10px;
  background:
    linear-gradient(rgba(255, 252, 244, .9), rgba(247, 239, 220, .92)),
    var(--paper);
  box-shadow: 0 10px 24px rgba(45, 55, 48, .1);
}

.results-offer-composite::before {
  display: none;
}

.results-offer-composite .results-offer-interview {
  order: 1;
  position: relative;
  width: 100%;
  min-height: 0;
  margin: 0;
  padding: 7px 7px 25px;
  overflow: hidden;
  border: 1px solid rgba(151, 105, 46, .32);
  border-radius: 8px;
  background: #fffaf0;
  box-shadow: 0 9px 20px rgba(35, 48, 42, .16);
  transform: none;
}

.results-offer-composite .results-offer-interview:hover,
.results-offer-composite .results-offer-interview:focus-visible {
  transform: translateY(-1px);
}

.results-offer-composite .results-offer-interview-media {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  border-radius: 5px;
}

.results-offer-composite .results-offer-interview-copy {
  display: grid;
  gap: 2px;
  padding: 10px 7px 0;
}

.results-offer-composite .results-offer-interview-copy strong {
  font-size: 15px;
  line-height: 1.35;
}

.results-offer-composite .results-offer-interview-copy > span {
  font-size: 10px;
  line-height: 1.45;
}

.results-cao-offer-card {
  order: 2;
  position: relative;
  top: auto;
  right: auto;
  z-index: 3;
  display: grid;
  grid-template-columns: 72px minmax(0, 1fr) auto;
  align-items: center;
  gap: 10px;
  width: calc(100% - 32px);
  min-height: 92px;
  margin: -18px auto 14px;
  padding: 6px 8px 6px 6px;
  overflow: visible;
  border: 1px solid rgba(137, 90, 35, .38);
  border-radius: 7px;
  color: var(--ink-deep);
  background:
    linear-gradient(100deg, rgba(255, 252, 242, .99), rgba(242, 228, 196, .97));
  box-shadow: 0 9px 19px rgba(35, 48, 42, .18);
  transform: none;
}

.results-cao-offer-card::before {
  position: absolute;
  top: 9px;
  bottom: 9px;
  left: 86px;
  width: 1px;
  content: "";
  background: linear-gradient(rgba(171, 126, 65, .08), rgba(171, 126, 65, .5), rgba(171, 126, 65, .08));
}

.results-cao-offer-card img {
  position: static;
  display: block;
  width: 72px;
  height: 80px;
  aspect-ratio: auto;
  border: 1px solid rgba(129, 78, 31, .18);
  border-radius: 3px;
  object-fit: cover;
  object-position: top center;
  box-shadow: 0 4px 10px rgba(50, 43, 31, .16);
}

.results-cao-offer-label {
  position: static;
  display: grid;
  gap: 4px;
  min-width: 0;
  padding: 0 0 0 8px;
  border: 0;
  border-radius: 0;
  color: var(--ink-deep);
  background: transparent;
}

.results-cao-offer-label small {
  color: var(--gold-dark);
  font-size: 8px;
  letter-spacing: .16em;
}

.results-cao-offer-label strong {
  font-size: 11px;
  line-height: 1.45;
}

.results-cao-offer-hint {
  position: static;
  display: grid;
  place-items: center;
  width: 40px;
  height: 40px;
  padding: 0;
  border: 1px solid rgba(213, 178, 114, .55);
  border-radius: 50%;
  color: #fff9e9;
  background: var(--ink-deep);
  font-size: 0;
}

.results-cao-offer-hint::before {
  content: "↗";
  font-size: 16px;
  line-height: 1;
}

.results-cao-offer-card:hover,
.results-cao-offer-card:focus-visible {
  z-index: 3;
  transform: translateY(-2px);
}

.results-offer-stack {
  order: 3;
  position: relative;
  inset: auto;
  z-index: 1;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: 100%;
  min-height: 236px;
  overflow: hidden;
  border: 1px solid rgba(157, 111, 52, .22);
  border-radius: 7px;
  background:
    radial-gradient(circle at 90% 6%, rgba(36, 76, 69, .08), transparent 34%),
    rgba(255, 252, 244, .72);
  box-shadow: none;
}

.results-offer-stack-head {
  position: relative;
  right: auto;
  bottom: auto;
  padding: 10px 12px 2px;
  background: transparent;
}

.results-offer-stack-head small {
  font-size: 10px;
}

.results-offer-stack-head span {
  font-size: 8px;
}

.results-offer-stack .offer-wall.offer-showcase,
#results .results-offer-stack .offer-lane {
  height: 186px;
}

.results-offer-stack .offer-wall.offer-showcase {
  -webkit-mask-image: linear-gradient(90deg, #000 0, #000 94%, transparent);
  mask-image: linear-gradient(90deg, #000 0, #000 94%, transparent);
}

#results .results-offer-stack .offer-lane {
  padding: 8px 0 18px;
}

#results .results-offer-stack .offer-sequence {
  align-items: center;
  padding: 4px 72px 18px 22px;
}

#results .results-offer-stack .offer-sequence .offer-card,
#results .results-offer-stack .offer-sequence .offer-card:nth-child(n) {
  flex-basis: 126px;
  width: 126px;
  margin-left: -76px;
  transform: rotate(2deg) translateY(3px);
  box-shadow: -5px 7px 14px rgba(34, 47, 41, .18);
}

#results .results-offer-stack .offer-sequence .offer-card:first-child {
  margin-left: 0;
  transform: rotate(-4deg) translateY(4px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(3n + 2) {
  transform: rotate(0) translateY(0);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(3n) {
  transform: rotate(4deg) translateY(5px);
}

.results-offer-stack-note {
  padding: 0 12px 9px;
  font-size: 8px;
}

/* 第六屏：学生视频 + 放大动态 Offer 喜报墙 */
.results-offer-composite {
  padding: 10px 10px 13px;
}

.results-offer-composite .results-offer-interview {
  padding-bottom: 9px;
  margin-bottom: 12px;
}

.results-offer-stack {
  min-height: 306px;
  border-color: rgba(146, 101, 44, .3);
  background:
    linear-gradient(90deg, rgba(255, 252, 244, .96), rgba(248, 239, 217, .94)),
    var(--paper);
  box-shadow: 0 7px 17px rgba(41, 52, 45, .1);
}

.results-offer-stack-head {
  padding: 11px 13px 3px;
}

.results-offer-stack-head small {
  color: var(--ink-deep);
  font-size: 11px;
  letter-spacing: .1em;
}

.results-offer-stack-head span {
  color: #6d766f;
  font-size: 8px;
}

.results-offer-stack .offer-wall.offer-showcase,
#results .results-offer-stack .offer-lane {
  height: 250px;
}

#results .results-offer-stack .offer-lane {
  padding: 10px 0 18px;
  scroll-behavior: auto;
  touch-action: pan-x;
  cursor: grab;
}

#results .results-offer-stack .offer-lane:active {
  cursor: grabbing;
}

#results .results-offer-stack .offer-sequence {
  align-items: center;
  padding: 5px 90px 20px 25px;
}

#results .results-offer-stack .offer-sequence .offer-card,
#results .results-offer-stack .offer-sequence .offer-card:nth-child(n) {
  flex-basis: 158px;
  width: 158px;
  margin-left: -58px;
  transform: rotate(1.5deg) translateY(3px);
  box-shadow: -5px 8px 16px rgba(34, 47, 41, .2);
}

#results .results-offer-stack .offer-sequence .offer-card:first-child {
  margin-left: 0;
  transform: rotate(-2.5deg) translateY(3px);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(3n + 2) {
  transform: rotate(0) translateY(0);
}

#results .results-offer-stack .offer-sequence .offer-card:nth-child(3n) {
  transform: rotate(2.5deg) translateY(4px);
}

.results-offer-stack-note {
  padding: 0 13px 10px;
  color: #68736d;
  font-size: 8px;
  letter-spacing: .04em;
}

/* 第六屏：整齐陈列、与全站纸墨画风统一的喜报墙 */
.results-offer-stack {
  border-color: rgba(145, 100, 43, .36);
  border-radius: 5px;
  outline: 1px solid rgba(184, 143, 78, .16);
  outline-offset: -6px;
  background:
    linear-gradient(90deg, rgba(255, 252, 244, .97), rgba(248, 240, 221, .94)),
    repeating-linear-gradient(0deg, transparent 0 22px, rgba(94, 73, 43, .025) 22px 23px),
    var(--paper);
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .7) inset,
    0 8px 18px rgba(40, 52, 45, .1);
}

.results-offer-stack::before {
  position: absolute;
  inset: 6px;
  z-index: 0;
  border: 1px solid rgba(184, 143, 78, .12);
  border-radius: 2px;
  content: "";
  pointer-events: none;
}

.results-offer-stack-head {
  z-index: 2;
  align-items: center;
  padding: 12px 14px 7px;
  border-bottom: 1px solid rgba(159, 113, 54, .18);
}

.results-offer-stack-head small {
  display: grid;
  gap: 2px;
  color: var(--ink-deep);
  font-family: "Noto Serif SC", "Songti SC", serif;
  font-size: 12px;
  letter-spacing: .12em;
}

.results-offer-stack-head small::before {
  content: "OFFER WALL";
  color: var(--gold-dark);
  font-family: Arial, sans-serif;
  font-size: 7px;
  font-weight: 800;
  letter-spacing: .18em;
}

.results-offer-stack-head span {
  color: #68736d;
  font-size: 8px;
  letter-spacing: .03em;
}

.results-offer-stack .offer-wall.offer-showcase {
  z-index: 1;
  -webkit-mask-image: linear-gradient(90deg, #000 0, #000 95%, transparent);
  mask-image: linear-gradient(90deg, #000 0, #000 95%, transparent);
}

#results .results-offer-stack .offer-lane {
  padding: 10px 0 17px;
}

#results .results-offer-stack .offer-sequence {
  gap: 10px;
  align-items: flex-start;
  padding: 5px 28px 18px;
}

#results .results-offer-stack .offer-sequence .offer-card,
#results .results-offer-stack .offer-sequence .offer-card:nth-child(n),
#results .results-offer-stack .offer-sequence .offer-card:first-child {
  flex-basis: 152px;
  width: 152px;
  margin-left: 0;
  border: 1px solid rgba(142, 96, 41, .26);
  border-radius: 3px;
  background: #fffaf0;
  box-shadow:
    0 1px 0 rgba(255, 255, 255, .82) inset,
    0 7px 14px rgba(35, 48, 42, .14);
  scroll-snap-align: start;
  transform: none;
}

#results .results-offer-stack .offer-sequence .offer-card:hover,
#results .results-offer-stack .offer-sequence .offer-card:focus-visible {
  z-index: 2;
  border-color: rgba(36, 76, 69, .5);
  transform: translateY(-3px);
}

.results-offer-stack-note {
  z-index: 2;
  padding: 0 14px 11px;
  color: #69746d;
  font-size: 8px;
  letter-spacing: .04em;
}

/* 第六屏：双机型第 7 屏安全范围收口 */
#results {
  padding-top: 66px;
  padding-bottom: 12px;
}

#results .results-video-section {
  margin-top: 9px;
}

#results .results-featured-videos {
  gap: 8px;
  margin-top: 8px;
  margin-bottom: 3px;
  padding-top: 1px;
  padding-bottom: 4px;
}

#results .results-story-copy {
  padding: 7px 9px 8px;
}

#results .results-story-copy strong {
  font-size: 11px;
  line-height: 1.35;
}

#results .results-story-copy p {
  margin-top: 2px;
  font-size: 8px;
  line-height: 1.4;
}

#results .results-video-note {
  font-size: 10px;
  line-height: 1.45;
}

#results .final-cta {
  margin-top: 8px;
  padding: 10px 14px;
}

#results .final-cta p {
  margin-top: 3px;
}

#results .final-cta .reserve-btn {
  margin-top: 7px;
}

#results .tiny-note {
  margin-top: 5px;
  font-size: 8px;
  line-height: 1.45;
}

.results-video-list {
  grid-auto-columns: 74%;
  margin-top: 12px;
  margin-bottom: 7px;
  padding-bottom: 12px;
}

.results-featured-videos {
  display: grid;
  grid-template-rows: repeat(3, minmax(0, 1fr));
  grid-auto-flow: column;
  grid-auto-columns: 48%;
  gap: 10px;
  margin: 10px -26px 7px;
  padding: 3px 26px 10px;
  overflow: hidden;
  scrollbar-width: none;
}

.results-featured-videos::-webkit-scrollbar { display: none; }

.results-story-card {
  overflow: hidden;
  border: 1px solid rgba(148, 109, 57, .28);
  border-radius: 7px;
  background:
    radial-gradient(circle at 88% 8%, rgba(218, 177, 112, .18), transparent 34%),
    rgba(255, 250, 240, .9);
  box-shadow: 0 12px 26px rgba(49, 49, 37, .11);
  scroll-snap-align: center;
}

.results-story-media {
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.results-story-media .unified-video-player {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.results-story-copy {
  position: relative;
  padding: 9px 11px 10px;
}

.results-story-copy::before {
  content: "";
  position: absolute;
  left: 11px;
  top: 0;
  width: 38px;
  height: 2px;
  background: linear-gradient(90deg, var(--gold-dark), rgba(177, 138, 80, .12));
}

.results-story-copy small {
  display: block;
  color: var(--gold-dark);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .12em;
}

.results-story-copy strong {
  display: block;
  margin-top: 4px;
  color: var(--ink-deep);
  font-size: 12px;
  line-height: 1.35;
}

.results-story-copy p {
  margin: 3px 0 0;
  color: #60706a;
  font-size: 8.5px;
  line-height: 1.4;
}

.results-channel-link {
  display: block;
  height: 100%;
  color: inherit;
  text-decoration: none;
}

.results-channel-media {
  position: relative;
  display: block;
  overflow: hidden;
  background: #111;
}

.results-channel-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.results-channel-play {
  position: absolute;
  left: 50%;
  top: 50%;
  display: grid;
  width: 40px;
  height: 40px;
  place-items: center;
  border: 1px solid rgba(255, 255, 255, .72);
  border-radius: 50%;
  background: rgba(247, 241, 224, .9);
  box-shadow: 0 5px 18px rgba(0, 0, 0, .24);
  transform: translate(-50%, -50%);
}

.results-channel-play .video-play {
  border-left-color: var(--ink-deep);
}

.results-channel-badge {
  position: absolute;
  right: 7px;
  top: 7px;
  padding: 3px 6px;
  border: 1px solid rgba(255, 255, 255, .55);
  border-radius: 999px;
  color: #fff;
  background: rgba(14, 67, 56, .88);
  font-size: 8px;
  font-weight: 800;
  letter-spacing: .08em;
}

.results-channel-card .results-story-copy {
  display: block;
}

#results {
  padding-top: 36px;
  padding-bottom: 38px;
}

#results > .eyebrow {
  margin-bottom: 6px;
  font-size: 11px;
}

#results > h2 {
  font-size: 25px;
}

#results > .section-lead {
  margin: 8px 0 14px;
  font-size: 13px;
  line-height: 1.6;
}

#results .results-offer-section,
#results .results-video-section {
  margin-top: 13px;
}

#results .results-module-header h3 {
  font-size: 16px;
}

#results .final-cta {
  margin-top: 13px;
  padding: 14px 16px;
}

#results .final-cta h3 {
  font-size: 16px;
}

#results .final-cta p {
  margin-top: 5px;
  font-size: 11px;
}

#results .final-cta .reserve-btn {
  margin-top: 10px;
}

#results .tiny-note {
  margin-top: 9px;
  font-size: 9px;
}

.results-video-list .video-media-card {
  border-width: 5px;
  transform: none;
}

.results-video-list .video-media-card video {
  aspect-ratio: 16 / 9;
  object-fit: cover;
}

.results-video-list .video-media-card strong {
  margin-top: 9px;
  font-size: 14px;
}

.results-video-list .video-media-card p {
  margin-top: 3px;
  font-size: 10px;
}

.results-video-note {
  margin: 0;
  color: #64716c;
  font-size: 11px;
  line-height: 1.55;
}

.offer-card:focus-visible {
  outline: 3px solid rgba(36, 76, 69, .72);
  outline-offset: 3px;
}

.offer-viewer {
  position: fixed;
  inset: 0;
  z-index: 32;
  display: grid;
  place-items: center;
  padding: 18px;
  background:
    linear-gradient(rgba(21, 48, 42, .48), rgba(13, 37, 32, .6)),
    url("assets/images/home-hero-bg-no-guide.png") center / cover no-repeat;
  backdrop-filter: blur(4px) saturate(.9);
}

.offer-viewer[hidden] {
  display: none;
}

.offer-viewer.is-school-gallery {
  background:
    linear-gradient(rgba(31, 51, 45, .2), rgba(24, 45, 39, .3)),
    url("assets/images/home-hero-bg-no-guide.png?v=20260713-1") center top / cover no-repeat;
  backdrop-filter: none;
}

.offer-viewer-stage {
  position: relative;
  display: grid;
  place-items: center;
  width: min(100%, 430px);
  max-height: calc(100vh - 36px);
}

.offer-viewer-stage > img {
  display: block;
  width: auto;
  max-width: 100%;
  height: auto;
  max-height: calc(100vh - 48px);
  border: 8px solid transparent;
  border-image: url("assets/images/reserve-button-frame.png") 90 110 / 8px / 0 stretch;
  border-radius: 2px;
  outline: 1px solid rgba(139, 113, 72, .48);
  outline-offset: -12px;
  object-fit: contain;
  background: #fffaf0;
  box-shadow:
    0 2px 0 rgba(255, 250, 240, .62),
    0 24px 70px rgba(13, 31, 27, .34);
  touch-action: pan-y;
}

.offer-viewer-swipe-hint {
  position: absolute;
  left: 50%;
  top: calc(100% + 15px);
  display: none;
  align-items: center;
  gap: 9px;
  width: max-content;
  margin: 0;
  padding: 7px 14px;
  border: 1px solid rgba(255, 250, 240, .5);
  border-radius: 3px;
  color: #fffaf0;
  background: rgba(24, 60, 54, .76);
  box-shadow: 0 8px 20px rgba(10, 20, 18, .18);
  font-size: 13px;
  line-height: 1;
  transform: translateX(-50%);
  pointer-events: none;
}

.offer-viewer-swipe-hint span {
  font: 20px/1 Arial, sans-serif;
}

.offer-viewer.is-school-gallery .offer-viewer-swipe-hint {
  display: flex;
  animation: school-swipe-hint 1.8s ease-in-out infinite;
}

.offer-viewer:not(.is-school-gallery) .offer-viewer-nav {
  display: none;
}

@keyframes school-swipe-hint {
  0%, 100% { transform: translateX(-50%); opacity: .72; }
  50% { transform: translateX(calc(-50% + 5px)); opacity: 1; }
}

.offer-viewer-close,
.offer-viewer-nav {
  position: absolute;
  z-index: 2;
  display: grid;
  place-items: center;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid rgba(255, 250, 240, .48);
  border-radius: 50%;
  color: #fffaf0;
  background: rgba(24, 60, 54, .88);
  box-shadow: 0 10px 24px rgba(0, 0, 0, .2);
  cursor: pointer;
}

.offer-viewer-close {
  right: -8px;
  top: -8px;
  font-size: 28px;
  line-height: 1;
}

.offer-viewer-nav {
  top: 50%;
  font-family: Arial, sans-serif;
  font-size: 34px;
  line-height: 1;
  transform: translateY(-50%);
}

.offer-viewer-previous {
  left: -10px;
}

.offer-viewer-next {
  right: -10px;
}

@media (prefers-reduced-motion: reduce) {
  .offer-lane {
    scroll-snap-type: x proximity;
  }

  .offer-card {
    scroll-snap-align: center;
  }
}

.image-caption {
  margin: -4px 0 22px;
  color: #53645f;
  font-size: 13px;
  line-height: 1.55;
}

.feature-list {
  grid-template-columns: 1fr;
}

.feature-list article,
.problem-grid article,
.major-grid article,
.support-grid article,
.special-row article {
  padding: 16px;
}

.feature-list h3,
.major-grid h3,
.support-grid h3,
.route-card h3,
.cert-box h3,
.special-row h3,
.final-cta h3 {
  margin: 0;
  color: var(--ink-deep);
  font-size: 18px;
  line-height: 1.35;
}

.feature-list p,
.problem-grid p,
.major-grid p,
.support-grid p,
.route-card p,
.cert-box p,
.special-row p,
.feature-video p,
.final-cta p {
  margin: 8px 0 0;
  color: #50615b;
  font-size: 14px;
  line-height: 1.65;
}

.link-card {
  position: relative;
  display: grid;
  gap: 8px;
  margin: 18px 0;
  overflow: hidden;
  text-decoration: none;
}

.ink-video-frame {
  min-height: 260px;
  padding: 12px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  border: 1px solid rgba(36, 51, 47, .12);
  border-radius: var(--radius);
  background:
    linear-gradient(180deg, rgba(255, 250, 240, .92), rgba(246, 240, 228, .78)),
    radial-gradient(circle at 18% 8%, rgba(177, 144, 80, .12), transparent 18%);
  box-shadow: 0 18px 34px rgba(36, 51, 47, .16);
}

.ink-video-frame::before {
  content: "";
  position: absolute;
  inset: 14px;
  border-radius: 6px;
  background:
    linear-gradient(180deg, rgba(36, 51, 47, .02), rgba(36, 51, 47, .58)),
    url("assets/content/campus-gate.jpg") center / cover no-repeat;
  clip-path: polygon(2% 0, 98% 2%, 100% 13%, 98% 88%, 94% 98%, 72% 95%, 58% 100%, 42% 96%, 20% 99%, 3% 94%, 0 76%, 2% 42%);
  box-shadow:
    inset 0 0 0 1px rgba(255, 250, 240, .48),
    inset 0 0 0 8px rgba(36, 51, 47, .08);
}

.aigc-video-frame::before {
  background:
    linear-gradient(180deg, rgba(36, 51, 47, .02), rgba(36, 51, 47, .58)),
    url("assets/content/classroom-01.jpg") center / cover no-repeat;
}

.ink-video-frame::after {
  content: "";
  position: absolute;
  inset: 8px;
  border: 1px solid rgba(36, 51, 47, .09);
  border-radius: var(--radius);
  pointer-events: none;
  box-shadow: inset 0 0 20px rgba(36, 51, 47, .08);
}

.video-play {
  position: absolute;
  z-index: 2;
  left: 50%;
  top: 42%;
  width: 58px;
  height: 58px;
  border-radius: 50%;
  background: rgba(255, 250, 240, .88);
  transform: translate(-50%, -50%);
  box-shadow: 0 0 0 8px rgba(255, 250, 240, .16), 0 10px 26px rgba(36, 51, 47, .16);
}

.video-play::before {
  content: "";
  position: absolute;
  left: 23px;
  top: 18px;
  width: 18px;
  height: 22px;
  background: var(--ink-deep);
  clip-path: polygon(0 0, 100% 50%, 0 100%);
}

.ink-video-frame span,
.ink-video-frame b {
  position: relative;
  z-index: 1;
  margin: 0 18px;
}

.ink-video-frame span {
  color: var(--paper-light);
  font-size: 15px;
  line-height: 1.55;
  font-weight: 700;
  text-shadow: 0 1px 6px rgba(0, 0, 0, .22);
}

.ink-video-frame b {
  width: fit-content;
  margin: 8px 18px 18px;
  border-bottom: 1px solid rgba(177, 138, 80, .9);
  color: var(--paper-light);
  font-size: 13px;
}

.tiny-note {
  margin: 18px 0 0;
  color: #7b776c;
  font-size: 12px;
  line-height: 1.65;
}

.problem-grid {
  grid-template-columns: 1fr;
}

.problem-grid span,
.special-row span,
.feature-video span,
.route-label {
  display: inline-flex;
  align-items: center;
  min-height: 24px;
  padding: 0 9px;
  border-radius: 999px;
  color: var(--ink-deep);
  background: rgba(177, 138, 80, .16);
  font-size: 12px;
  font-weight: 800;
}

.tag-list {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  margin-top: 20px;
}

.tag-list span {
  padding: 8px 10px;
  border: 1px solid rgba(36, 76, 69, .18);
  border-radius: 999px;
  color: var(--ink-deep);
  background: rgba(255, 250, 240, .7);
  font-size: 13px;
  font-weight: 700;
}

.route-card {
  padding: 18px;
}

.route-card h3 {
  margin-top: 10px;
}

.route-card ul {
  margin: 12px 0 0;
  padding-left: 18px;
  color: #50615b;
  font-size: 14px;
  line-height: 1.65;
}

.cert-box {
  margin-top: 14px;
  padding: 18px;
  background: rgba(36, 76, 69, .08);
}

.major-grid,
.support-grid {
  grid-template-columns: 1fr 1fr;
}

.special-row {
  margin-top: 12px;
}

.special-row article {
  background: rgba(255, 250, 240, .86);
}

.special-row h3 {
  margin-top: 9px;
}

.video-grid {
  margin-top: 18px;
  grid-template-columns: 1fr;
}

.video-card,
.feature-video {
  display: block;
  padding: 18px;
  color: inherit;
  text-decoration: none;
  background:
    linear-gradient(135deg, rgba(36, 76, 69, .12), rgba(255, 250, 240, .86)),
    rgba(255, 250, 240, .82);
}

.play-mark {
  display: inline-grid;
  place-items: center;
  width: 38px;
  height: 38px;
  margin-bottom: 11px;
  border-radius: 999px;
  color: #fffaf0;
  background: var(--ink);
  font-size: 15px;
}

.video-card strong,
.feature-video strong {
  display: block;
  color: var(--ink-deep);
  font-size: 18px;
  line-height: 1.35;
}

.video-card p {
  margin: 7px 0 0;
  color: #50615b;
  font-size: 14px;
  line-height: 1.55;
}

.video-wall {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 58%;
  gap: 14px;
  margin: 20px -26px 18px;
  padding: 0 26px 18px;
  overflow-x: auto;
  overflow-y: visible;
  scroll-snap-type: x proximity;
  scrollbar-width: thin;
  scrollbar-color: rgba(36, 76, 69, .42) rgba(36, 76, 69, .08);
  -webkit-overflow-scrolling: touch;
}

.video-wall::-webkit-scrollbar {
  height: 7px;
}

.video-wall::-webkit-scrollbar-track {
  border-radius: 999px;
  background: rgba(36, 76, 69, .08);
}

.video-wall::-webkit-scrollbar-thumb {
  border-radius: 999px;
  background: rgba(36, 76, 69, .42);
}

.video-wall .video-card {
  position: relative;
  min-height: 238px;
  padding: 16px;
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  overflow: hidden;
  border: 8px solid rgba(255, 250, 240, .86);
  border-radius: 6px;
  color: var(--paper-light);
  background:
    linear-gradient(180deg, rgba(36, 51, 47, .04), rgba(36, 51, 47, .68)),
    url("assets/content/work-01.jpg") center / cover no-repeat;
  box-shadow: 0 16px 30px rgba(36, 51, 47, .14);
  scroll-snap-align: center;
  transform: rotate(-1.5deg);
}

.video-wall .video-card:nth-child(2n) {
  background:
    linear-gradient(180deg, rgba(36, 51, 47, .04), rgba(36, 51, 47, .68)),
    url("assets/content/work-02.jpg") center / cover no-repeat;
  transform: rotate(1.4deg) translateY(8px);
}

.video-wall .video-card:nth-child(3n) {
  background:
    linear-gradient(180deg, rgba(36, 51, 47, .04), rgba(36, 51, 47, .68)),
    url("assets/content/classroom-01.jpg") center / cover no-repeat;
  transform: rotate(-0.6deg) translateY(-4px);
}

.video-wall .video-card:nth-child(4n) {
  background:
    linear-gradient(180deg, rgba(36, 51, 47, .04), rgba(36, 51, 47, .68)),
    url("assets/content/ceremony.jpg") center / cover no-repeat;
}

.video-wall .video-card:nth-child(5n) {
  background:
    linear-gradient(180deg, rgba(36, 51, 47, .04), rgba(36, 51, 47, .68)),
    url("assets/content/portfolio-work.jpg") center / cover no-repeat;
}

.video-wall .video-card:nth-child(6n) {
  background:
    linear-gradient(180deg, rgba(36, 51, 47, .04), rgba(36, 51, 47, .68)),
    url("assets/content/work-03.jpg") center / cover no-repeat;
}

.video-wall .video-card:nth-child(7n) {
  background:
    linear-gradient(180deg, rgba(36, 51, 47, .04), rgba(36, 51, 47, .68)),
    url("assets/content/classroom-03.jpg") center / cover no-repeat;
}

.video-wall .video-card::after {
  content: "";
  position: absolute;
  inset: 0;
  border: 1px solid rgba(255, 250, 240, .28);
  pointer-events: none;
}

.video-wall .video-card .video-play {
  top: 43%;
  width: 52px;
  height: 52px;
  background: rgba(255, 250, 240, .9);
}

.video-wall .video-card .video-play::before {
  left: 21px;
  top: 16px;
  width: 17px;
  height: 20px;
}

.video-wall .video-card strong,
.video-wall .video-card p {
  position: relative;
  z-index: 1;
  color: var(--paper-light);
  text-shadow: 0 1px 8px rgba(0, 0, 0, .24);
}

.video-wall .video-card strong {
  font-size: 17px;
}

.video-wall .video-card p {
  margin-top: 7px;
  color: rgba(255, 250, 240, .86);
}

.video-wall .video-media-card {
  min-height: 0;
  padding: 0 0 14px;
  background: rgba(255, 250, 240, .86);
  color: var(--ink-deep);
}

.video-wall .video-media-card video {
  position: relative;
  z-index: 1;
  display: block;
  width: 100%;
  aspect-ratio: 3 / 4;
  object-fit: cover;
  background: rgba(36, 51, 47, .16);
}

.video-wall .video-media-card strong,
.video-wall .video-media-card p {
  padding-inline: 12px;
  color: var(--ink-deep);
  text-shadow: none;
}

.video-wall .video-media-card strong {
  margin-top: 12px;
}

.video-wall .video-media-card p {
  color: #50615b;
}

.feature-video {
  margin-top: 18px;
}

.feature-video strong {
  margin-top: 10px;
}

.offer-wall img {
  object-position: top center;
}

.apply-flow {
  grid-template-columns: repeat(2, 1fr);
  margin: 20px 0;
}

.apply-flow article {
  display: grid;
  grid-template-columns: 34px 1fr;
  gap: 9px;
  align-items: center;
  min-height: 60px;
  padding: 12px;
}

.apply-flow b {
  display: grid;
  place-items: center;
  width: 34px;
  height: 34px;
  border-radius: 999px;
  color: #fffaf0;
  background: var(--ink);
  font-size: 14px;
}

.apply-flow span {
  color: var(--ink-deep);
  font-size: 14px;
  font-weight: 800;
  line-height: 1.35;
}

.final-cta {
  padding: 20px;
  text-align: center;
  background:
    radial-gradient(circle at 50% 0%, rgba(255, 255, 255, .72), transparent 46%),
    rgba(255, 250, 240, .88);
}

.final-cta .reserve-btn {
  width: 100%;
  margin-top: 16px;
  transform: none;
}

.closing-section {
  position: relative;
  min-height: calc(min(100vw, 520px) * 1.7768);
  overflow: hidden;
  background: #f7efe3;
}

.closing-section img {
  display: block;
  width: 100%;
  min-height: calc(min(100vw, 520px) * 1.7768);
  object-fit: cover;
  object-position: center;
}

.closing-section h2 {
  position: absolute;
  z-index: 1;
  right: 22px;
  bottom: 42px;
  margin: 0;
  color: var(--ink-deep);
  font-size: clamp(16px, 4.2vw, 22px);
  line-height: 1.18;
  font-weight: 800;
  text-align: right;
  letter-spacing: .03em;
  white-space: nowrap;
  text-shadow: 0 2px 0 rgba(255, 255, 255, .48), 0 12px 28px rgba(15, 48, 42, .14);
}

@media (min-width: 480px) {
  .feature-list {
    grid-template-columns: repeat(3, 1fr);
  }

  .route-grid,
  .special-row,
  .video-grid {
    grid-template-columns: 1fr 1fr;
  }
}

@media (max-width: 390px) {
  .content-section {
    padding-inline: 20px;
  }

  .content-section h2 {
    font-size: 25px;
  }

  .stat-grid {
    gap: 8px;
  }

  .major-grid,
  .support-grid,
  .apply-flow {
    grid-template-columns: 1fr;
  }
}

@media (min-height: 1080px) {
  .hero-card {
    min-height: max(calc(min(100vw, 520px) * 1.7768), 100svh);
  }

  .hero-card::before {
    background-color: #f7efe3;
    background-size: 100% auto;
  }

  .hero-card::after {
    background: linear-gradient(180deg, transparent 76%, rgba(247, 239, 227, .28) 84%, rgba(247, 239, 227, .08) 100%);
    box-shadow: inset 0 0 34px rgba(101, 83, 49, .1);
  }

  .hero-bg {
    display: block;
    inset: auto 0 0;
    z-index: 0;
    height: max(190px, calc(100svh - (min(100vw, 520px) * 1.7768) + 76px));
    opacity: 1;
    background: linear-gradient(180deg, rgba(247, 239, 227, .08) 0%, rgba(247, 239, 227, .26) 62%, rgba(247, 239, 227, .5) 100%);
  }

  .hero-bg::before,
  .hero-bg::after {
    content: "";
    position: absolute;
    inset: 0;
    pointer-events: none;
  }

  .hero-bg::before {
    opacity: .78;
    background: url("assets/images/home-hero-bg-no-guide.png?v=20260713-1") center 66% / 100% auto no-repeat;
    transform: scaleY(-1);
    transform-origin: center;
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 18%, rgba(0, 0, 0, .72) 68%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 18%, rgba(0, 0, 0, .72) 68%, transparent 100%);
  }

  .hero-bg::after {
    opacity: .38;
    background: repeating-linear-gradient(0deg, transparent 0 10px, rgba(255, 250, 240, .42) 11px, rgba(49, 96, 84, .12) 12px, transparent 14px);
    -webkit-mask-image: linear-gradient(180deg, transparent 0%, #000 22%, rgba(0, 0, 0, .58) 76%, transparent 100%);
    mask-image: linear-gradient(180deg, transparent 0%, #000 22%, rgba(0, 0, 0, .58) 76%, transparent 100%);
  }
}

/* Third screen optimization · 2026-07-16 */
.integrated-project-section {
  height: auto;
  min-height: 0;
  overflow: visible;
  padding: 78px 24px 46px;
}

.integrated-project-section > .school-guide-button {
  right: 24px;
  top: 22px;
}

.integrated-project-content {
  display: block;
  width: 100%;
  max-width: 440px;
  height: auto;
  min-height: 0;
  margin-inline: auto;
}

.integrated-project-content > .eyebrow {
  margin: 0 0 6px;
  font-size: 12px;
  letter-spacing: .08em;
}

.integrated-project-content > h2 {
  font-size: clamp(20px, 5.7vw, 26px);
  line-height: 1.3;
}

.integrated-project-content > h2 span {
  display: block;
  white-space: nowrap;
}

.integrated-project-content > .section-lead {
  max-width: 420px;
  margin: 9px 0 0;
  color: #50615b;
  font-size: 13px;
  line-height: 1.65;
}

.project-interview-section,
.project-route-showcase,
.project-advantages,
.project-support-timeline,
.project-planning-cta {
  margin-top: 34px;
}

.project-module-eyebrow {
  margin: 0 0 7px;
  color: var(--gold-dark);
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 11px;
  font-weight: 800;
  letter-spacing: .12em;
}

.project-interview-section > h3,
.project-route-showcase > h3,
.project-advantages > h3,
.project-timeline-heading > h3,
.project-planning-cta > h3 {
  margin: 0;
  color: var(--ink-deep);
  font-size: 20px;
  line-height: 1.4;
  font-weight: 900;
}

.project-interview-section > p:not(.project-module-eyebrow),
.project-module-lead,
.project-timeline-heading > p:not(.project-module-eyebrow) {
  margin: 7px 0 0;
  color: #596961;
  font-size: 13px;
  line-height: 1.65;
}

.project-interview-card {
  position: relative;
  display: block;
  width: 100%;
  margin-top: 14px;
  overflow: hidden;
  padding: 7px;
  border: 1px solid rgba(151, 117, 69, .38);
  border-radius: 6px;
  color: var(--paper-light);
  background: rgba(255, 250, 240, .82);
  box-shadow: 0 14px 30px rgba(40, 51, 43, .14);
  text-align: left;
  cursor: pointer;
}

.project-interview-poster {
  position: relative;
  display: block;
  aspect-ratio: 16 / 9;
  min-height: 0;
  overflow: hidden;
  border-radius: 3px;
  background: var(--ink-deep);
}

.project-interview-poster::after {
  content: "";
  position: absolute;
  inset: 36% 0 0;
  background: linear-gradient(180deg, transparent, rgba(11, 37, 31, .74));
  pointer-events: none;
}

.project-interview-poster > img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.78) contrast(.96);
}

.project-interview-poster .video-play {
  position: absolute;
  z-index: 2;
  left: 50%;
  top: 50%;
  width: 54px;
  height: 54px;
  border: 1px solid rgba(255, 250, 240, .66);
  border-radius: 50%;
  background: rgba(24, 60, 54, .84);
  box-shadow: 0 0 0 7px rgba(255, 250, 240, .12), 0 10px 22px rgba(11, 37, 31, .24);
  transform: translate(-50%, -50%);
}

.project-interview-poster .video-play::before {
  left: 22px;
  top: 16px;
  width: 16px;
  height: 22px;
  background: var(--paper-light);
}

.project-interview-poster > b {
  position: absolute;
  z-index: 2;
  right: 11px;
  bottom: 9px;
  left: 11px;
  color: rgba(255, 250, 240, .9);
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 10px;
  line-height: 1.4;
  font-weight: 700;
  text-align: right;
}

.project-interview-caption {
  display: block;
  padding: 11px 8px 6px;
  color: var(--ink-deep);
  font-size: 14px;
  line-height: 1.45;
  font-weight: 800;
}

.project-route-posters {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 10px;
  margin-top: 15px;
}

.project-route-poster {
  position: relative;
  display: grid;
  min-width: 0;
  overflow: hidden;
  padding: 0;
  border: 1px solid rgba(151, 117, 69, .38);
  border-radius: 6px;
  color: var(--ink-deep);
  background: rgba(255, 250, 240, .9);
  box-shadow: 0 13px 26px rgba(39, 49, 42, .13);
  text-align: left;
  cursor: pointer;
  isolation: auto;
  transition: transform .22s ease, box-shadow .22s ease;
}

.project-route-poster::before,
.project-route-poster::after {
  content: none;
}

.project-route-image {
  position: relative;
  display: block;
  aspect-ratio: 4 / 5;
  overflow: hidden;
  background: #d8d4c7;
}

.project-route-image::after {
  content: "";
  position: absolute;
  inset: 0;
  background: linear-gradient(180deg, rgba(24, 60, 54, .02), rgba(24, 60, 54, .34));
  pointer-events: none;
}

.project-route-image img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.72) sepia(.08);
  transition: transform .35s ease;
}

.project-route-copy {
  display: flex;
  min-width: 0;
  flex-direction: column;
  padding: 13px 11px 12px;
}

.project-route-poster strong {
  color: var(--ink-deep);
  font-family: "Songti SC", "STSong", "Noto Serif SC", serif;
  font-size: clamp(16px, 4.4vw, 20px);
  line-height: 1.25;
  font-weight: 900;
}

.project-route-poster b {
  min-height: 38px;
  margin-top: 6px;
  color: #344e46;
  font-size: 12px;
  line-height: 1.55;
}

.project-route-poster small {
  min-height: 34px;
  margin-top: 7px;
  color: #6c715f;
  font-family: "PingFang SC", "Microsoft YaHei", sans-serif;
  font-size: 9px;
  line-height: 1.75;
}

.project-route-poster em {
  display: block;
  min-height: 44px;
  margin: 10px -3px -3px;
  padding: 11px 5px 8px;
  border-top: 1px solid rgba(151, 117, 69, .25);
  color: var(--ink-deep);
  font-size: 10px;
  line-height: 1.45;
  font-style: normal;
  font-weight: 800;
}

.project-route-poster:active {
  transform: translateY(1px) scale(.992);
}

.project-route-poster:hover .project-route-image img {
  transform: scale(1.025);
}

.project-advantages {
  padding-top: 4px;
}

.project-accordion {
  display: grid;
  gap: 8px;
  margin-top: 14px;
}

.project-accordion-item {
  overflow: hidden;
  border: 1px solid rgba(151, 117, 69, .24);
  border-radius: 4px;
  background: rgba(255, 250, 240, .72);
  box-shadow: 0 6px 16px rgba(46, 55, 46, .06);
}

.project-accordion-toggle {
  min-height: 66px;
  padding: 11px 12px;
  cursor: pointer;
}

.project-accordion-toggle > span {
  grid-template-columns: 26px minmax(0, 1fr);
  align-items: center;
  column-gap: 7px;
}

.project-accordion-toggle b {
  grid-row: 1 / span 2;
  align-self: start;
  padding-top: 3px;
  font-size: 11px;
}

.project-accordion-toggle strong {
  font-size: 15px;
  line-height: 1.35;
}

.project-accordion-toggle small {
  grid-column: 2;
  overflow: visible;
  color: #66736d;
  font-size: 11px;
  line-height: 1.5;
  text-align: left;
  text-overflow: clip;
  white-space: normal;
}

.project-accordion-toggle i {
  flex-basis: 22px;
  width: 22px;
  height: 22px;
  margin-left: 9px;
}

.project-accordion-toggle i::before,
.project-accordion-toggle i::after {
  left: 4px;
  top: 10px;
  width: 14px;
}

.project-accordion-panel {
  opacity: 0;
  transition: grid-template-rows .26s ease, opacity .24s ease;
}

.project-accordion-item.is-open .project-accordion-panel {
  opacity: 1;
}

.project-accordion-panel-inner {
  padding: 0 14px;
}

.project-accordion-item.is-open .project-accordion-panel-inner {
  padding-bottom: 14px;
}

.project-accordion-panel p {
  color: #4b5e57;
  font-size: 12px;
  line-height: 1.75;
}

.project-accordion-tags {
  gap: 5px;
  margin-top: 10px;
}

.project-accordion-tags span {
  padding: 4px 7px;
  color: #2f5148;
  font-size: 9px;
}

.project-support-timeline {
  display: block;
  margin-top: 34px;
  padding: 0;
  border: 0;
}

.project-support-timeline ol {
  position: relative;
  display: grid;
  grid-template-columns: 1fr;
  gap: 9px;
  margin: 18px 0 0;
  padding: 0;
  list-style: none;
}

.project-support-timeline ol::before {
  content: "";
  position: absolute;
  left: 23px;
  top: 28px;
  bottom: 28px;
  width: 2px;
  height: auto;
  background: linear-gradient(180deg, rgba(141, 104, 54, .5), rgba(36, 76, 69, .76), rgba(141, 104, 54, .46));
  box-shadow: 0 0 0 4px rgba(255, 250, 240, .34);
}

.project-support-timeline .project-timeline-item {
  position: relative;
  display: grid;
  grid-template-columns: 48px minmax(0, 1fr);
  gap: 10px;
  min-width: 0;
  align-items: start;
  text-align: left;
}

.project-calendar-node {
  position: relative;
  z-index: 2;
  display: block;
  overflow: visible;
  width: 46px;
  height: 52px;
  margin: 8px 0 0;
  border: 1px solid rgba(123, 89, 44, .5);
  border-radius: 5px;
  background: rgba(255, 250, 240, .96);
  box-shadow: 0 0 0 3px rgba(255, 250, 240, .76), 0 7px 14px rgba(36, 76, 69, .13);
  text-align: center;
}

.project-calendar-node::before,
.project-calendar-node::after {
  content: "";
  position: absolute;
  z-index: 3;
  top: -4px;
  width: 3px;
  height: 9px;
  border-radius: 3px;
  background: var(--ink-deep);
  box-shadow: 0 0 0 2px rgba(255, 250, 240, .86);
}

.project-calendar-node::before {
  left: 10px;
}

.project-calendar-node::after {
  right: 10px;
}

.project-support-timeline .project-calendar-node > small,
.project-support-timeline .project-calendar-node > b {
  display: grid;
  width: auto;
  margin: 0;
  place-items: center;
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}

.project-support-timeline .project-calendar-node > small {
  height: 19px;
  border-radius: 4px 4px 0 0;
  color: #fffaf0;
  background: var(--gold-dark);
  font-size: 8px;
  line-height: 1;
  letter-spacing: .08em;
}

.project-support-timeline .project-calendar-node > b {
  height: 32px;
  border: 0;
  border-radius: 0 0 4px 4px;
  color: var(--ink-deep);
  background: rgba(255, 250, 240, .96);
  box-shadow: none;
  font: 800 9px/1.1 "PingFang SC", "Microsoft YaHei", sans-serif;
}

.project-timeline-card {
  position: relative;
  overflow: hidden;
  border: 1px solid rgba(151, 117, 69, .23);
  border-radius: 5px;
  background:
    radial-gradient(circle at 100% 0, rgba(177, 138, 80, .1), transparent 28%),
    rgba(255, 250, 240, .72);
  box-shadow: 0 7px 18px rgba(46, 55, 46, .07);
}

.project-timeline-card::before {
  content: "";
  position: absolute;
  left: -7px;
  top: 28px;
  width: 12px;
  height: 12px;
  border-width: 0 0 1px 1px;
  border-style: solid;
  border-color: rgba(151, 117, 69, .23);
  background: #faf3e7;
  transform: rotate(45deg);
}

.project-timeline-toggle {
  display: flex;
  width: 100%;
  min-height: 68px;
  align-items: center;
  justify-content: space-between;
  gap: 8px;
  margin: 0;
  padding: 10px 11px 9px 13px;
  border: 0;
  color: inherit;
  background: transparent;
  text-align: left;
  cursor: pointer;
}

.project-timeline-summary {
  display: block;
  min-width: 0;
}

.project-timeline-summary > strong {
  display: block;
  color: var(--ink-deep);
  font-size: 15px;
  line-height: 1.35;
}

.project-timeline-toggle > i {
  position: relative;
  flex: 0 0 22px;
  width: 22px;
  height: 22px;
  border: 1px solid rgba(36, 76, 69, .24);
  border-radius: 50%;
  background: rgba(255, 250, 240, .78);
}

.project-timeline-toggle > i::before,
.project-timeline-toggle > i::after {
  content: "";
  position: absolute;
  left: 4px;
  top: 10px;
  width: 12px;
  height: 1px;
  background: var(--ink-deep);
  transition: transform .24s ease;
}

.project-timeline-toggle > i::after {
  transform: rotate(90deg);
}

.project-timeline-item.is-open .project-timeline-toggle > i::after {
  transform: rotate(0);
}

.project-support-timeline .project-timeline-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 5px;
  margin-top: 7px;
}

.project-support-timeline .project-timeline-tags span {
  display: inline-flex;
  overflow: visible;
  padding: 4px 7px;
  border: 1px solid rgba(36, 76, 69, .14);
  border-radius: 2px;
  color: #315047;
  background: rgba(230, 235, 222, .52);
  font-size: 9px;
  line-height: 1.2;
  text-overflow: clip;
  white-space: nowrap;
}

.project-timeline-panel {
  display: grid;
  grid-template-rows: 0fr;
  opacity: 0;
  transition: grid-template-rows .26s ease, opacity .22s ease;
}

.project-timeline-item.is-open .project-timeline-panel {
  grid-template-rows: 1fr;
  opacity: 1;
}

.project-timeline-panel-inner {
  min-height: 0;
  overflow: hidden;
  padding: 0 13px;
}

.project-timeline-item.is-open .project-timeline-panel-inner {
  padding-bottom: 12px;
}

.project-support-timeline .project-timeline-panel p {
  margin: 0;
  padding-top: 10px;
  border-top: 1px solid rgba(151, 117, 69, .18);
  color: #4f625b;
  font-size: 12px;
  line-height: 1.7;
}

.project-schedule-button,
.project-drawer-consult {
  display: flex;
  align-items: center;
  justify-content: center;
  width: 100%;
  min-height: 48px;
  border: 1px solid rgba(36, 76, 69, .3);
  border-radius: 4px;
  color: var(--ink-deep);
  background: rgba(255, 250, 240, .82);
  font-size: 13px;
  font-weight: 800;
  cursor: pointer;
}

.project-schedule-button {
  margin-top: 14px;
}

.project-planning-cta {
  margin-top: 18px;
  padding: 24px 18px 20px;
  border: 1px solid rgba(151, 117, 69, .3);
  border-radius: 6px;
  background:
    radial-gradient(circle at 100% 0, rgba(177, 138, 80, .15), transparent 34%),
    linear-gradient(145deg, rgba(255, 250, 240, .92), rgba(231, 235, 220, .72));
  box-shadow: 0 12px 26px rgba(37, 53, 46, .1);
  text-align: center;
}

.project-planning-cta > p {
  margin: 9px 0 0;
  color: #4e625a;
  font-size: 12px;
  line-height: 1.7;
}

.project-planning-cta .project-assessment-button {
  position: relative;
  min-height: 50px;
  margin-top: 16px;
  overflow: hidden;
  color: var(--paper-light);
  background: var(--ink-deep);
  box-shadow: 0 9px 20px rgba(24, 60, 54, .19);
}

.project-planning-cta > small {
  display: block;
  margin-top: 9px;
  color: #6f7469;
  font-size: 10px;
  line-height: 1.5;
}

.project-route-poster:focus-visible,
.project-interview-card:focus-visible,
.project-accordion-toggle:focus-visible,
.project-timeline-toggle:focus-visible,
.project-schedule-button:focus-visible,
.project-assessment-button:focus-visible,
.project-drawer-consult:focus-visible {
  outline: 3px solid rgba(177, 138, 80, .58);
  outline-offset: 3px;
}

body.project-dialog-open {
  overflow: hidden;
  overscroll-behavior: none;
}

.screenshot-mode {
  scroll-behavior: auto;
  scrollbar-width: none;
}

.screenshot-mode::-webkit-scrollbar,
.screenshot-mode body::-webkit-scrollbar {
  display: none;
}

.screenshot-mode .scroll-page-hint {
  display: none;
}

/* QA capture mode: isolate the third screen without changing the formal page. */
.screenshot-mode main > :not(#project) {
  display: none !important;
}

.screenshot-mode #project {
  margin: 0 !important;
}

.project-route-backdrop,
.project-schedule-backdrop {
  z-index: 48;
  align-items: flex-end;
  padding: 14px 14px max(14px, env(safe-area-inset-bottom));
  background: rgba(12, 34, 29, .58);
}

.project-interview-backdrop {
  z-index: 49;
  padding: 18px;
  background: rgba(7, 22, 18, .78);
}

.project-route-drawer,
.project-schedule-drawer {
  position: relative;
  width: min(100%, 492px);
  max-height: min(88svh, 760px);
  margin: 0 auto;
  overflow: auto;
  overscroll-behavior: contain;
  border: 1px solid rgba(151, 117, 69, .42);
  border-radius: 10px 10px 4px 4px;
  color: var(--ink-deep);
  background:
    linear-gradient(rgba(255, 250, 240, .95), rgba(255, 250, 240, .98)),
    url("assets/images/review-hero-bg.jpg") center / cover no-repeat;
  box-shadow: 0 -18px 50px rgba(10, 30, 25, .3);
  animation: project-drawer-in .28s ease both;
}

.project-route-drawer {
  padding: 44px 24px max(24px, env(safe-area-inset-bottom));
}

.project-route-drawer > .modal-close {
  position: absolute;
  z-index: 2;
  right: 14px;
  top: 12px;
}

.project-route-detail .eyebrow {
  margin-bottom: 6px;
}

.project-route-detail h2 {
  margin: 0 0 18px;
  font-size: 26px;
}

.project-route-detail h3 {
  margin: 16px 0 7px;
  font-size: 14px;
}

.project-route-detail-lead {
  margin: 0;
  color: #4d6059;
  font-size: 13px;
  line-height: 1.75;
}

.project-route-fit {
  display: grid;
  gap: 7px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.project-route-fit li {
  position: relative;
  padding: 8px 9px 8px 25px;
  border: 1px solid rgba(36, 76, 69, .14);
  border-radius: 3px;
  color: #3d574f;
  background: rgba(230, 235, 222, .48);
  font-size: 12px;
  line-height: 1.5;
}

.project-route-fit li::before {
  content: "·";
  position: absolute;
  left: 11px;
  color: var(--gold-dark);
  font-weight: 900;
}

.project-route-flow {
  display: block;
  margin: 0;
  padding: 12px 11px;
  border-top: 1px solid rgba(151, 117, 69, .24);
  border-bottom: 1px solid rgba(151, 117, 69, .2);
  color: var(--ink-deep);
  font-size: 12px;
  line-height: 1.75;
  font-weight: 800;
  text-align: center;
}

.project-route-detail .project-drawer-consult {
  margin-top: 18px;
  color: var(--paper-light);
  background: var(--ink-deep);
}

.project-route-disclaimer {
  margin-bottom: 0;
  font-size: 10px;
}

.project-interview-modal {
  position: relative;
  width: min(100%, 480px);
  margin: auto;
  padding: 44px 18px 18px;
  border: 1px solid rgba(177, 138, 80, .42);
  border-radius: 7px;
  color: var(--ink-deep);
  background: var(--paper-light);
  box-shadow: 0 24px 70px rgba(4, 17, 13, .42);
}

.project-interview-modal > .modal-close {
  position: absolute;
  right: 12px;
  top: 10px;
}

.project-interview-modal > h2 {
  margin: 0 0 14px;
  font-size: 20px;
  line-height: 1.45;
}

.project-interview-player-wrap {
  display: grid;
  aspect-ratio: 16 / 9;
  overflow: hidden;
  place-items: center;
  border-radius: 3px;
  background: #102d27;
}

.project-interview-player-wrap video {
  display: block;
  width: 100%;
  height: 100%;
  background: #071713;
  object-fit: contain;
}

.project-media-pending {
  max-width: 280px;
  margin: 0;
  padding: 18px;
  color: rgba(255, 250, 240, .84);
  font-size: 12px;
  line-height: 1.7;
  text-align: center;
}

.project-schedule-drawer {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  overflow: hidden;
}

.project-schedule-header {
  position: relative;
  z-index: 2;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 16px;
  padding: 18px 18px 14px;
  border-bottom: 1px solid rgba(151, 117, 69, .22);
  background: rgba(255, 250, 240, .96);
}

.project-schedule-header .project-module-eyebrow {
  margin-bottom: 3px;
}

.project-schedule-header h2 {
  margin: 0;
  font-size: 22px;
}

.project-schedule-header .modal-close {
  position: static;
  flex: 0 0 auto;
}

.project-schedule-scroll {
  overflow-y: auto;
  overscroll-behavior: contain;
  padding: 15px 18px max(20px, env(safe-area-inset-bottom));
}

.project-schedule-status {
  margin: 0 0 15px;
  padding: 11px 12px;
  border-left: 3px solid var(--gold-dark);
  color: #6d5838;
  background: rgba(230, 210, 171, .28);
  font-size: 11px;
  line-height: 1.65;
}

.project-schedule-list {
  display: grid;
  gap: 8px;
  margin: 0;
  padding: 0;
  list-style: none;
}

.project-schedule-list li {
  position: relative;
  display: grid;
  grid-template-columns: minmax(88px, .65fr) minmax(0, 1.35fr);
  gap: 10px;
  align-items: start;
  padding: 12px;
  border: 1px solid rgba(151, 117, 69, .2);
  border-radius: 3px;
  background: rgba(255, 250, 240, .66);
}

.project-schedule-list time {
  color: var(--ink-deep);
  font-size: 12px;
  line-height: 1.5;
  font-weight: 900;
}

.project-schedule-list p {
  margin: 0;
  color: #627069;
  font-size: 11px;
  line-height: 1.55;
}

.project-schedule-scroll .project-drawer-consult {
  margin-top: 14px;
  color: var(--paper-light);
  background: var(--ink-deep);
}

.qr-modal-context {
  margin-top: 8px !important;
  color: var(--gold-dark) !important;
  font-size: 11px !important;
}

@keyframes project-drawer-in {
  from {
    opacity: .5;
    transform: translateY(28px);
  }

  to {
    opacity: 1;
    transform: translateY(0);
  }
}

@media (max-width: 390px) {
  .integrated-project-section {
    padding: 70px 20px 40px;
  }

  .integrated-project-section > .school-guide-button {
    right: 20px;
    top: 18px;
  }

  .integrated-project-content > h2 {
    font-size: clamp(18px, 5.5vw, 22px);
  }

  .project-interview-section,
  .project-route-showcase,
  .project-advantages,
  .project-support-timeline {
    margin-top: 30px;
  }

  .project-route-poster strong {
    font-size: clamp(15px, 4.25vw, 18px);
  }

  .project-route-copy {
    padding-inline: 9px;
  }
}

@media (max-width: 340px) {
  .integrated-project-content > h2 span:last-child {
    font-size: 17px;
  }

  .project-route-posters {
    grid-template-columns: 1fr;
  }

  .project-route-image {
    aspect-ratio: 16 / 10;
  }

  .project-route-poster b,
  .project-route-poster small {
    min-height: 0;
  }
}

@media (prefers-reduced-motion: reduce) {
  .project-route-poster,
  .project-route-image img,
  .project-accordion-panel,
  .project-timeline-panel,
  .project-timeline-toggle > i::before,
  .project-timeline-toggle > i::after,
  .project-route-drawer,
  .project-schedule-drawer {
    animation: none;
    scroll-behavior: auto;
    transition: none;
  }
}

/* Third screen · strict one-screen summary layout · 2026-07-17 */
.integrated-project-section {
  --project-frame-image: url("assets/images/reserve-button-frame.png");
  width: 100%;
  height: var(--preview-screen-height, 100svh);
  min-height: var(--preview-screen-height, 100svh);
  max-height: var(--preview-screen-height, 100svh);
  overflow: clip;
  padding:
    var(--preview-safe-top, max(47px, env(safe-area-inset-top)))
    var(--preview-safe-right, max(16px, env(safe-area-inset-right)))
    var(--preview-safe-bottom, max(34px, env(safe-area-inset-bottom)))
    var(--preview-safe-left, max(16px, env(safe-area-inset-left)));
}

.integrated-project-section > .school-guide-button {
  right: calc(var(--preview-safe-right, max(16px, env(safe-area-inset-right))) + 2px);
  top: calc(var(--preview-safe-top, max(47px, env(safe-area-inset-top))) + 1px);
}

.integrated-project-content {
  display: grid;
  width: 100%;
  max-width: 470px;
  height: 100%;
  min-height: 0;
  margin-inline: auto;
  grid-template-rows:
    auto
    minmax(108px, 1.75fr)
    minmax(118px, 1.65fr)
    minmax(138px, 1.15fr)
    auto;
  gap: clamp(5px, .65svh, 8px);
  align-content: stretch;
}

.project-intro {
  min-width: 0;
}

.project-intro > .eyebrow {
  margin: 0 0 3px;
  padding-right: 108px;
  font-size: clamp(9px, 2.3vw, 12px);
  line-height: 1.3;
  letter-spacing: .08em;
}

.project-intro > h2 {
  margin: 0;
  color: var(--ink-deep);
  font-size: clamp(19px, 5.25vw, 27px);
  line-height: 1.13;
}

.project-intro > h2 span {
  display: block;
  white-space: nowrap;
}

.project-intro > .section-lead {
  display: -webkit-box;
  overflow: hidden;
  max-width: none;
  margin: 5px 0 0;
  color: #50615b;
  font-size: clamp(9.5px, 2.55vw, 12.5px);
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.project-interview-section,
.project-route-showcase,
.project-overview-switcher,
.project-planning-cta {
  min-width: 0;
  min-height: 0;
  margin-top: 0;
}

.project-interview-card {
  display: grid;
  width: 100%;
  height: 100%;
  min-height: 0;
  margin: 0;
  padding: 4px;
  grid-template-columns: minmax(0, 1fr) 18px;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 5px 8px;
  align-items: center;
  border: 7px solid transparent;
  border-radius: 2px;
  border-image: var(--project-frame-image) 90 110 fill / 7px / 0 stretch;
  background: rgba(255, 250, 240, .88);
  box-shadow: 0 8px 18px rgba(47, 43, 33, .12);
}

.project-interview-poster {
  display: block;
  grid-column: 1 / -1;
  grid-row: 2;
  width: 100%;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  border: 1px solid rgba(139, 113, 72, .2);
  border-radius: 1px;
}

.project-interview-poster img {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.project-interview-poster .video-play {
  width: clamp(36px, 9.5vw, 48px);
  height: clamp(36px, 9.5vw, 48px);
}

.project-interview-copy {
  display: block;
  grid-column: 1;
  grid-row: 1;
  min-width: 0;
  padding: 2px 5px 0;
}

.project-interview-copy small,
.project-interview-copy strong {
  display: block;
}

.project-interview-copy small {
  overflow: hidden;
  color: var(--gold-dark);
  font: 800 clamp(8px, 2.15vw, 10px)/1.35 "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .08em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-interview-copy strong {
  display: -webkit-box;
  overflow: hidden;
  margin-top: 2px;
  color: var(--ink-deep);
  font-size: clamp(13px, 3.35vw, 16px);
  line-height: 1.22;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.project-interview-card > em {
  grid-column: 2;
  grid-row: 1;
  color: var(--gold-dark);
  font: 700 24px/1 Georgia, serif;
  text-align: center;
}

.project-route-showcase {
  display: grid;
  height: 100%;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 5px;
}

.project-compact-heading {
  display: flex;
  min-width: 0;
  align-items: end;
  justify-content: space-between;
  gap: 8px;
}

.project-compact-heading > span {
  display: block;
  min-width: 0;
}

.project-compact-heading small,
.project-compact-heading strong {
  display: block;
}

.project-compact-heading small {
  color: var(--gold-dark);
  font: 800 clamp(8px, 2vw, 10px)/1.2 "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .08em;
}

.project-compact-heading strong {
  overflow: hidden;
  margin-top: 2px;
  color: var(--ink-deep);
  font-size: clamp(12px, 3.2vw, 16px);
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-compact-heading > em {
  flex: 0 0 auto;
  color: #6a756f;
  font: 600 clamp(8px, 1.9vw, 9px)/1.3 "PingFang SC", "Microsoft YaHei", sans-serif;
  font-style: normal;
  white-space: nowrap;
}

.project-route-posters {
  display: grid;
  min-height: 0;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
}

.project-route-poster {
  position: relative;
  display: block;
  min-width: 0;
  min-height: 0;
  padding: 0;
  overflow: hidden;
  border: 7px solid transparent;
  border-radius: 2px;
  border-image: var(--project-frame-image) 90 110 fill / 7px / 0 stretch;
  background: #c9cec2;
  box-shadow: 0 7px 16px rgba(47, 43, 33, .1);
  isolation: isolate;
}

.project-route-image {
  position: absolute;
  z-index: 0;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 0;
  aspect-ratio: auto;
  border: 0;
}

.project-route-image::after {
  background:
    linear-gradient(180deg, rgba(11, 38, 31, .02) 0%, rgba(11, 38, 31, .12) 48%, rgba(8, 31, 25, .55) 100%);
}

.project-route-image img {
  filter: saturate(.78) sepia(.06) contrast(.96);
  transform: scale(1.015);
}

.project-route-poster.route-a .project-route-image img {
  object-position: center 48%;
}

.project-route-poster.route-b .project-route-image img {
  object-position: center 44%;
}

.project-route-copy {
  position: absolute;
  z-index: 2;
  right: 6px;
  bottom: 6px;
  left: 6px;
  display: flex;
  min-width: 0;
  height: 52px;
  min-height: 52px;
  padding: 8px 31px 8px 9px;
  justify-content: flex-end;
  border: 1px solid rgba(207, 164, 91, .66);
  border-radius: 1px;
  color: #fffaf0;
  background:
    linear-gradient(90deg, rgba(14, 58, 48, .96), rgba(19, 67, 56, .88) 70%, rgba(14, 54, 45, .82));
  -webkit-backdrop-filter: blur(3px) saturate(.8);
  backdrop-filter: blur(3px) saturate(.8);
  box-shadow: 0 -7px 20px rgba(5, 25, 20, .14);
}

.project-route-poster strong {
  overflow: hidden;
  color: #fffaf0;
  font-size: clamp(13px, 3.35vw, 16px);
  line-height: 1.2;
  text-overflow: ellipsis;
  text-shadow: 0 1px 8px rgba(2, 20, 15, .42);
  white-space: nowrap;
}

.project-route-poster small {
  display: none;
}

.project-route-poster b {
  display: -webkit-box;
  overflow: hidden;
  min-height: 0;
  margin-top: 3px;
  color: rgba(255, 250, 240, .82);
  font: 600 clamp(7.5px, 1.9vw, 9px)/1.3 "PingFang SC", "Microsoft YaHei", sans-serif;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 1;
}

.project-route-poster em {
  position: absolute;
  right: 9px;
  top: 50%;
  min-height: 0;
  margin: 0;
  padding: 0;
  border: 0;
  color: transparent;
  font-size: 0;
  transform: translateY(-50%);
}

.project-route-poster em::after {
  content: "›";
  color: #f1d29b;
  font: 700 20px/1 Georgia, serif;
  text-shadow: 0 1px 8px rgba(2, 20, 15, .52);
}

.project-overview-switcher {
  display: grid;
  height: 100%;
  overflow: hidden;
  grid-template-rows: 34px minmax(0, 1fr);
  border: 7px solid transparent;
  border-radius: 2px;
  border-image: var(--project-frame-image) 90 110 fill / 7px / 0 stretch;
  background: rgba(255, 250, 240, .8);
  box-shadow: 0 9px 20px rgba(47, 43, 33, .11);
}

.project-overview-tabs {
  display: grid;
  grid-template-columns: repeat(2, 1fr);
  padding: 0;
  border-bottom: 1px solid rgba(139, 113, 72, .28);
  background: rgba(255, 250, 240, .32);
}

.project-overview-tabs button {
  position: relative;
  min-width: 0;
  min-height: 34px;
  border: 0;
  border-radius: 0;
  color: #64716b;
  background: transparent;
  font-size: clamp(11px, 2.8vw, 13px);
  font-weight: 800;
  cursor: pointer;
  transition: color .2s ease, background .2s ease, box-shadow .2s ease;
}

.project-overview-tabs button + button {
  border-left: 1px solid rgba(139, 113, 72, .2);
}

.project-overview-tabs button[aria-selected="true"] {
  color: var(--ink-deep);
  background: rgba(230, 235, 222, .28);
  box-shadow: inset 0 -2px 0 rgba(151, 117, 69, .72);
}

.project-overview-panel {
  min-width: 0;
  min-height: 0;
  padding: 0;
  animation: project-panel-in .2s ease both;
}

.project-overview-panel[hidden] {
  display: none;
}

.project-advantage-grid {
  display: grid;
  width: 100%;
  height: 100%;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(0, 1fr));
  gap: 0;
}

.project-advantage-grid button {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 44px;
  padding: 6px 9px 6px 13px;
  grid-template-columns: minmax(0, 1fr) 12px;
  gap: 5px;
  align-items: center;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  color: var(--ink-deep);
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: background .18s ease;
}

.project-advantage-grid button::before {
  content: "";
  position: absolute;
  left: 7px;
  top: 28%;
  width: 2px;
  height: 44%;
  background: linear-gradient(rgba(177, 138, 80, .38), rgba(151, 117, 69, .88), rgba(177, 138, 80, .38));
}

.project-advantage-grid button:nth-child(odd) {
  border-right: 1px solid rgba(139, 113, 72, .22);
}

.project-advantage-grid button:nth-child(-n + 2) {
  border-bottom: 1px solid rgba(139, 113, 72, .22);
}

.project-advantage-grid button:active {
  background: rgba(177, 138, 80, .08);
}

.project-advantage-grid button > span,
.project-advantage-grid strong,
.project-advantage-grid small {
  display: block;
  min-width: 0;
}

.project-advantage-grid strong {
  color: #173f37;
  font-size: clamp(13px, 3.2vw, 16px);
  line-height: 1.18;
  font-weight: 900;
}

.project-advantage-grid small {
  overflow: hidden;
  margin-top: 2px;
  color: #65736d;
  font: 600 clamp(7.5px, 1.9vw, 9.5px)/1.25 "PingFang SC", "Microsoft YaHei", sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-advantage-grid button > i {
  color: var(--gold-dark);
  font: 700 17px/1 Georgia, serif;
  font-style: normal;
}

#projectOverviewSupport {
  display: grid;
  grid-template-rows: minmax(0, 1fr) 30px;
  gap: 0;
}

#projectOverviewSupport[hidden] {
  display: none;
}

.project-mini-timeline {
  position: relative;
  display: grid;
  min-height: 0;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0;
}

.project-mini-timeline::before {
  content: none;
}

.project-mini-timeline > button {
  position: relative;
  z-index: 1;
  display: flex;
  min-width: 0;
  min-height: 44px;
  padding: 3px 1px 2px;
  align-items: center;
  flex-direction: column;
  justify-content: center;
  border: 0;
  color: var(--ink-deep);
  background: transparent;
  cursor: pointer;
  transition: background .18s ease;
}

.project-mini-timeline > button + button {
  border-left: 1px solid rgba(139, 113, 72, .2);
}

.project-mini-timeline > button:active {
  background: rgba(177, 138, 80, .08);
}

.project-mini-calendar {
  position: relative;
  display: block;
  width: clamp(30px, 8vw, 36px);
  overflow: hidden;
  border: 1px solid rgba(123, 89, 44, .42);
  border-radius: 1px;
  background: rgba(255, 250, 240, .98);
  box-shadow: none;
}

.project-mini-calendar small,
.project-mini-calendar b {
  display: grid;
  place-items: center;
}

.project-mini-calendar small {
  height: 11px;
  color: #fffaf0;
  background: var(--gold-dark);
  font-size: 5.5px;
  line-height: 1;
}

.project-mini-calendar b {
  height: 18px;
  color: var(--ink-deep);
  font: 800 6px/1 "PingFang SC", "Microsoft YaHei", sans-serif;
}

.project-mini-timeline > button > strong {
  display: -webkit-box;
  overflow: hidden;
  margin-top: 2px;
  font-size: clamp(7px, 1.9vw, 9px);
  line-height: 1.2;
  text-align: center;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.project-overview-switcher .project-schedule-button {
  min-height: 30px;
  margin: 0;
  padding: 0 8px;
  border: 0;
  border-top: 1px solid rgba(139, 113, 72, .24);
  border-radius: 0;
  background: rgba(230, 235, 222, .25);
  box-shadow: none;
  font-size: clamp(9px, 2.3vw, 11px);
}

.project-planning-cta {
  display: grid;
  min-height: 0;
  margin: 0;
  padding: 8px 10px;
  grid-template-columns: 1fr;
  gap: 4px;
  align-items: stretch;
  border: 7px solid transparent;
  border-radius: 2px;
  border-image: var(--project-frame-image) 90 110 fill / 7px / 0 stretch;
  background: rgba(255, 250, 240, .84);
  box-shadow: 0 8px 18px rgba(47, 43, 33, .11);
  text-align: center;
}

.project-planning-cta > h3 {
  font-size: clamp(13px, 3.2vw, 16px);
  line-height: 1.25;
}

.project-planning-cta > p {
  display: -webkit-box;
  overflow: hidden;
  margin: 0;
  color: #56665f;
  font-size: clamp(8px, 2vw, 10px);
  line-height: 1.35;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.project-planning-cta > small {
  display: block;
  margin: 0;
  color: #777a70;
  font-size: clamp(7px, 1.8vw, 9px);
  line-height: 1.3;
}

.project-planning-cta .project-assessment-button {
  width: 100%;
  min-height: 42px;
  margin: 0;
  padding: 8px 10px;
  border-radius: 1px;
  box-shadow: none;
  font-size: clamp(10px, 2.65vw, 13px);
}

.project-info-backdrop {
  z-index: 50;
  align-items: flex-end;
  padding: 14px 14px max(14px, env(safe-area-inset-bottom));
  background: rgba(12, 34, 29, .58);
}

.project-info-drawer {
  position: relative;
  width: min(100%, 492px);
  max-height: min(76svh, 620px);
  margin: 0 auto;
  overflow: hidden;
  border: 1px solid rgba(151, 117, 69, .42);
  border-radius: 10px 10px 4px 4px;
  color: var(--ink-deep);
  background:
    linear-gradient(rgba(255, 250, 240, .95), rgba(255, 250, 240, .98)),
    url("assets/images/review-hero-bg.jpg") center / cover no-repeat;
  box-shadow: 0 -18px 50px rgba(10, 30, 25, .3);
  animation: project-drawer-in .28s ease both;
}

.project-info-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 14px;
  padding: 18px 18px 14px;
  border-bottom: 1px solid rgba(151, 117, 69, .22);
}

.project-info-header .project-module-eyebrow {
  margin-bottom: 3px;
}

.project-info-header h2 {
  margin: 0;
  font-size: 22px;
}

.project-info-header .modal-close {
  position: static;
  flex: 0 0 auto;
}

.project-info-media {
  position: relative;
  height: clamp(128px, 23svh, 180px);
  margin: 0 18px;
  overflow: hidden;
  border: 1px solid rgba(151, 117, 69, .38);
  border-radius: 3px;
  background: #d9ddcf;
  box-shadow: inset 0 0 0 4px rgba(255, 250, 240, .52);
}

.project-info-media[hidden] {
  display: none;
}

.project-info-media img {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  filter: saturate(.84) contrast(.96);
}

.project-info-media figcaption {
  position: absolute;
  right: 8px;
  bottom: 8px;
  max-width: calc(100% - 16px);
  padding: 4px 7px;
  color: #fffaf0;
  background: rgba(13, 52, 43, .78);
  font-size: 9px;
  line-height: 1.25;
  letter-spacing: .03em;
}

.project-info-body {
  padding: 16px 18px max(20px, env(safe-area-inset-bottom));
}

.project-info-body > p {
  margin: 0;
  color: #4b5e57;
  font-size: 13px;
  line-height: 1.8;
}

.project-info-tags {
  display: flex;
  flex-wrap: wrap;
  gap: 6px;
  margin-top: 14px;
}

.project-info-tags span {
  padding: 5px 8px;
  border: 1px solid rgba(36, 76, 69, .14);
  border-radius: 2px;
  color: #315047;
  background: rgba(230, 235, 222, .54);
  font-size: 10px;
}

/* Unified modal feedback: make every opened layer read clearly as an active dialog. */
.modal-backdrop:not([hidden]) {
  background:
    radial-gradient(circle at 50% 72%, rgba(177, 138, 80, .12), transparent 38%),
    rgba(8, 29, 24, .72);
  -webkit-backdrop-filter: blur(4px) saturate(.72);
  backdrop-filter: blur(4px) saturate(.72);
  animation: modal-backdrop-in .2s ease-out both;
}

.modal-backdrop:not([hidden]) > [role="dialog"] {
  transform-origin: center;
  animation: modal-pop-in .3s cubic-bezier(.2, .8, .2, 1) both;
}

.project-schedule-backdrop:not([hidden]) > [role="dialog"],
.project-info-backdrop.is-detail-sheet:not([hidden]) > [role="dialog"] {
  transform-origin: center bottom;
  animation: modal-sheet-rise .36s cubic-bezier(.18, .88, .24, 1) both;
}

.project-interview-backdrop:not([hidden]) {
  background: rgba(5, 20, 16, .82);
}

.project-route-drawer,
.project-schedule-drawer,
.project-info-drawer {
  border-color: rgba(177, 138, 80, .58);
  border-radius: 16px 16px 4px 4px;
  box-shadow:
    0 -26px 72px rgba(4, 20, 16, .44),
    0 0 0 1px rgba(255, 250, 240, .3);
}

.project-route-drawer::before,
.project-schedule-drawer::before,
.project-info-drawer::before {
  content: "";
  position: absolute;
  z-index: 5;
  left: 50%;
  top: 8px;
  width: 46px;
  height: 4px;
  border-radius: 999px;
  background: rgba(36, 76, 69, .36);
  box-shadow: 0 1px 0 rgba(255, 255, 255, .52);
  transform: translateX(-50%);
  pointer-events: none;
}

.project-schedule-header,
.project-info-header {
  padding-top: 27px;
}

/* Route details are long, so use a centered large focus card with its own scroll area. */
.project-route-backdrop {
  place-items: center;
  align-items: center;
  padding: max(26px, env(safe-area-inset-top)) 18px max(26px, env(safe-area-inset-bottom));
  background:
    radial-gradient(circle at 50% 46%, rgba(207, 164, 91, .18), transparent 42%),
    rgba(5, 25, 20, .76);
}

.project-route-backdrop:not([hidden]) > [role="dialog"] {
  transform-origin: center;
  animation: project-route-focus-in .34s cubic-bezier(.18, .88, .24, 1) both;
}

.project-route-drawer {
  display: flex;
  width: min(90vw, 410px);
  max-height: min(82svh, 700px);
  padding: 0;
  overflow: hidden;
  flex-direction: column;
  border-color: rgba(177, 138, 80, .7);
  border-radius: 12px;
  background:
    linear-gradient(rgba(255, 251, 242, .965), rgba(255, 250, 240, .99)),
    url("assets/images/review-hero-bg.jpg") center / cover no-repeat;
  box-shadow:
    0 30px 82px rgba(2, 18, 14, .54),
    0 0 0 1px rgba(255, 250, 240, .46),
    inset 0 3px 0 rgba(207, 164, 91, .46);
}

.project-route-drawer::before {
  display: none;
}

.project-route-drawer > .modal-close {
  position: absolute;
  z-index: 4;
  top: 17px;
  right: 18px;
}

.project-route-scroll {
  overflow-x: hidden;
  overflow-y: auto;
  padding: 28px 24px 24px;
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(36, 76, 69, .3) transparent;
}

.project-route-detail h2 {
  margin: 0 58px 15px 0;
  padding-bottom: 13px;
  border-bottom: 0;
  font-size: clamp(24px, 6.5vw, 28px);
  line-height: 1.25;
  letter-spacing: .03em;
}

.project-route-detail h2::after {
  content: "";
  display: block;
  width: 54px;
  height: 2px;
  margin-top: 12px;
  background: linear-gradient(90deg, #b18a50, rgba(177, 138, 80, .12));
}

.project-route-detail h3 {
  position: relative;
  margin: 16px 0 7px;
  padding-left: 10px;
  font-size: 14px;
}

.project-route-detail h3::before {
  content: "";
  position: absolute;
  left: 0;
  top: .3em;
  width: 2px;
  height: 1em;
  background: #b18a50;
}

.project-route-detail-lead {
  font-size: 13px;
  line-height: 1.8;
}

.project-route-fit {
  gap: 6px;
}

.project-route-fit li {
  padding: 8px 10px 8px 25px;
  background: rgba(230, 235, 222, .58);
}

.project-route-flow {
  padding: 12px 10px;
  background: rgba(255, 250, 240, .44);
}

.project-route-actions {
  position: relative;
  z-index: 3;
  flex: 0 0 auto;
  padding: 12px 24px 18px;
  border-top: 1px solid rgba(151, 117, 69, .2);
  background: rgba(255, 250, 240, .94);
  box-shadow: 0 -12px 26px rgba(255, 250, 240, .96);
}

.project-route-actions .project-drawer-consult {
  min-height: 50px;
  margin: 0;
  border-color: rgba(255, 250, 240, .2);
  color: var(--paper-light);
  background: var(--ink-deep);
  box-shadow: 0 8px 18px rgba(8, 35, 29, .18);
}

.project-route-actions .project-drawer-consult[hidden] {
  display: none;
}

.project-route-disclaimer {
  margin: 14px 0 0;
  color: #756f63;
  font-size: 9px;
  line-height: 1.55;
}

.project-route-poster.is-dialog-source {
  z-index: 1;
  background: rgba(207, 164, 91, .14);
  box-shadow: inset 0 0 0 2px rgba(177, 138, 80, .58);
  animation: project-dialog-source-pulse .42s ease-out both;
}

/* Short advantage details use a centered focus card; longer support details stay as sheets. */
.project-info-backdrop.is-focus-card {
  place-items: center;
  align-items: center;
  padding: max(24px, env(safe-area-inset-top)) 20px max(24px, env(safe-area-inset-bottom));
  background:
    radial-gradient(circle at 50% 46%, rgba(207, 164, 91, .2), transparent 36%),
    rgba(5, 25, 20, .76);
}

.project-info-backdrop.is-focus-card:not([hidden]) > [role="dialog"] {
  transform-origin: center;
  animation: project-focus-card-in .32s cubic-bezier(.18, .88, .24, 1) both;
}

.project-info-backdrop.is-focus-card .project-info-drawer {
  width: min(88vw, 382px);
  max-height: min(62svh, 480px);
  border-color: rgba(177, 138, 80, .72);
  border-radius: 8px;
  background:
    linear-gradient(rgba(255, 251, 242, .96), rgba(255, 250, 240, .985)),
    url("assets/images/review-hero-bg.jpg") center / cover no-repeat;
  box-shadow:
    0 28px 78px rgba(2, 18, 14, .52),
    0 0 0 1px rgba(255, 250, 240, .46),
    inset 0 3px 0 rgba(207, 164, 91, .44);
}

.project-info-backdrop.is-focus-card.has-media .project-info-drawer {
  width: min(90vw, 398px);
  max-height: min(78svh, 640px);
}

.project-info-backdrop.is-focus-card .project-info-drawer::before {
  display: none;
}

.project-info-backdrop.is-focus-card .project-info-header {
  position: relative;
  display: block;
  padding: 26px 72px 15px 24px;
  border-bottom: 0;
}

.project-info-backdrop.is-focus-card .project-info-header::after {
  content: "";
  display: block;
  width: 52px;
  height: 2px;
  margin-top: 12px;
  background: linear-gradient(90deg, #b18a50, rgba(177, 138, 80, .12));
}

.project-info-backdrop.is-focus-card .project-info-header h2 {
  font-size: clamp(24px, 6.4vw, 28px);
  line-height: 1.24;
  letter-spacing: .04em;
}

.project-info-backdrop.is-focus-card .project-info-header .modal-close {
  position: absolute;
  top: 17px;
  right: 18px;
}

.project-info-backdrop.is-focus-card.has-media .project-info-header {
  padding-bottom: 13px;
}

.project-info-backdrop.is-focus-card.has-media .project-info-media {
  margin: 0 24px;
}

.project-info-backdrop.is-focus-card .project-info-body {
  overflow-y: auto;
  padding: 3px 24px 26px;
}

.project-info-backdrop.is-focus-card.has-media .project-info-body {
  padding-top: 14px;
}

.project-info-backdrop.is-focus-card .project-info-body > p {
  color: #40574f;
  font-size: 14px;
  line-height: 1.9;
}

.project-info-backdrop.is-focus-card .project-info-tags {
  gap: 7px;
  margin-top: 18px;
}

.project-info-backdrop.is-focus-card .project-info-tags span {
  padding: 6px 9px;
  border-color: rgba(36, 76, 69, .18);
  background: rgba(230, 235, 222, .7);
  font-size: 11px;
}

.project-advantage-grid button.is-dialog-source {
  z-index: 1;
  background: rgba(207, 164, 91, .14);
  box-shadow: inset 0 0 0 2px rgba(177, 138, 80, .58);
  animation: project-dialog-source-pulse .42s ease-out both;
}

.modal-close {
  width: 38px;
  height: 38px;
  border: 1px solid rgba(255, 250, 240, .62);
  border-radius: 50%;
  color: #fffaf0;
  background: #18483e;
  box-shadow:
    0 7px 18px rgba(12, 42, 35, .22),
    0 0 0 1px rgba(36, 76, 69, .2);
  font-size: 23px;
  cursor: pointer;
  transition: transform .16s ease, background .16s ease, box-shadow .16s ease;
}

.modal-close:active {
  background: #0f392f;
  transform: scale(.94);
}

.modal-close:focus-visible {
  outline: 3px solid rgba(207, 164, 91, .9);
  outline-offset: 2px;
}

@keyframes modal-backdrop-in {
  from { opacity: 0; }
  to { opacity: 1; }
}

@keyframes modal-pop-in {
  from {
    opacity: 0;
    transform: translateY(18px) scale(.94);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes modal-sheet-rise {
  from {
    opacity: .35;
    transform: translateY(88px) scale(.985);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes project-focus-card-in {
  from {
    opacity: 0;
    transform: translateY(22px) scale(.9);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes project-route-focus-in {
  from {
    opacity: 0;
    transform: translateY(24px) scale(.93);
  }

  to {
    opacity: 1;
    transform: translateY(0) scale(1);
  }
}

@keyframes project-dialog-source-pulse {
  0% { transform: scale(1); }
  52% { transform: scale(.975); }
  100% { transform: scale(1); }
}

.project-interview-card:focus-visible,
.project-route-poster:focus-visible,
.project-overview-tabs button:focus-visible,
.project-advantage-grid button:focus-visible,
.project-mini-timeline button:focus-visible,
.project-schedule-button:focus-visible,
.project-assessment-button:focus-visible {
  outline: 3px solid rgba(177, 138, 80, .58);
  outline-offset: 2px;
}

/* Shared inline-video component: every screen uses the second-screen play pattern. */
.unified-video-card {
  position: relative;
  overflow: hidden;
  isolation: isolate;
}

.unified-video-card > .unified-video-player {
  display: block;
  width: 100%;
  border: 0;
  background: #0b100e;
  object-fit: contain;
}

.unified-video-card .unified-video-inline-play {
  position: absolute;
  z-index: 4;
  inset: 12px;
  border: 0;
  background: transparent;
  cursor: pointer;
}

.unified-video-card.is-playing .unified-video-inline-play,
.unified-video-card.is-unavailable .unified-video-inline-play,
.unified-video-card.is-unavailable .school-video-fullscreen-button {
  display: none;
}

.unified-video-card .video-play {
  position: absolute;
  z-index: 4;
  left: 50%;
  top: 44%;
  width: 66px;
  height: 66px;
  border: 1px solid rgba(139, 113, 72, .2);
  border-radius: 50%;
  background: rgba(255, 250, 240, .92);
  box-shadow: 0 12px 25px rgba(52, 48, 38, .22), 0 0 0 7px rgba(255, 250, 240, .12);
  transform: translate(-50%, -50%);
}

.unified-video-card .video-play::before {
  left: 27px;
  top: 20px;
  width: 19px;
  height: 25px;
  background: #53685b;
}

.project-interview-card {
  grid-template-columns: minmax(0, 1fr);
}

.project-interview-poster.unified-video-card::after {
  content: none;
}

.project-interview-poster.unified-video-card > .unified-video-player {
  height: 100%;
  min-height: 0;
  aspect-ratio: auto;
}

.project-interview-poster .project-media-pending {
  position: absolute;
  z-index: 3;
  inset: 0;
  display: grid;
  place-items: center;
  max-width: none;
  padding: 16px;
  text-align: center;
}

.project-interview-poster .school-video-fullscreen-button {
  right: 10px;
  bottom: 10px;
}

.unified-video-inline-play:focus-visible,
.school-video-fullscreen-button:focus-visible,
.school-video-return-button:focus-visible {
  outline: 3px solid rgba(177, 138, 80, .72);
  outline-offset: 2px;
}

/* Fourth screen · balanced directions, compact video and swipe gallery · 2026-07-21 */
.majors-section {
  --major-frame-image: url("assets/images/reserve-button-frame.png");
  width: 100%;
  height: var(--preview-screen-height, 100svh);
  min-height: var(--preview-screen-height, 100svh);
  max-height: var(--preview-screen-height, 100svh);
  overflow: clip;
  padding:
    var(--preview-safe-top, max(47px, env(safe-area-inset-top)))
    var(--preview-safe-right, max(16px, env(safe-area-inset-right)))
    var(--preview-safe-bottom, max(34px, env(safe-area-inset-bottom)))
    var(--preview-safe-left, max(16px, env(safe-area-inset-left)));
  background:
    linear-gradient(180deg, rgba(255, 250, 240, .82), rgba(247, 242, 230, .92)),
    url("assets/images/review-hero-bg.jpg") center top / cover no-repeat;
}

.majors-section > .school-guide-button {
  right: calc(var(--preview-safe-right, max(16px, env(safe-area-inset-right))) + 2px);
  top: calc(var(--preview-safe-top, max(47px, env(safe-area-inset-top))) + 1px);
}

.majors-screen {
  display: grid;
  width: 100%;
  max-width: 470px;
  height: 100%;
  min-height: 0;
  margin-inline: auto;
  grid-template-rows:
    auto
    auto
    auto
    auto
    minmax(0, 1fr)
    auto;
  gap: clamp(5px, .72svh, 8px);
  align-content: stretch;
}

.majors-intro {
  min-width: 0;
  padding-top: 40px;
}

.majors-intro > .eyebrow {
  margin: 0 0 3px;
  padding-right: 108px;
  font-size: clamp(9px, 2.3vw, 12px);
  line-height: 1.3;
  letter-spacing: .08em;
}

.majors-intro > h2 {
  max-width: 445px;
  margin: 0;
  color: var(--ink-deep);
  font-size: clamp(16.5px, 3.65vw, 19px);
  line-height: 1.2;
  letter-spacing: .01em;
}

.majors-intro > h2 span {
  display: block;
  white-space: nowrap;
}

.majors-intro > h2 span:first-child {
  padding-right: 0;
}

.majors-intro > .section-lead {
  display: -webkit-box;
  overflow: hidden;
  margin: 5px 0 0;
  color: #53635d;
  font-size: clamp(9px, 2.4vw, 12px);
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.major-direction-overview,
.major-video-showcase,
.major-special-focus,
.major-gallery-module,
.major-actions {
  min-width: 0;
  min-height: 0;
}

.major-actions {
  align-self: end;
}

.major-aigc-showcase {
  display: grid;
  min-width: 0;
  min-height: 0;
  padding: 7px 8px 8px;
  align-content: start;
  gap: 6px;
  border: 1px solid rgba(166, 127, 69, .34);
  background:
    linear-gradient(135deg, rgba(255, 252, 243, .9), rgba(246, 239, 222, .78)),
    radial-gradient(circle at 90% 0, rgba(209, 176, 111, .18), transparent 36%);
  box-shadow: inset 0 0 0 2px rgba(255, 255, 255, .48), 0 5px 14px rgba(43, 52, 45, .07);
}

.major-aigc-heading p,
.major-aigc-heading h3 {
  margin: 0;
}

.major-aigc-heading {
  position: relative;
  padding-right: 68px;
}

.major-aigc-heading p {
  color: var(--gold-dark);
  font: 800 clamp(7px, 1.8vw, 9px)/1.2 "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .12em;
}

.major-aigc-heading h3 {
  margin-top: 2px;
  color: var(--ink-deep);
  font-size: clamp(11px, 2.8vw, 14px);
  line-height: 1.2;
  letter-spacing: .025em;
}

.major-aigc-heading > span {
  position: absolute;
  right: 0;
  bottom: 1px;
  color: #66736d;
  font: 700 clamp(7px, 1.8vw, 9px)/1.2 "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .03em;
  white-space: nowrap;
}

.major-aigc-grid {
  display: flex;
  min-width: 0;
  overflow-x: auto;
  overflow-y: hidden;
  gap: 8px;
  padding: 1px 24px 5px 1px;
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  overscroll-behavior-inline: contain;
  scrollbar-width: none;
}

.major-aigc-grid::-webkit-scrollbar {
  display: none;
}

.major-aigc-item {
  flex: 0 0 calc(92% - 4px);
  min-width: 0;
  padding: 5px 5px 6px;
  border: 1px solid rgba(142, 111, 67, .28);
  background: rgba(255, 252, 244, .88);
  box-shadow: 0 4px 10px rgba(35, 48, 40, .1);
  scroll-snap-align: start;
  scroll-snap-stop: always;
}

.major-aigc-card {
  --unified-play-size: clamp(27px, 7vw, 34px);
  width: 100%;
  aspect-ratio: 16 / 9;
  border: 1px solid rgba(219, 188, 127, .62);
  background: #10241f;
}

.major-aigc-card > .unified-video-player {
  width: 100%;
  height: 100%;
  object-fit: cover;
}

.major-aigc-card .unified-video-inline-play {
  inset: 0;
}

.major-aigc-item > p {
  overflow: hidden;
  margin: 4px 1px 0;
  color: #314b42;
  font: 800 clamp(8px, 2.15vw, 10.5px)/1.25 "PingFang SC", "Microsoft YaHei", sans-serif;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.major-direction-overview,
.major-video-showcase {
  display: grid;
  height: 100%;
  gap: 5px;
}

.major-direction-overview {
  grid-template-rows: auto minmax(0, 1fr);
}

.major-compact-heading,
.major-video-heading {
  display: flex;
  min-width: 0;
  align-items: end;
  justify-content: space-between;
  gap: 8px;
}

.major-compact-heading > span,
.major-video-heading > span,
.major-compact-heading small,
.major-compact-heading strong,
.major-video-heading small,
.major-video-heading strong {
  display: block;
  min-width: 0;
}

.major-compact-heading small,
.major-video-heading small {
  color: var(--gold-dark);
  font: 800 clamp(8px, 2vw, 10px)/1.2 "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .08em;
}

.major-compact-heading strong,
.major-video-heading strong {
  overflow: hidden;
  margin-top: 2px;
  color: var(--ink-deep);
  font-size: clamp(13px, 3.2vw, 16px);
  line-height: 1.22;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.major-compact-heading > em,
.major-video-heading > em {
  flex: 0 0 auto;
  color: #69756f;
  font: 600 clamp(8px, 1.9vw, 9px)/1.3 "PingFang SC", "Microsoft YaHei", sans-serif;
  font-style: normal;
  white-space: nowrap;
}

.major-direction-grid {
  display: grid;
  height: 100%;
  min-height: 0;
  overflow: hidden;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  grid-template-rows: repeat(2, minmax(52px, 1fr));
  border: 7px solid transparent;
  border-radius: 2px;
  border-image: var(--major-frame-image) 90 110 fill / 7px / 0 stretch;
  background: rgba(255, 250, 240, .8);
  box-shadow: 0 7px 17px rgba(47, 43, 33, .09);
}

.major-direction-grid button {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 54px;
  padding: 8px 28px 8px 11px;
  align-content: center;
  border: 0;
  border-radius: 0;
  color: var(--ink-deep);
  background: transparent;
  text-align: left;
  cursor: pointer;
  transition: background .18s ease, color .18s ease;
}

.major-direction-grid button:nth-child(odd) {
  border-right: 1px solid rgba(139, 113, 72, .22);
}

.major-direction-grid button:nth-child(-n + 2) {
  border-bottom: 1px solid rgba(139, 113, 72, .22);
}

.major-direction-grid button::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 24%;
  width: 2px;
  height: 52%;
  background: linear-gradient(rgba(177, 138, 80, .25), rgba(151, 117, 69, .86), rgba(177, 138, 80, .25));
}

.major-direction-grid button:active {
  background: rgba(177, 138, 80, .08);
}

.major-direction-grid strong {
  display: -webkit-box;
  overflow: hidden;
  white-space: normal;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.major-direction-grid strong {
  color: #173f37;
  font-size: clamp(10.5px, 2.7vw, 13.5px);
  line-height: 1.18;
  font-weight: 900;
}

.major-direction-grid span {
  overflow: hidden;
  margin-top: 3px;
  color: #65736d;
  font: 600 clamp(7.5px, 1.9vw, 9.5px)/1.25 "PingFang SC", "Microsoft YaHei", sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.major-direction-grid em {
  position: absolute;
  right: 10px;
  top: 50%;
  color: var(--gold-dark);
  font: 700 20px/1 Georgia, serif;
  font-style: normal;
  transform: translateY(-50%);
}

.major-video-showcase {
  grid-template-rows: auto auto auto;
}

.major-special-focus {
  display: grid;
  gap: 4px;
}

.major-special-heading {
  display: flex;
  min-width: 0;
  align-items: end;
  justify-content: space-between;
  gap: 8px;
}

.major-special-heading > span,
.major-special-heading small,
.major-special-heading strong {
  min-width: 0;
}

.major-special-heading > span {
  display: flex;
  align-items: center;
  gap: 7px;
}

.major-special-heading small {
  position: relative;
  display: inline-flex;
  min-height: 20px;
  padding: 2px 9px 2px 12px;
  align-items: center;
  border: 1px solid rgba(207, 164, 91, .78);
  color: #fffaf0;
  background: linear-gradient(135deg, #204d43, #123c33);
  box-shadow: 0 3px 8px rgba(27, 56, 48, .12);
  font: 800 clamp(8px, 2vw, 10px)/1.2 "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .1em;
}

.major-special-heading small::before {
  content: "◆";
  position: absolute;
  left: 4px;
  color: #dfbf7d;
  font-size: 5px;
}

.major-special-heading strong {
  display: block;
  margin: 0;
  color: var(--ink-deep);
  font-size: clamp(12px, 3vw, 15px);
  line-height: 1.2;
}

.major-special-heading > em {
  flex: 0 0 auto;
  color: #69756f;
  font: 600 clamp(8px, 1.9vw, 9px)/1.3 "PingFang SC", "Microsoft YaHei", sans-serif;
  font-style: normal;
  white-space: nowrap;
}

.major-feature-player {
  width: 100%;
  height: auto;
  aspect-ratio: 16 / 9;
  min-height: 0;
  margin: 0;
  padding: 7px;
  border: 0;
  border-radius: 2px;
  background:
    radial-gradient(circle at 50% 42%, rgba(207, 164, 91, .18), transparent 34%),
    linear-gradient(135deg, #173d35, #0d2b25);
  box-shadow: 0 9px 20px rgba(30, 43, 38, .16);
}

.major-feature-player::before {
  border: 7px solid transparent;
  border-image: var(--major-frame-image) 90 110 / 7px / 0 stretch;
  opacity: .92;
}

.major-feature-player > .unified-video-player {
  width: 100%;
  height: 100%;
  min-height: 0;
  aspect-ratio: auto;
  border-radius: 1px;
  object-fit: contain;
}

.major-feature-player .unified-video-inline-play {
  inset: 7px;
}

.major-feature-player .video-play {
  top: 50%;
  width: clamp(50px, 12vw, 62px);
  height: clamp(50px, 12vw, 62px);
}

.major-feature-player .school-video-fullscreen-button {
  right: 14px;
  bottom: 14px;
}

.major-video-pending {
  position: absolute;
  z-index: 2;
  inset: 7px;
  display: grid;
  place-items: center;
  margin: 0;
  padding: 20px;
  color: rgba(255, 250, 240, .88);
  background:
    linear-gradient(rgba(14, 54, 45, .44), rgba(14, 54, 45, .58)),
    radial-gradient(circle at 50% 38%, rgba(216, 180, 113, .28), transparent 34%);
  font-size: clamp(12px, 2.8vw, 14px);
  line-height: 1.55;
  font-weight: 700;
  text-align: center;
  letter-spacing: .04em;
}

.major-video-pending[hidden] {
  display: none;
}

.major-video-tabs {
  display: grid;
  overflow: hidden;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 1px solid rgba(139, 113, 72, .25);
  border-radius: 2px;
  background: rgba(255, 250, 240, .76);
  box-shadow: 0 5px 13px rgba(47, 43, 33, .07);
}

.major-video-tabs button {
  position: relative;
  display: grid;
  min-width: 0;
  min-height: 55px;
  padding: 6px 5px 7px;
  place-content: center;
  border: 0;
  border-radius: 0;
  color: #68736d;
  background: transparent;
  text-align: center;
  cursor: pointer;
  transition: color .18s ease, background .18s ease, box-shadow .18s ease;
}

.major-video-tabs button + button {
  border-left: 1px solid rgba(139, 113, 72, .2);
}

.major-video-tabs button[aria-selected="true"] {
  color: #fffaf0;
  background: linear-gradient(135deg, rgba(23, 68, 58, .98), rgba(13, 48, 40, .98));
  box-shadow: inset 0 -3px 0 rgba(207, 164, 91, .9);
}

.major-video-tabs small,
.major-video-tabs strong {
  display: block;
  overflow: hidden;
  text-overflow: clip;
}

.major-video-tabs small {
  color: var(--gold-dark);
  font-size: clamp(7px, 1.8vw, 9px);
  line-height: 1.2;
  font-weight: 800;
}

.major-video-tabs button[aria-selected="true"] small {
  color: #e7c786;
}

.major-gallery-module {
  display: grid;
  height: 100%;
  min-height: 0;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 5px;
}

.major-gallery-heading {
  display: flex;
  min-width: 0;
  align-items: end;
  justify-content: space-between;
  gap: 8px;
}

.major-gallery-heading > span,
.major-gallery-heading small,
.major-gallery-heading strong {
  display: block;
  min-width: 0;
}

.major-gallery-heading small {
  color: var(--gold-dark);
  font: 800 clamp(8px, 2vw, 10px)/1.2 "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .08em;
}

.major-gallery-heading strong {
  overflow: hidden;
  margin-top: 2px;
  color: var(--ink-deep);
  font-size: clamp(12px, 3vw, 15px);
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.major-gallery-heading button {
  flex: 0 0 auto;
  min-height: 34px;
  padding: 0 2px 0 10px;
  border: 0;
  color: var(--gold-dark);
  background: transparent;
  font-size: clamp(9px, 2.2vw, 11px);
  line-height: 1.2;
  font-weight: 800;
  cursor: pointer;
}

.major-gallery-heading button i {
  margin-left: 3px;
  font: 700 18px/1 Georgia, serif;
  font-style: normal;
}

.major-gallery-preview {
  display: flex;
  height: 100%;
  min-height: 0;
  overflow-x: auto;
  overflow-y: hidden;
  gap: 6px;
  padding: 7px;
  border: 7px solid transparent;
  border-radius: 2px;
  border-image: var(--major-frame-image) 90 110 fill / 7px / 0 stretch;
  background: rgba(255, 250, 240, .82);
  box-shadow: 0 7px 17px rgba(47, 43, 33, .09);
  scroll-behavior: smooth;
  scroll-snap-type: x mandatory;
  overscroll-behavior-x: contain;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.major-gallery-preview::-webkit-scrollbar {
  display: none;
}

.major-gallery-preview img {
  display: block;
  width: auto;
  height: 100%;
  min-height: 0;
  flex: 0 0 76%;
  border: 0;
  border-radius: 1px;
  object-fit: cover;
  filter: saturate(.84) contrast(.96);
  cursor: zoom-in;
  scroll-snap-align: start;
  scroll-snap-stop: always;
  transition: filter .18s ease, transform .18s ease;
}

.major-gallery-preview img:active {
  filter: saturate(.94) contrast(1);
  transform: scale(.985);
}

.major-gallery-preview img:focus-visible {
  outline: 3px solid rgba(177, 138, 80, .72);
  outline-offset: -4px;
}

.major-gallery-preview img:first-child {
  object-position: center 46%;
}

.major-gallery-preview img:nth-child(n + 4) {
  flex-basis: 48%;
}

.major-gallery-footer {
  display: grid;
  min-width: 0;
  place-items: center;
}

.major-gallery-footer p {
  display: flex;
  min-width: 0;
  margin: 0;
  align-items: center;
  justify-content: center;
  gap: 5px;
  color: #596a63;
}

.major-gallery-footer p span,
.major-gallery-footer p b,
.major-gallery-footer p strong {
  display: block;
  min-width: 0;
}

.major-gallery-footer p b {
  color: var(--gold-dark);
  font: 800 clamp(8px, 1.9vw, 9.5px)/1.15 "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .08em;
}

.major-gallery-footer p strong {
  overflow: hidden;
  margin-top: 1px;
  color: #294a42;
  font-size: clamp(9px, 2.25vw, 11px);
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.major-gallery-footer p i {
  color: var(--gold-dark);
  font: 800 20px/1 Georgia, serif;
  font-style: normal;
}

.major-gallery-footer p i:first-child {
  animation: major-swipe-left 1.7s ease-in-out infinite;
}

.major-gallery-footer p i:last-child {
  animation: major-swipe-right 1.7s ease-in-out infinite;
}

.major-video-tabs strong {
  margin-top: 3px;
  font-size: clamp(10px, 2.6vw, 13px);
  line-height: 1.14;
  font-weight: 900;
  white-space: normal;
}

.major-actions {
  display: grid;
  gap: 6px;
}

.major-extra-actions {
  position: relative;
  display: grid;
  overflow: hidden;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  border: 7px solid transparent;
  border-radius: 2px;
  border-image: var(--major-frame-image) 90 110 fill / 7px / 0 stretch;
  background:
    radial-gradient(circle at 50% 0, rgba(205, 163, 93, .16), transparent 42%),
    rgba(255, 250, 240, .82);
  box-shadow: 0 7px 17px rgba(47, 43, 33, .09);
}

.major-extra-actions button {
  position: relative;
  z-index: 1;
  display: grid;
  min-width: 0;
  min-height: 51px;
  padding: 7px 24px 7px 12px;
  overflow: hidden;
  border: 0;
  border-radius: 0;
  color: #435b53;
  background: transparent;
  align-content: center;
  text-align: left;
  cursor: pointer;
  transition: background .18s ease, transform .18s ease;
}

.major-extra-actions button::before {
  content: "";
  position: absolute;
  left: 5px;
  top: 22%;
  width: 2px;
  height: 56%;
  background: linear-gradient(rgba(177, 138, 80, .22), rgba(151, 117, 69, .92), rgba(177, 138, 80, .22));
}

.major-extra-actions button::after {
  content: "◆";
  position: absolute;
  right: 9px;
  top: 8px;
  color: rgba(177, 138, 80, .6);
  font-size: 7px;
}

.major-extra-actions button + button {
  border-left: 1px solid rgba(139, 113, 72, .2);
}

.major-extra-actions button:active {
  background: rgba(177, 138, 80, .1);
  transform: translateY(1px);
}

.major-extra-actions small,
.major-extra-actions strong,
.major-extra-actions em {
  display: block;
}

.major-extra-actions small {
  overflow: hidden;
  color: var(--gold-dark);
  font: 800 clamp(7px, 1.75vw, 8.5px)/1.15 "PingFang SC", "Microsoft YaHei", sans-serif;
  letter-spacing: .03em;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.major-extra-actions strong {
  display: -webkit-box;
  overflow: hidden;
  margin-top: 3px;
  color: #173f37;
  font-size: clamp(9.5px, 2.45vw, 12px);
  line-height: 1.2;
  font-weight: 900;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.major-extra-actions em {
  position: absolute;
  right: 10px;
  top: 54%;
  color: var(--gold-dark);
  font: 700 18px/1 Georgia, serif;
  font-style: normal;
}

.major-consult-button {
  display: flex;
  width: 100%;
  min-height: 46px;
  padding: 8px 16px;
  align-items: center;
  justify-content: center;
  gap: 12px;
  border: 1px solid rgba(207, 164, 91, .68);
  border-radius: 2px;
  color: #fffaf0;
  background:
    linear-gradient(90deg, rgba(20, 65, 55, .98), rgba(13, 53, 44, .98)),
    url("assets/images/review-hero-bg.jpg") center / cover;
  box-shadow: 0 8px 18px rgba(13, 52, 43, .16);
  font-size: clamp(12px, 2.8vw, 14px);
  line-height: 1.3;
  font-weight: 900;
  letter-spacing: .02em;
  cursor: pointer;
}

.major-consult-button span {
  color: #f0d39e;
  font: 700 22px/1 Georgia, serif;
}

.major-direction-grid button:focus-visible,
.major-video-tabs button:focus-visible,
.major-extra-actions button:focus-visible,
.major-consult-button:focus-visible {
  z-index: 2;
  outline: 3px solid rgba(177, 138, 80, .68);
  outline-offset: -3px;
}

@media (max-height: 960px) {
  .majors-screen {
    grid-template-rows:
      auto
      auto
      auto
      auto
      minmax(0, 1fr)
      auto;
    gap: 5px;
  }

  .majors-intro > h2 {
    font-size: clamp(17px, 3.8vw, 19.5px);
  }

  .major-direction-overview,
  .major-video-showcase {
    gap: 4px;
  }

  .major-direction-grid {
    grid-template-rows: repeat(2, minmax(47px, auto));
  }

  .major-direction-grid button {
    min-height: 48px;
    padding-block: 5px;
  }

  .major-feature-player {
    aspect-ratio: auto;
  }

  .major-video-tabs button {
    min-height: 49px;
    padding-block: 4px 5px;
  }

  .major-extra-actions button {
    min-height: 46px;
    padding-block: 5px;
  }

  .major-consult-button {
    min-height: 42px;
    padding-block: 6px;
  }
}

@keyframes major-swipe-left {
  0%, 100% {
    opacity: .45;
    transform: translateX(2px);
  }

  50% {
    opacity: 1;
    transform: translateX(-2px);
  }
}

@keyframes major-swipe-right {
  0%, 100% {
    opacity: .45;
    transform: translateX(-2px);
  }

  50% {
    opacity: 1;
    transform: translateX(2px);
  }
}

@keyframes project-panel-in {
  from {
    opacity: .45;
    transform: translateX(7px);
  }

  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@media (max-height: 700px) {
  .integrated-project-content {
    grid-template-rows:
      auto
      minmax(145px, 1.8fr)
      minmax(130px, 1.35fr)
      minmax(110px, 1fr)
      auto;
    gap: 5px;
  }

  .project-intro > h2 {
    font-size: 18px;
  }

  .project-intro > .section-lead {
    margin-top: 3px;
    font-size: 9px;
    line-height: 1.35;
  }

  .project-interview-copy {
    padding-top: 0;
  }

  .project-interview-copy small {
    display: none;
  }

  .project-interview-copy strong {
    margin-top: 0;
    font-size: 12px;
    line-height: 1.16;
    -webkit-line-clamp: 1;
  }

  .project-route-copy {
    right: 5px;
    bottom: 5px;
    left: 5px;
    height: 30px;
    min-height: 30px;
    padding: 6px 25px 6px 7px;
    background: rgba(14, 58, 48, .9);
  }

  .project-route-poster b {
    display: none;
  }

  .project-route-poster strong {
    font-size: clamp(11px, 3vw, 13px);
  }

  .project-route-poster em {
    right: 7px;
  }

  .project-overview-switcher {
    grid-template-rows: 30px minmax(0, 1fr);
  }

  .project-overview-tabs button {
    min-height: 30px;
  }

  .project-advantage-grid button {
    padding: 4px 7px 4px 11px;
  }

  .project-planning-cta {
    padding: 5px 8px;
  }

  .project-planning-cta > p,
  .project-planning-cta > small {
    display: none;
  }

  .project-planning-cta .project-assessment-button {
    min-height: 40px;
  }
}

@media (max-width: 360px) {
  .project-planning-cta {
    grid-template-columns: 1fr;
  }

  .project-compact-heading > em {
    display: none;
  }
}

/* Fifth screen single-screen summary: full details remain available in the shared centered dialog. */
.support-redesign {
  display: grid;
  height: 100svh;
  min-height: 100svh;
  max-height: 100svh;
  grid-template-rows: auto auto minmax(104px, 1fr) minmax(104px, 1fr) auto auto;
  gap: clamp(7px, 1.05svh, 12px);
  padding:
    calc(var(--preview-safe-top, max(47px, env(safe-area-inset-top))) + 43px)
    calc(var(--preview-safe-right, max(16px, env(safe-area-inset-right))) + 6px)
    calc(var(--preview-safe-bottom, max(34px, env(safe-area-inset-bottom))) + 6px)
    calc(var(--preview-safe-left, max(16px, env(safe-area-inset-left))) + 6px);
  overflow: hidden;
}

.support-redesign > .school-guide-button {
  right: calc(var(--preview-safe-right, max(16px, env(safe-area-inset-right))) + 6px);
  top: calc(var(--preview-safe-top, max(47px, env(safe-area-inset-top))) + 5px);
}

.support-redesign .support-intro > .eyebrow {
  margin-bottom: 3px;
  font-size: 10px;
  line-height: 1.25;
}

.support-redesign .support-intro > h2 {
  font-size: clamp(22px, 6.2vw, 27px);
  line-height: 1.16;
}

.support-redesign .support-intro > .section-lead {
  display: -webkit-box;
  margin: 6px 0 8px;
  overflow: hidden;
  color: #4d5e58;
  font-size: 11px;
  line-height: 1.45;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

.support-redesign .support-scene-strip,
.support-redesign .support-video-module {
  display: flex;
  min-height: 0;
  flex-direction: column;
  margin-top: 0;
}

.support-redesign .support-scene-strip > header,
.support-redesign .support-video-module > header {
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 12px;
}

.support-redesign .support-scene-strip > header small {
  display: block;
  margin: 0 0 1px;
  color: var(--gold-dark);
  font-size: 9px;
  line-height: 1.35;
  font-weight: 800;
  letter-spacing: .08em;
}

.support-redesign .support-scene-strip > header h3 {
  margin: 0;
  color: var(--ink-deep);
  font-size: 16px;
  line-height: 1.25;
}

.support-redesign .support-scene-strip > header > span {
  flex: 0 0 auto;
  color: #6f7c76;
  font-size: 9px;
}

.support-redesign .support-scene-grid {
  display: flex;
  min-height: 0;
  flex: 1;
  gap: 7px;
  margin-top: 6px;
  padding: 0 8% 2px 0;
  overflow-x: auto;
  overflow-y: hidden;
  overscroll-behavior-inline: contain;
  scroll-padding-inline: 0;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  touch-action: pan-x;
  -webkit-overflow-scrolling: touch;
}

.support-redesign .support-scene-grid::-webkit-scrollbar {
  display: none;
}

.support-redesign .support-scene-grid button {
  position: relative;
  flex: 0 0 92%;
  min-width: 0;
  min-height: 0;
  padding: 3px;
  overflow: hidden;
  border: 1px solid rgba(164, 129, 76, .38);
  border-radius: 4px;
  background: rgba(255, 252, 243, .82);
  box-shadow: 0 6px 14px rgba(31, 54, 47, .12);
  scroll-snap-align: start;
  scroll-snap-stop: always;
  cursor: pointer;
}

.support-redesign .support-scene-grid img {
  display: block;
  width: 100%;
  height: 100%;
  border-radius: 2px;
  object-fit: cover;
}

.support-redesign .support-scene-grid button > span {
  position: absolute;
  left: 6px;
  bottom: 5px;
  max-width: calc(100% - 12px);
  padding: 2px 5px;
  overflow: hidden;
  border-radius: 2px;
  color: #fffdf7;
  background: rgba(11, 47, 40, .78);
  font-size: 8px;
  line-height: 1.2;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.support-redesign .support-scene-grid button:focus-visible {
  outline: 3px solid rgba(177, 138, 80, .58);
  outline-offset: 2px;
}

.support-redesign .support-video-module > header small {
  margin-bottom: 1px;
  font-size: 9px;
}

.support-redesign .support-video-module h3 {
  font-size: 16px;
  line-height: 1.25;
}

.support-redesign .support-video-module > header > span {
  font-size: 9px;
}

.support-redesign .support-video-card {
  min-height: 0;
  flex: 1;
  height: auto;
  margin-top: 6px;
  padding: 4px;
  aspect-ratio: auto;
}

.support-redesign .support-video-card > .unified-video-player {
  aspect-ratio: auto;
  object-fit: cover;
}

.support-redesign .support-video-card .unified-video-inline-play {
  inset: 4px;
}

.support-redesign .support-video-card .video-play {
  width: 42px;
  height: 42px;
}

.support-redesign .support-video-card .video-play::before {
  left: 17px;
  top: 12px;
  width: 13px;
  height: 18px;
}

.support-redesign .support-detail-grid {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 6px;
  margin-top: 0;
}

.support-redesign .support-detail-grid button {
  min-height: clamp(58px, 8.2svh, 76px);
  padding: 8px 34px 8px 12px;
  gap: 1px;
  border-left: 3px solid rgba(166, 116, 54, .72);
  background:
    linear-gradient(90deg, rgba(255, 251, 240, .97), rgba(243, 237, 220, .8)),
    var(--paper-texture);
}

.support-redesign .support-detail-grid button::after {
  right: 8px;
  top: 50%;
  bottom: auto;
  font-size: 18px;
  transform: translateY(-50%);
}

.support-redesign .support-detail-grid small {
  margin-bottom: 0;
  font-size: 7.5px;
  line-height: 1.15;
  white-space: nowrap;
}

.support-redesign .support-detail-grid strong {
  font-size: 14px;
  line-height: 1.2;
  word-break: keep-all;
  text-wrap: balance;
}

.support-redesign .support-detail-grid button > span {
  overflow: visible;
  font-size: 9px;
  line-height: 1.2;
  text-overflow: clip;
  white-space: normal;
}

.support-redesign .support-card-summary b {
  display: block;
  font-weight: inherit;
  white-space: nowrap;
}

.support-redesign .support-detail-grid button:nth-child(2) {
  border-left-color: rgba(30, 83, 69, .76);
}

.project-info-backdrop[data-project-detail="supportPlan"] .project-info-body > p,
.project-info-backdrop[data-project-detail="supportWalking"] .project-info-body > p,
.project-info-backdrop[data-project-detail="supportPlan"] .project-info-section-card li,
.project-info-backdrop[data-project-detail="supportWalking"] .project-info-section-card li {
  word-break: normal;
  line-break: strict;
  text-wrap: pretty;
}

.support-redesign .support-lunch-card {
  grid-template-columns: 38px minmax(0, 1fr) 88px 10px;
  gap: 8px;
  min-height: clamp(60px, 8svh, 78px);
  margin-top: 0;
  padding: 8px 10px;
  overflow: hidden;
  border-color: rgba(184, 132, 69, .42);
  background:
    radial-gradient(circle at 8% 20%, rgba(219, 161, 90, .19), transparent 33%),
    linear-gradient(120deg, rgba(255, 248, 232, .96), rgba(249, 236, 214, .9));
  box-shadow: 0 10px 24px rgba(103, 71, 36, .12), inset 0 1px 0 rgba(255, 255, 255, .84);
}

.support-redesign .support-lunch-seal {
  width: 36px;
  height: 36px;
  box-shadow: 0 0 0 3px rgba(177, 138, 80, .11);
  font-size: 14px;
}

.support-redesign .support-lunch-card small {
  margin-bottom: 0;
  font-size: 8px;
  line-height: 1.15;
}

.support-redesign .support-lunch-card strong {
  font-size: 15px;
  line-height: 1.2;
}

.support-redesign .support-lunch-card em {
  margin-top: 2px;
  overflow: hidden;
  font-size: 9.5px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.support-redesign .support-lunch-card > b {
  font-size: 18px;
}

.support-lunch-photos {
  position: relative;
  display: block;
  width: 88px;
  height: 48px;
}

.support-lunch-photos img {
  position: absolute;
  top: 50%;
  width: 42px;
  height: 42px;
  border: 2px solid rgba(255, 250, 240, .95);
  border-radius: 50%;
  object-fit: cover;
  box-shadow: 0 5px 12px rgba(65, 45, 25, .18);
  transform: translateY(-50%);
}

.support-lunch-photos img:nth-child(1) { left: 0; z-index: 3; object-position: 38% center; }
.support-lunch-photos img:nth-child(2) { left: 23px; z-index: 2; }
.support-lunch-photos img:nth-child(3) { left: 46px; z-index: 1; }

.project-info-photo-strip {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 82%;
  gap: 9px;
  margin: 2px -24px 17px;
  padding: 4px 24px 10px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.project-info-photo-strip[hidden] { display: none; }
.project-info-photo-strip::-webkit-scrollbar { display: none; }

.project-info-photo-strip img {
  display: block;
  width: 100%;
  height: clamp(132px, 23svh, 178px);
  border: 5px solid rgba(255, 250, 240, .94);
  border-radius: 8px;
  object-fit: cover;
  box-shadow: 0 10px 24px rgba(71, 46, 24, .16);
  scroll-snap-align: center;
}

.project-info-photo-strip img:first-child {
  padding: 7px;
  border: 1px solid rgba(169, 119, 62, .48);
  outline: 5px solid rgba(255, 250, 239, .94);
  outline-offset: -7px;
  object-fit: contain;
  object-position: center;
  background:
    linear-gradient(rgba(245, 231, 207, .84), rgba(255, 250, 239, .96)),
    #f5ead8;
  box-shadow:
    0 11px 24px rgba(71, 46, 24, .16),
    inset 0 0 0 1px rgba(255, 255, 255, .8);
}

.project-info-video-strip {
  display: grid;
  grid-auto-flow: column;
  grid-auto-columns: 78%;
  gap: 10px;
  margin: 4px -24px 18px;
  padding: 4px 24px 12px;
  overflow-x: auto;
  scroll-snap-type: x mandatory;
  scrollbar-width: none;
  -webkit-overflow-scrolling: touch;
}

.project-info-video-strip[hidden] { display: none; }
.project-info-video-strip::-webkit-scrollbar { display: none; }

.project-info-video-card {
  overflow: hidden;
  border: 1px solid rgba(168, 126, 70, .48);
  border-radius: 8px;
  background: rgba(255, 251, 241, .96);
  box-shadow: 0 10px 22px rgba(49, 41, 29, .15);
  scroll-snap-align: center;
}

.project-info-video-card video {
  display: block;
  width: 100%;
  aspect-ratio: 16 / 9;
  object-fit: cover;
  background: #102f29;
}

.project-info-video-card strong {
  display: block;
  padding: 8px 10px 9px;
  color: #17483f;
  font-size: 12px;
  font-weight: 700;
  letter-spacing: .04em;
}

.project-info-quote {
  position: relative;
  margin: 0 0 17px;
  padding: 13px 15px 12px 18px;
  border: 1px solid rgba(174, 123, 64, .28);
  border-left: 3px solid #a56e38;
  border-radius: 4px;
  color: #365149;
  background: rgba(255, 247, 232, .76);
  box-shadow: inset 0 1px 0 rgba(255, 255, 255, .7);
}

.project-info-quote[hidden] { display: none; }

.project-info-quote::before {
  content: "“";
  position: absolute;
  left: 7px;
  top: -6px;
  color: rgba(165, 110, 56, .22);
  font: 700 42px/1 "STKaiti", "Kaiti SC", serif;
}

.project-info-quote p {
  position: relative;
  margin: 0;
  font: 700 14px/1.7 "STKaiti", "Kaiti SC", "Songti SC", serif;
  letter-spacing: .02em;
}

.project-info-quote cite {
  display: block;
  margin-top: 7px;
  color: #755733;
  font-size: 10px;
  line-height: 1.5;
  font-style: normal;
  text-align: right;
}

.project-info-backdrop[data-project-detail="supportLunch"] .project-info-drawer {
  max-height: min(86svh, 700px);
  border-color: rgba(190, 137, 72, .72);
  background:
    radial-gradient(circle at 84% 8%, rgba(234, 181, 112, .22), transparent 31%),
    linear-gradient(150deg, rgba(255, 252, 243, .99), rgba(249, 237, 219, .985));
}

.project-info-backdrop[data-project-detail="supportLunch"] .project-info-header::after {
  background: linear-gradient(90deg, #c38b49, rgba(195, 139, 73, .12));
}

.project-info-backdrop[data-project-detail="supportLunch"] .project-info-section-icon {
  color: #fff8ea;
  background: #8a5b32;
}

.project-info-backdrop[data-project-detail="supportPractice"] .project-info-body > p {
  margin: 0 0 15px;
  padding: 11px 13px;
  border-left: 3px solid var(--gold-dark);
  color: var(--ink-deep);
  background: linear-gradient(90deg, rgba(212, 181, 123, .18), rgba(255, 250, 240, .2));
  font-size: 14px;
  font-weight: 800;
  line-height: 1.65;
}

.support-redesign .support-source-note {
  display: -webkit-box;
  margin: 0;
  overflow: hidden;
  font-size: 8px;
  line-height: 1.25;
  -webkit-box-orient: vertical;
  -webkit-line-clamp: 2;
}

@media (min-width: 480px) {
  .support-redesign {
    padding-inline:
      calc(var(--preview-safe-right, max(16px, env(safe-area-inset-right))) + 6px)
      calc(var(--preview-safe-left, max(16px, env(safe-area-inset-left))) + 6px);
  }

  .support-redesign .support-detail-grid button {
    min-height: clamp(60px, 9svh, 88px);
    padding: 8px 23px 8px 10px;
  }
}

/* Keep the fifth-screen documentary gallery consistently horizontal after the shared gallery rules. */
.support-redesign .support-scene-gallery img,
.support-redesign .support-scene-gallery img:nth-child(2n),
.support-redesign .support-scene-gallery img:nth-child(3n) {
  aspect-ratio: 4 / 3;
  border-width: 5px;
  border-radius: 4px;
  object-fit: cover;
  transform: none;
}

.support-redesign .support-scene-gallery {
  width: 100%;
  max-width: 100%;
  margin: 12px 0 8px;
  padding: 0 0 18px;
}

.project-info-backdrop[data-project-detail^="support"] .project-info-section-card li {
  overflow: visible;
  text-overflow: clip;
  white-space: normal;
}

@media (prefers-reduced-motion: reduce) {
  .modal-backdrop:not([hidden]),
  .modal-backdrop:not([hidden]) > [role="dialog"],
  .project-overview-panel,
  .project-overview-tabs button,
  .project-info-drawer {
    animation: none;
    transition: none;
  }

  .project-advantage-grid button.is-dialog-source {
    animation: none;
  }

  .project-route-poster.is-dialog-source {
    animation: none;
  }
}

/* Fourth screen: render professional-direction and special-class popups as real modular pages. */
.project-info-backdrop.is-focus-card.is-major-profile .project-info-drawer {
  display: grid;
  width: min(92vw, 430px);
  max-height: min(88svh, 760px);
  grid-template-rows: auto auto minmax(0, 1fr);
  border-color: rgba(177, 138, 80, .78);
  background:
    radial-gradient(circle at 92% 4%, rgba(207, 164, 91, .12), transparent 25%),
    linear-gradient(rgba(255, 251, 242, .98), rgba(250, 246, 235, .99)),
    url("assets/images/review-hero-bg.jpg") center / cover no-repeat;
}

.project-info-backdrop.is-focus-card.is-major-profile .project-info-header {
  padding: 22px 68px 11px 20px;
}

.project-info-backdrop.is-focus-card.is-major-profile .project-info-header::after {
  width: 48px;
  margin-top: 9px;
}

.project-info-backdrop.is-focus-card.is-major-profile .project-info-header h2 {
  font-size: clamp(21px, 5.7vw, 27px);
  line-height: 1.2;
}

.project-info-backdrop.is-focus-card.is-major-profile .project-info-media {
  height: auto;
  aspect-ratio: 16 / 9;
  margin: 0 20px;
  border-color: rgba(151, 117, 69, .52);
  border-radius: 2px;
  background: #172e28;
  box-shadow:
    0 8px 18px rgba(24, 60, 54, .13),
    inset 0 0 0 3px rgba(255, 250, 240, .48);
}

.project-info-backdrop.is-focus-card.is-major-profile .project-info-media img {
  filter: saturate(.94) contrast(.98);
  object-fit: cover;
}

.project-info-backdrop.is-focus-card.is-major-profile[data-project-detail="majorDigital"] .project-info-media img {
  object-position: center;
}

.project-info-backdrop.is-focus-card.is-major-profile[data-project-detail="majorMusic"] .project-info-media img {
  object-position: center;
}

.project-info-backdrop.is-focus-card.is-major-profile .project-info-media figcaption {
  display: none;
}

.project-info-backdrop.is-focus-card.is-major-profile .project-info-body {
  min-height: 0;
  overflow-x: hidden;
  overflow-y: auto;
  padding: 12px 20px max(18px, env(safe-area-inset-bottom));
  overscroll-behavior: contain;
  scrollbar-width: thin;
  scrollbar-color: rgba(36, 76, 69, .28) transparent;
}

.project-info-backdrop.is-focus-card.is-major-profile .project-info-body > p {
  color: #25483f;
  font-size: clamp(11px, 2.7vw, 13px);
  line-height: 1.68;
}

.project-info-sections {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 7px;
  margin-top: 12px;
}

.project-info-sections[hidden] {
  display: none;
}

.project-info-section-card {
  position: relative;
  min-width: 0;
  min-height: 92px;
  padding: 9px 8px 8px 40px;
  border: 1px solid rgba(139, 113, 72, .22);
  border-radius: 2px;
  background:
    linear-gradient(135deg, rgba(255, 250, 240, .92), rgba(232, 238, 225, .62));
  box-shadow: 0 5px 12px rgba(36, 51, 47, .05);
}

.project-info-section-icon {
  position: absolute;
  left: 8px;
  top: 9px;
  display: grid;
  width: 25px;
  height: 25px;
  place-items: center;
  border: 1px solid rgba(177, 138, 80, .46);
  border-radius: 50%;
  color: #8d783d;
  background: rgba(255, 251, 242, .78);
  font: 800 13px/1 Georgia, "Songti SC", serif;
}

.project-info-section-card > strong {
  display: block;
  color: #173f37;
  font-size: clamp(11px, 2.8vw, 13px);
  line-height: 1.25;
}

.project-info-section-card ul {
  display: grid;
  gap: 2px;
  margin: 6px 0 0;
  padding: 0;
  color: #56655f;
  list-style: none;
}

.project-info-section-card li {
  position: relative;
  overflow: hidden;
  padding-left: 7px;
  font: 600 clamp(8px, 2vw, 9.5px)/1.3 "PingFang SC", "Microsoft YaHei", sans-serif;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.project-info-section-card li::before {
  content: "·";
  position: absolute;
  left: 0;
  color: var(--gold-dark);
}

.project-info-section-card:nth-child(odd):last-child {
  grid-column: 1 / -1;
  min-height: 66px;
  padding-top: 10px;
  padding-bottom: 9px;
}

.project-info-section-card:nth-child(odd):last-child ul {
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 3px 7px;
}

.project-info-backdrop.is-major-profile .project-info-tags {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 4px;
  margin-top: 12px;
}

.project-info-backdrop.is-major-profile .project-info-tags[data-tag-count="3"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.project-info-backdrop.is-major-profile .project-info-tags[data-tag-count="5"] {
  grid-template-columns: repeat(5, minmax(0, 1fr));
}

.project-info-backdrop.is-major-profile .project-info-tags span {
  min-width: 0;
  padding: 6px 2px;
  overflow: hidden;
  color: #244c45;
  background: rgba(230, 235, 222, .74);
  font-size: clamp(7px, 1.8vw, 9px);
  line-height: 1.2;
  font-weight: 800;
  text-align: center;
  text-overflow: ellipsis;
  white-space: nowrap;
}

@media (max-width: 360px) {
  .project-info-backdrop.is-focus-card.is-major-profile .project-info-drawer {
    width: min(94vw, 430px);
  }

  .project-info-backdrop.is-focus-card.is-major-profile .project-info-header,
  .project-info-backdrop.is-focus-card.is-major-profile .project-info-body {
    padding-left: 16px;
    padding-right: 16px;
  }

  .project-info-backdrop.is-focus-card.is-major-profile .project-info-media {
    margin-inline: 16px;
  }
}

/* 第六屏最终布局：成果严格单屏，收尾页回到第 7 屏 */
#results {
  box-sizing: border-box;
  height: calc(var(--preview-screen-height, 100svh) - 1px);
  min-height: calc(var(--preview-screen-height, 100svh) - 1px);
  padding:
    calc(var(--preview-safe-top, max(48px, env(safe-area-inset-top))) + 1px)
    26px
    var(--preview-safe-bottom, max(34px, env(safe-area-inset-bottom)));
  overflow: hidden;
}

#results > .eyebrow {
  margin-bottom: 2px;
  font-size: 9px;
}

#results > h2 {
  font-size: 22px;
  line-height: 1.15;
}

#results > .section-lead {
  margin: 5px 0 7px;
  font-size: 10px;
  line-height: 1.45;
}

#results .results-offer-section {
  margin-top: 0;
}

#results .results-offer-section > .results-module-header,
#results .results-offer-section > .image-caption {
  display: none;
}

#results .results-offer-composite {
  gap: 0;
  margin-top: 0;
  padding: 6px;
  border-radius: 6px;
}

#results .results-offer-interview {
  width: 82%;
  margin: 0 auto 7px;
  padding: 4px;
  border-radius: 5px;
}

#results .results-offer-interview-media {
  aspect-ratio: 16 / 9;
  border-radius: 3px;
}

#results .results-offer-interview-copy {
  position: absolute;
  right: 4px;
  bottom: 4px;
  left: 4px;
  z-index: 3;
  gap: 0;
  padding: 20px 8px 7px;
  color: #fffaf0;
  background: linear-gradient(transparent, rgba(25, 49, 43, .88));
  text-shadow: 0 1px 4px rgba(0, 0, 0, .3);
}

#results .results-offer-interview-copy small {
  color: rgba(255, 245, 219, .82);
  font-size: 6px;
}

#results .results-offer-interview-copy strong {
  color: #fffaf0;
  font-size: 11px;
  line-height: 1.25;
}

#results .results-offer-interview-copy > span {
  display: none;
}

#results .results-offer-stack {
  height: 221px;
  min-height: 221px;
}

#results .results-offer-stack-head {
  padding: 8px 11px 4px;
}

#results .results-offer-stack-head small {
  gap: 0;
  font-size: 9px;
}

#results .results-offer-stack-head small::before {
  font-size: 6px;
}

#results .results-offer-stack-head span {
  font-size: 7px;
}

#results .results-offer-stack .offer-wall.offer-showcase,
#results .results-offer-stack .offer-lane {
  height: 171px;
}

#results .results-offer-stack .offer-lane {
  padding: 5px 0 8px;
}

#results .results-offer-stack .offer-sequence {
  gap: 8px;
  padding: 2px 20px 8px;
}

#results .results-offer-stack .offer-sequence .offer-card,
#results .results-offer-stack .offer-sequence .offer-card:nth-child(n),
#results .results-offer-stack .offer-sequence .offer-card:first-child {
  flex-basis: 114px;
  width: 114px;
}

#results .results-offer-stack-note {
  padding: 0 11px 7px;
  font-size: 7px;
}

#results .results-video-section {
  margin-top: 5px;
}

#results .results-video-section .results-module-header {
  align-items: center;
}

#results .results-video-section .results-module-header small {
  font-size: 7px;
}

#results .results-video-section .results-module-header h3 {
  font-size: 12px;
  line-height: 1.2;
}

#results .results-video-section .results-module-header > span {
  font-size: 7px;
}

#results .results-featured-videos {
  display: grid;
  grid-template-columns: minmax(0, 1fr);
  grid-template-rows: repeat(2, 76px);
  grid-auto-flow: row;
  grid-auto-columns: auto;
  row-gap: 8px;
  height: 168px;
  margin: 4px -26px 2px;
  padding: 1px 0 4px;
  overflow: hidden;
}

#results .results-video-row {
  display: flex;
  gap: 10px;
  min-width: 0;
  padding: 0 26px;
  overflow-x: auto;
  overflow-y: hidden;
  scroll-snap-type: x proximity;
  scrollbar-width: none;
  overscroll-behavior-x: contain;
}

#results .results-video-row::-webkit-scrollbar {
  display: none;
}

#results .results-video-row-secondary {
  padding-left: 26px;
}

#results .results-video-row-secondary .results-story-card:first-child {
  margin-left: 18px;
}

#results .results-story-card {
  position: relative;
  flex: 0 0 34%;
  height: 76px;
  scroll-snap-align: start;
}

#results .results-story-media {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
}

#results .results-story-media.unified-video-card .video-play {
  top: 50%;
  width: 32px;
  height: 32px;
  border: 1px solid rgba(221, 185, 122, .9);
  background:
    radial-gradient(circle at 36% 28%, rgba(255, 255, 255, .18), transparent 36%),
    rgba(23, 61, 52, .92);
  box-shadow:
    0 0 0 3px rgba(255, 250, 240, .16),
    0 5px 14px rgba(18, 38, 32, .26);
  backdrop-filter: blur(4px);
  transition: transform .2s ease, background .2s ease, box-shadow .2s ease;
}

#results .results-story-media.unified-video-card .video-play::before {
  left: 13px;
  top: 9px;
  width: 9px;
  height: 13px;
  background: #fff8e8;
}

#results .results-story-media.unified-video-card .video-play::after {
  content: "";
  position: absolute;
  inset: 3px;
  border: 1px solid rgba(255, 244, 220, .22);
  border-radius: 50%;
}

#results .results-story-media.unified-video-card:not(.is-playing) .unified-video-player::-webkit-media-controls {
  opacity: 0;
  pointer-events: none;
}

#results .results-story-media.unified-video-card:hover .video-play,
#results .results-story-media.unified-video-card:focus-within .video-play {
  background:
    radial-gradient(circle at 36% 28%, rgba(255, 255, 255, .22), transparent 36%),
    rgba(31, 78, 66, .96);
  box-shadow:
    0 0 0 4px rgba(221, 185, 122, .15),
    0 7px 18px rgba(18, 38, 32, .3);
}

#results .results-channel-play {
  width: 32px;
  height: 32px;
  border-color: rgba(221, 185, 122, .9);
  background:
    radial-gradient(circle at 36% 28%, rgba(255, 255, 255, .18), transparent 36%),
    rgba(23, 61, 52, .92);
  box-shadow:
    0 0 0 3px rgba(255, 250, 240, .16),
    0 5px 14px rgba(18, 38, 32, .26);
  backdrop-filter: blur(4px);
}

#results .results-channel-play .video-play {
  position: relative;
  left: 1px;
  top: auto;
  width: 9px;
  height: 13px;
  border-radius: 0;
  background: #fff8e8;
  box-shadow: none;
  clip-path: polygon(0 0, 100% 50%, 0 100%);
  transform: none;
}

#results .results-channel-play .video-play::before {
  display: none;
}

#results .results-story-copy {
  position: absolute;
  right: 0;
  bottom: 0;
  left: 0;
  z-index: 4;
  padding: 16px 6px 5px;
  color: #fffaf0;
  background: linear-gradient(transparent, rgba(25, 49, 43, .9));
  pointer-events: none;
}

#results .results-story-copy::before {
  display: none;
}

#results .results-story-copy small {
  color: rgba(255, 239, 203, .85);
  font-size: 6px;
}

#results .results-story-copy strong {
  margin-top: 1px;
  overflow: hidden;
  color: #fffaf0;
  font-size: 8px;
  line-height: 1.25;
  text-overflow: ellipsis;
  white-space: nowrap;
}

#results .results-story-copy p {
  display: none;
}

#results .results-channel-badge {
  right: 4px;
  top: 4px;
  padding: 2px 4px;
  font-size: 6px;
}

#results .results-channel-play {
  width: 30px;
  height: 30px;
}

#results .results-video-note {
  margin: 0;
  font-size: 7px;
  line-height: 1.35;
}

#results .results-video-list[hidden] {
  display: none !important;
}

#results .final-cta {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  grid-template-areas:
    "title button"
    "copy button";
  column-gap: 10px;
  align-items: center;
  margin-top: 5px;
  padding: 7px 9px;
}

#results .final-cta h3 {
  grid-area: title;
  font-size: 11px;
  line-height: 1.2;
}

#results .final-cta p {
  grid-area: copy;
  margin-top: 2px;
  font-size: 7px;
  line-height: 1.3;
}

#results .final-cta .reserve-btn {
  grid-area: button;
  min-height: 34px;
  margin-top: 0;
  padding: 7px 12px;
  font-size: 9px;
  white-space: nowrap;
}

#results .tiny-note {
  margin-top: 3px;
  font-size: 6px;
  line-height: 1.3;
}

.closing-section {
  box-sizing: border-box;
  height: calc(var(--preview-screen-height, 100svh) - 1px);
  min-height: calc(var(--preview-screen-height, 100svh) - 1px);
  overflow: hidden;
}

/* 高屏机型按可用高度放大核心内容，避免沿用小屏压缩尺寸造成大面积留白 */
@media (min-height: 1050px) {
  #results > h2 {
    font-size: 24px;
  }

  #results > .section-lead {
    margin-top: 6px;
    margin-bottom: 9px;
    font-size: 11px;
  }

  #results .results-offer-composite {
    padding: 8px;
  }

  #results .results-offer-interview {
    width: 100%;
    margin-bottom: 9px;
  }

  #results .results-offer-interview-copy {
    padding: 24px 10px 9px;
  }

  #results .results-offer-interview-copy strong {
    font-size: 13px;
  }

  #results .results-offer-stack {
    height: 270px;
    min-height: 270px;
  }

  #results .results-offer-stack-head {
    padding: 10px 13px 5px;
  }

  #results .results-offer-stack-head small {
    font-size: 10px;
  }

  #results .results-offer-stack .offer-wall.offer-showcase,
  #results .results-offer-stack .offer-lane {
    height: 220px;
  }

  #results .results-offer-stack .offer-lane {
    padding: 7px 0 10px;
  }

  #results .results-offer-stack .offer-sequence {
    gap: 10px;
    padding: 3px 24px 10px;
  }

  #results .results-offer-stack .offer-sequence .offer-card,
  #results .results-offer-stack .offer-sequence .offer-card:nth-child(n),
  #results .results-offer-stack .offer-sequence .offer-card:first-child {
    flex-basis: 148px;
    width: 148px;
  }

  #results .results-offer-stack-note {
    padding: 0 13px 8px;
    font-size: 8px;
  }

  #results .results-video-section {
    margin-top: 9px;
  }

  #results .results-video-section .results-module-header h3 {
    font-size: 14px;
  }

  #results .results-featured-videos {
    grid-template-rows: repeat(2, 100px);
    row-gap: 10px;
    height: 220px;
    margin-top: 6px;
    margin-bottom: 3px;
    padding-bottom: 6px;
  }

  #results .results-story-card {
    flex-basis: 39%;
    height: 100px;
  }

  #results .results-video-row {
    gap: 12px;
  }

  #results .results-story-media.unified-video-card .video-play {
    width: 38px;
    height: 38px;
  }

  #results .results-story-media.unified-video-card .video-play::before {
    left: 15px;
    top: 11px;
    width: 10px;
    height: 15px;
  }

  #results .results-channel-play {
    width: 36px;
    height: 36px;
  }

  #results .results-story-copy {
    padding: 20px 8px 7px;
  }

  #results .results-story-copy small {
    font-size: 7px;
  }

  #results .results-story-copy strong {
    font-size: 9px;
    line-height: 1.3;
  }

  #results .results-video-note {
    margin-top: 3px;
    font-size: 8px;
  }

  #results .final-cta {
    margin-top: 15px;
    padding: 10px 12px;
  }

  #results .final-cta h3 {
    font-size: 13px;
  }

  #results .final-cta p {
    font-size: 8px;
  }

  #results .final-cta .reserve-btn {
    min-height: 40px;
    padding-inline: 15px;
    font-size: 10px;
  }

  #results .tiny-note {
    margin-top: 5px;
    font-size: 7px;
  }
}

/* 全站视频播放按钮：墨绿、浅金与宣纸米白的统一视觉系统 */
.unified-video-card {
  --unified-play-size: 54px;
}

#project .project-interview-poster {
  --unified-play-size: 50px;
}

#majors .major-feature-player {
  --unified-play-size: clamp(50px, 11vw, 58px);
}

#support .support-video-card {
  --unified-play-size: 44px;
}

#results .results-story-media {
  --unified-play-size: 38px;
}

.unified-video-card .video-play,
.results-offer-interview-play .video-play {
  top: 50% !important;
  width: var(--unified-play-size, 54px) !important;
  height: var(--unified-play-size, 54px) !important;
  border: 1px solid rgba(221, 185, 122, .92) !important;
  border-radius: 50% !important;
  background:
    radial-gradient(circle at 34% 27%, rgba(255, 255, 255, .2), transparent 34%),
    rgba(22, 60, 51, .92) !important;
  box-shadow:
    0 0 0 4px rgba(255, 250, 240, .15),
    0 8px 20px rgba(17, 38, 32, .28) !important;
  transform: translate(-50%, -50%) !important;
  backdrop-filter: blur(4px);
  transition: background .2s ease, box-shadow .2s ease, transform .2s ease;
}

.unified-video-card .video-play::before,
.results-offer-interview-play .video-play::before {
  left: 50% !important;
  top: 50% !important;
  width: 28% !important;
  height: 40% !important;
  background: #fff8e8 !important;
  transform: translate(-39%, -50%) !important;
}

.unified-video-card .video-play::after,
.results-offer-interview-play .video-play::after {
  content: "";
  position: absolute;
  inset: 4px;
  border: 1px solid rgba(255, 244, 220, .22);
  border-radius: 50%;
}

.unified-video-card:hover .video-play,
.unified-video-card:focus-within .video-play,
.results-offer-interview:hover .video-play,
.results-offer-interview:focus-visible .video-play {
  background:
    radial-gradient(circle at 34% 27%, rgba(255, 255, 255, .24), transparent 34%),
    rgba(30, 78, 66, .96) !important;
  box-shadow:
    0 0 0 5px rgba(221, 185, 122, .14),
    0 10px 24px rgba(17, 38, 32, .3) !important;
}

.unified-video-card:not(.is-playing) .unified-video-player::-webkit-media-controls {
  opacity: 0;
  pointer-events: none;
}

.results-offer-interview-play {
  --unified-play-size: 42px;
}

.results-channel-play {
  border: 1px solid rgba(221, 185, 122, .92) !important;
  background:
    radial-gradient(circle at 34% 27%, rgba(255, 255, 255, .2), transparent 34%),
    rgba(22, 60, 51, .92) !important;
  box-shadow:
    0 0 0 3px rgba(255, 250, 240, .15),
    0 6px 16px rgba(17, 38, 32, .28) !important;
}

.results-channel-play .video-play {
  background: #fff8e8 !important;
}

@media (max-height: 1049px) {
  #results .results-story-media {
    --unified-play-size: 32px;
  }

  .results-offer-interview-play {
    --unified-play-size: 34px;
  }
}

/* 第七屏：沿用首屏水墨背景，安全区内完整呈现录取通知书，框外柔化延展 */
.closing-section {
  isolation: isolate;
  background:
    #f7efe3
    url("assets/images/home-hero-bg-no-guide.png")
    center / cover no-repeat;
}

.closing-section::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 0;
  background:
    url("assets/板块素材/06_升学成果与报考咨询/图片/00_录取通知书主视觉_用户替换_20260729.png")
    center / cover no-repeat;
  filter: blur(16px) saturate(.78);
  opacity: .42;
  transform: none;
  pointer-events: none;
}

.closing-section .closing-admission-visual {
  position: absolute;
  z-index: 1;
  top: var(--preview-safe-top, max(47px, env(safe-area-inset-top)));
  left: var(--preview-safe-left, max(16px, env(safe-area-inset-left)));
  width: calc(
    100% -
    var(--preview-safe-left, max(16px, env(safe-area-inset-left))) -
    var(--preview-safe-right, max(16px, env(safe-area-inset-right)))
  );
  height: calc(
    100% -
    var(--preview-safe-top, max(47px, env(safe-area-inset-top))) -
    var(--preview-safe-bottom, max(34px, env(safe-area-inset-bottom)))
  );
  min-height: 0;
  object-fit: contain;
  object-position: center;
  border: 1px solid rgba(198, 166, 90, .72);
  border-radius: 8px;
  box-shadow:
    0 0 0 3px rgba(255, 250, 240, .28),
    0 14px 34px rgba(35, 52, 46, .2);
}

.closing-section h2 {
  z-index: 2;
  right: calc(var(--preview-safe-right, max(16px, env(safe-area-inset-right))) + 12px);
  bottom: calc(var(--preview-safe-bottom, max(34px, env(safe-area-inset-bottom))) + 12px);
  padding: 5px 8px;
  border: 1px solid rgba(198, 166, 90, .52);
  border-radius: 3px;
  background: rgba(251, 247, 238, .74);
  backdrop-filter: blur(6px);
}

/* 第七屏最终版：用户新图直接覆盖整屏，不叠加原背景、边框、虚化层或额外文案 */
.closing-section {
  background: #f7efe3;
}

.closing-section::before {
  content: none;
}

.closing-section .closing-admission-visual {
  position: absolute;
  inset: 0;
  width: 100%;
  height: 100%;
  min-height: 100%;
  object-fit: cover;
  object-position: center;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

/* 第七屏：主图全屏延展，外围以同图宽幅虚化柔和收边；标题直接压在底图上 */
.closing-section {
  isolation: isolate;
  overflow: hidden;
  background: #f7efe3;
}

.closing-section::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: -8%;
  background:
    linear-gradient(rgba(247, 239, 227, .08), rgba(247, 239, 227, .08)),
    url("assets/板块素材/06_升学成果与报考咨询/图片/00_录取通知书主视觉_用户替换_20260729.png") center / cover no-repeat;
  filter: blur(32px) saturate(.8) brightness(1.05);
  transform: scale(1.03);
  opacity: 1;
  pointer-events: none;
}

.closing-section::after {
  content: "";
  position: absolute;
  z-index: 2;
  inset: -5%;
  background:
    url("assets/板块素材/06_升学成果与报考咨询/图片/00_录取通知书主视觉_用户替换_20260729.png") center / cover no-repeat;
  filter: blur(25px) saturate(.8) brightness(1.05);
  opacity: .72;
  -webkit-mask-image: radial-gradient(ellipse at center, transparent 0 57%, rgba(0, 0, 0, .16) 67%, #000 88%);
  mask-image: radial-gradient(ellipse at center, transparent 0 57%, rgba(0, 0, 0, .16) 67%, #000 88%);
  pointer-events: none;
}

.closing-section .closing-admission-visual {
  position: absolute;
  z-index: 1;
  inset: -1.5%;
  width: 103%;
  height: 103%;
  min-height: 103%;
  object-fit: cover;
  object-position: center;
  border: 0;
  border-radius: 0;
  box-shadow: none;
}

.closing-section .closing-title {
  position: absolute;
  z-index: 3;
  left: 50%;
  right: auto;
  bottom: calc(var(--preview-safe-bottom, max(34px, env(safe-area-inset-bottom))) + 18px);
  width: max-content;
  max-width: calc(100% - 48px);
  margin: 0;
  padding: 0;
  transform: translateX(-50%);
  border: 0;
  border-radius: 0;
  background: none;
  box-shadow: none;
  backdrop-filter: none;
  color: #fff8e8;
  font-size: clamp(19px, 4.7vw, 24px);
  font-weight: 800;
  letter-spacing: .07em;
  line-height: 1.25;
  text-align: center;
  white-space: nowrap;
  -webkit-text-stroke: .45px rgba(10, 48, 41, .96);
  text-shadow:
    -1px 0 0 rgba(10, 48, 41, .94),
    1px 0 0 rgba(10, 48, 41, .94),
    0 -1px 0 rgba(10, 48, 41, .94),
    0 1px 0 rgba(10, 48, 41, .94),
    0 4px 16px rgba(6, 31, 26, .72);
}

.closing-admission-hotspot {
  position: absolute;
  z-index: 4;
  top: 54%;
  right: 4%;
  bottom: 7%;
  left: 14%;
  padding: 0;
  border: 0;
  outline: 0;
  color: inherit;
  background: transparent;
  cursor: pointer;
  -webkit-tap-highlight-color: transparent;
}

.closing-letter-gesture {
  position: absolute;
  top: 1%;
  left: 50%;
  display: block;
  width: min(78%, 250px);
  height: 108px;
  transform: translateX(-50%) rotate(-1deg);
  color: #173f36;
  text-align: center;
  transition: transform .18s ease;
}

.closing-letter-gesture::before,
.closing-letter-gesture::after {
  content: "";
  position: absolute;
  left: 50%;
  bottom: -7px;
  width: 72%;
  height: 27%;
  border: 1px solid rgba(38, 87, 76, .5);
  border-radius: 50%;
  box-shadow:
    0 0 0 7px rgba(55, 101, 89, .2),
    0 0 0 15px rgba(91, 126, 108, .14),
    0 0 0 24px rgba(177, 138, 80, .09);
  opacity: .18;
  pointer-events: none;
  transform: translateX(-50%) scale(.62);
  animation: guide-water-pulse 4.2s ease-out infinite;
}

.closing-letter-gesture::after {
  width: 88%;
  height: 36%;
  border-color: rgba(177, 138, 80, .32);
  box-shadow:
    0 0 0 9px rgba(76, 116, 101, .12),
    0 0 0 19px rgba(177, 151, 103, .08);
  animation-delay: .42s;
}

.closing-letter-gesture-copy {
  position: relative;
  z-index: 2;
  display: grid;
  gap: 2px;
  font-family: "Songti SC", "STSong", "Noto Serif SC", serif;
  text-shadow:
    0 1px 0 rgba(255, 250, 240, .98),
    0 0 7px rgba(255, 250, 240, .94),
    0 0 15px rgba(255, 250, 240, .78);
}

.closing-letter-gesture-copy small {
  color: rgba(23, 63, 54, .74);
  font-size: 11px;
  font-weight: 700;
  letter-spacing: .2em;
}

.closing-letter-gesture-copy strong {
  font-size: 14px;
  font-weight: 800;
  letter-spacing: .05em;
  white-space: nowrap;
}

.closing-letter-water-arrow {
  top: 50px;
  transform: translateX(-50%) scale(.86);
  transform-origin: 50% 0;
}

.closing-admission-hotspot:active .closing-letter-gesture {
  transform: translateX(-50%) translateY(-3px) rotate(-1deg) scale(.98);
}

.closing-guide-button {
  position: absolute;
  z-index: 5;
  top: calc(var(--preview-safe-top, max(47px, env(safe-area-inset-top))) + 8px);
  right: calc(var(--preview-safe-right, max(16px, env(safe-area-inset-right))) + 4px);
  display: flex;
  min-width: 166px;
  min-height: 48px;
  padding: 7px 11px;
  border: 1px solid rgba(198, 166, 90, .66);
  border-radius: 3px;
  color: #173f36;
  background: rgba(251, 247, 238, .84);
  box-shadow: 0 7px 22px rgba(23, 63, 54, .14);
  backdrop-filter: blur(9px);
  align-items: center;
  gap: 8px;
  text-align: left;
}

.closing-guide-button > span:first-child {
  display: grid;
  width: 27px;
  height: 27px;
  flex: 0 0 27px;
  border: 1px solid rgba(198, 166, 90, .58);
  border-radius: 50%;
  color: #fff8e8;
  background: rgba(23, 63, 54, .92);
  font-size: 15px;
  place-items: center;
}

.closing-guide-button > span:last-child {
  display: grid;
  gap: 1px;
}

.closing-guide-button strong {
  font-size: 14px;
  font-weight: 800;
  line-height: 1.2;
}

.closing-guide-button small {
  color: rgba(23, 63, 54, .68);
  font-size: 10px;
  line-height: 1.25;
  white-space: nowrap;
}

.closing-letter-backdrop {
  z-index: 25;
  overflow: hidden;
  padding: 14px;
  background:
    radial-gradient(circle at 50% 20%, rgba(247, 239, 227, .2), transparent 42%),
    linear-gradient(180deg, rgba(14, 44, 38, .62), rgba(10, 31, 27, .8));
  backdrop-filter: blur(8px);
}

.closing-letter-scene {
  position: relative;
  width: min(100%, 430px);
  height: min(720px, calc(100dvh - 28px));
  overflow: hidden;
  outline: 0;
  perspective: 1200px;
}

.closing-letter-close {
  position: absolute;
  z-index: 8;
  top: 8px;
  right: 8px;
  display: grid;
  width: 44px;
  height: 44px;
  padding: 0;
  border: 1px solid rgba(224, 195, 128, .78);
  border-radius: 50%;
  color: #fff8e8;
  background: rgba(20, 62, 53, .94);
  box-shadow: 0 7px 22px rgba(8, 34, 29, .3);
  font-size: 30px;
  font-weight: 300;
  line-height: 1;
  place-items: center;
}

.closing-letter-envelope {
  position: absolute;
  z-index: 4;
  right: 7%;
  bottom: 0;
  left: 7%;
  height: 26%;
  overflow: hidden;
  transform: translateY(6%) rotate(-1deg);
  border: 1px solid rgba(229, 207, 161, .56);
  background:
    linear-gradient(158deg, transparent 0 48%, rgba(255, 255, 255, .12) 49% 50%, transparent 51%),
    linear-gradient(202deg, transparent 0 48%, rgba(255, 255, 255, .1) 49% 50%, transparent 51%),
    linear-gradient(145deg, #683c8c, #4c286d 58%, #391d57);
  box-shadow:
    0 -7px 25px rgba(44, 22, 64, .2),
    0 20px 45px rgba(4, 24, 20, .4);
  clip-path: polygon(2% 4%, 98% 0, 100% 96%, 3% 100%);
}

.closing-letter-envelope::before {
  content: "";
  position: absolute;
  inset: 13% 5% 12%;
  border: 1px solid rgba(230, 213, 179, .24);
  background:
    linear-gradient(90deg, transparent 0 8%, rgba(234, 219, 188, .16) 8.5% 9%, transparent 9.5% 91%, rgba(234, 219, 188, .14) 91.5% 92%, transparent 92.5%),
    linear-gradient(rgba(255, 255, 255, .04), rgba(255, 255, 255, 0));
  pointer-events: none;
}

.closing-letter-envelope span {
  position: absolute;
  top: 22%;
  left: 50%;
  width: max-content;
  transform: translateX(-50%);
  color: rgba(245, 227, 186, .84);
  font-family: "STKaiti", "KaiTi", "Kaiti SC", serif;
  font-size: 13px;
  letter-spacing: .12em;
}

.closing-letter-envelope strong {
  position: absolute;
  right: 8%;
  bottom: -8%;
  color: rgba(245, 227, 186, .42);
  font-family: Georgia, serif;
  font-size: clamp(68px, 18vw, 92px);
  line-height: 1;
  letter-spacing: -.08em;
}

.closing-letter-paper {
  position: absolute;
  z-index: 3;
  inset: 16px 10px 32px;
  overflow: hidden;
  transform: translate3d(0, 70%, 0) rotate(-3deg) scale(.9);
  transform-origin: 50% 100%;
  border: 1px solid rgba(184, 148, 79, .66);
  border-radius: 3px;
  background:
    radial-gradient(circle at 16% 9%, rgba(195, 164, 105, .12), transparent 23%),
    radial-gradient(circle at 88% 84%, rgba(116, 139, 119, .09), transparent 24%),
    repeating-linear-gradient(0deg, transparent 0 31px, rgba(72, 91, 79, .045) 32px),
    #fbf5e8;
  box-shadow:
    0 0 0 5px rgba(255, 250, 240, .12),
    0 26px 70px rgba(5, 28, 23, .38);
  opacity: .2;
}

.closing-letter-paper::before {
  content: "";
  position: absolute;
  z-index: 0;
  inset: 12px;
  border: 1px solid rgba(198, 166, 90, .3);
  pointer-events: none;
}

.closing-letter-scroll {
  position: relative;
  z-index: 1;
  height: 100%;
  overflow-y: auto;
  padding: 34px 28px 30px;
  scrollbar-width: thin;
  scrollbar-color: rgba(23, 63, 54, .3) transparent;
  opacity: 0;
}

.closing-letter-kicker {
  margin: 0 0 6px;
  color: #9a7036;
  font-family: "STKaiti", "KaiTi", "Kaiti SC", serif;
  font-size: 13px;
  font-weight: 700;
  letter-spacing: .16em;
  text-align: center;
}

.closing-letter-scroll h2 {
  margin: 0 0 20px;
  color: #21473e;
  font-family: "STKaiti", "KaiTi", "Kaiti SC", serif;
  font-size: clamp(23px, 6vw, 29px);
  font-weight: 700;
  line-height: 1.28;
  letter-spacing: .05em;
  text-align: center;
}

.closing-letter-copy {
  color: #374d46;
  font-family: "STKaiti", "KaiTi", "Kaiti SC", serif;
  font-size: 15px;
  line-height: 1.82;
  text-align: justify;
}

.closing-letter-copy p {
  margin: 0 0 13px;
}

.closing-letter-copy p:first-child {
  color: #24483f;
  font-weight: 700;
  text-align: left;
}

.closing-letter-signature {
  display: grid;
  margin: 20px 0 18px;
  color: #24483f;
  font-family: "STKaiti", "KaiTi", "Kaiti SC", serif;
  gap: 7px;
  text-align: right;
}

.closing-letter-signature span {
  font-size: 14px;
  line-height: 1.55;
}

.closing-letter-signature strong {
  font-size: 15px;
  letter-spacing: .05em;
}

.closing-letter-actions {
  display: grid;
  gap: 10px;
}

.closing-letter-actions button {
  min-height: 48px;
  padding: 10px 15px;
  border: 1px solid rgba(198, 166, 90, .66);
  border-radius: 3px;
  color: #fff8e8;
  background: rgba(23, 63, 54, .94);
  box-shadow: 0 7px 18px rgba(23, 63, 54, .14);
  font-size: 15px;
  font-weight: 800;
}

.closing-letter-actions button + button {
  color: #21473e;
  background: rgba(251, 247, 238, .72);
}

.closing-letter-note {
  margin: 12px 0 0;
  color: rgba(55, 77, 70, .68);
  font-family: "STKaiti", "KaiTi", "Kaiti SC", serif;
  font-size: 12px;
  line-height: 1.5;
  text-align: center;
}

.closing-letter-backdrop.is-open .closing-letter-paper {
  animation: closing-letter-pull-out 1.02s cubic-bezier(.18, .78, .2, 1) forwards;
}

.closing-letter-backdrop.is-open .closing-letter-envelope {
  animation: closing-envelope-settle .78s .58s cubic-bezier(.2, .7, .2, 1) forwards;
}

.closing-letter-backdrop.is-open .closing-letter-scroll {
  animation: closing-letter-content-in .46s .63s ease forwards;
}

@keyframes closing-letter-pull-out {
  0% {
    transform: translate3d(0, 70%, 0) rotate(-3deg) scale(.9);
    opacity: .2;
  }
  54% {
    transform: translate3d(0, -1.8%, 0) rotate(.8deg) scale(1.008);
    opacity: 1;
  }
  76% {
    transform: translate3d(0, .6%, 0) rotate(-.6deg) scale(.998);
  }
  100% {
    transform: translate3d(0, 0, 0) rotate(-.25deg) scale(1);
    opacity: 1;
  }
}

@keyframes closing-envelope-settle {
  to {
    transform: translateY(73%) rotate(-1deg);
    opacity: .86;
  }
}

@keyframes closing-letter-content-in {
  from {
    transform: translateY(10px);
    opacity: 0;
  }
  to {
    transform: translateY(0);
    opacity: 1;
  }
}

@media (max-height: 760px) {
  .closing-letter-gesture {
    top: 0;
    height: 100px;
  }

  .closing-guide-button {
    min-height: 44px;
  }

  .closing-letter-scroll {
    padding: 30px 23px 52px;
  }

  .closing-letter-scroll h2 {
    margin-bottom: 15px;
    font-size: 22px;
  }

  .closing-letter-copy {
    font-size: 14px;
    line-height: 1.72;
  }

  .closing-letter-copy p {
    margin-bottom: 10px;
  }
}

@media (prefers-reduced-motion: reduce) {
  .closing-letter-backdrop.is-open .closing-letter-paper,
  .closing-letter-backdrop.is-open .closing-letter-envelope,
  .closing-letter-backdrop.is-open .closing-letter-scroll,
  .closing-letter-gesture::before,
  .closing-letter-gesture::after,
  .closing-letter-water-arrow,
  .closing-letter-water-arrow::after {
    animation-duration: .01ms;
    animation-delay: 0ms;
  }
}

/* 第六屏：安全区、导览、双排视频与底部转化区的最终协调版 */
#results {
  display: flex;
  flex-direction: column;
  padding:
    calc(var(--preview-safe-top, max(48px, env(safe-area-inset-top))) + 52px)
    calc(var(--preview-safe-right, max(16px, env(safe-area-inset-right))) + 6px)
    calc(var(--preview-safe-bottom, max(34px, env(safe-area-inset-bottom))) + 6px)
    calc(var(--preview-safe-left, max(16px, env(safe-area-inset-left))) + 6px);
}

#results > .school-guide-button {
  top: calc(var(--preview-safe-top, max(48px, env(safe-area-inset-top))) + 5px);
  right: calc(var(--preview-safe-right, max(16px, env(safe-area-inset-right))) + 6px);
}

#results .results-offer-interview {
  width: 92%;
}

#results .results-offer-stack {
  height: clamp(184px, 20svh, 225px);
  min-height: clamp(184px, 20svh, 225px);
}

#results .results-offer-stack .offer-wall.offer-showcase,
#results .results-offer-stack .offer-lane {
  height: calc(clamp(184px, 20svh, 225px) - 50px);
}

#results .results-video-section {
  flex: 0 0 auto;
  margin-top: clamp(6px, .9svh, 10px);
}

#results .results-featured-videos {
  --results-row-height: clamp(88px, 10svh, 112px);
  height: auto;
  min-height: calc((var(--results-row-height) * 2) + 16px);
  grid-template-rows: repeat(2, var(--results-row-height));
  row-gap: 10px;
  margin-right: calc((var(--preview-safe-right, 16px) + 6px) * -1);
  margin-left: calc((var(--preview-safe-left, 16px) + 6px) * -1);
  padding-right: calc(var(--preview-safe-right, 16px) + 6px);
  padding-left: calc(var(--preview-safe-left, 16px) + 6px);
}

#results .results-video-row,
#results .results-video-row-secondary {
  padding-right: 0;
  padding-left: 0;
}

#results .results-story-card {
  flex-basis: 46%;
  height: var(--results-row-height);
}

#results .final-cta {
  flex: 0 0 auto;
  width: 100%;
  margin-top: auto;
  margin-bottom: 0;
}

/* 第五屏：第三个横向说明块改为两列，指定短句保持完整单行 */
.project-info-backdrop[data-project-detail="supportPlan"] .project-info-section-card:nth-child(3) ul,
.project-info-backdrop[data-project-detail="supportWalking"] .project-info-section-card:nth-child(3) ul {
  grid-template-columns: repeat(2, minmax(0, 1fr));
  column-gap: 12px;
}

.project-info-backdrop[data-project-detail="supportPlan"] .project-info-section-card:nth-child(3) li,
.project-info-backdrop[data-project-detail="supportWalking"] .project-info-section-card:nth-child(3) li {
  overflow: visible;
  text-overflow: clip;
  white-space: nowrap;
}

/* 第六屏：喜报完整展示、访谈封面更新后扩大双排成果视频 */
#results .results-offer-stack .offer-wall.offer-showcase {
  -webkit-mask-image: none;
  mask-image: none;
}

#results .results-offer-stack .offer-sequence {
  align-items: center;
  padding-top: 3px;
  padding-bottom: 8px;
}

#results .results-offer-stack .offer-sequence .offer-card,
#results .results-offer-stack .offer-sequence .offer-card:nth-child(n),
#results .results-offer-stack .offer-sequence .offer-card:first-child {
  flex: 0 0 auto;
  width: 92px;
  height: 164px;
  aspect-ratio: 750 / 1334;
  overflow: hidden;
}

#results .results-offer-stack .offer-sequence .offer-card img {
  width: 100%;
  height: 100%;
  aspect-ratio: auto;
  object-fit: contain;
  object-position: center;
}

#results .results-featured-videos {
  --results-row-height: clamp(104px, 11.5svh, 124px);
  min-height: calc((var(--results-row-height) * 2) + 18px);
  row-gap: 12px;
}

#results .results-story-card {
  flex-basis: 52%;
}

/* 第六屏：曹文娜同学源视频与访谈封面在 H5 内直接播放 */
#results .results-offer-interview-media > .unified-video-player {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 0;
  border: 0;
  background: #17211d;
  object-fit: cover;
  object-position: center;
}

#results .results-offer-interview-media.is-playing .results-offer-interview-media-label,
#results .results-offer-interview-media.is-playing + .results-offer-interview-copy {
  opacity: 0;
  pointer-events: none;
}

#results .results-offer-interview-copy,
#results .results-offer-interview-media-label {
  transition: opacity .2s ease;
}

/* 全 7 屏手机适配：统一使用动态视口，并兼容预览器、多尺寸刘海屏和底部安全区。 */
:root {
  --phone-screen-height: 100svh;
}

@supports (height: 100dvh) {
  :root {
    --phone-screen-height: 100dvh;
  }
}

html,
body,
.app-shell {
  width: 100%;
  max-width: 100%;
}

.app-shell {
  width: min(100%, 520px);
}

img,
video {
  max-width: 100%;
}

.hero-card,
.school-screen,
.integrated-project-section,
.majors-section,
.support-redesign,
#results,
.closing-section {
  height: var(--preview-screen-height, var(--phone-screen-height));
  min-height: var(--preview-screen-height, var(--phone-screen-height));
  max-height: var(--preview-screen-height, var(--phone-screen-height));
}

.school-screen,
.integrated-project-content,
.majors-screen,
.support-redesign,
#results {
  min-width: 0;
}

@media (max-width: 374px) {
  .school-screen,
  .integrated-project-section,
  .majors-section,
  .support-redesign,
  #results {
    padding-right: max(14px, env(safe-area-inset-right));
    padding-left: max(14px, env(safe-area-inset-left));
  }

  .school-title,
  .project-intro > h2,
  .majors-intro > h2,
  .support-intro > h2,
  #results > h2 {
    overflow-wrap: anywhere;
  }
}

@media (max-height: 720px) {
  .support-redesign {
    grid-template-rows: auto auto minmax(82px, 1fr) minmax(82px, 1fr) auto auto;
    gap: 4px;
    padding-top: calc(max(38px, env(safe-area-inset-top)) + 34px);
    padding-bottom: max(18px, env(safe-area-inset-bottom));
  }

  .support-redesign .support-intro > h2 {
    font-size: 19px;
  }

  .support-redesign .support-intro > .section-lead {
    margin-block: 3px 4px;
    font-size: 9px;
    line-height: 1.3;
  }

  #results {
    padding-top: calc(max(38px, env(safe-area-inset-top)) + 36px);
    padding-bottom: max(18px, env(safe-area-inset-bottom));
  }

  #results > .section-lead {
    min-height: 0;
    padding-block: 3px;
  }

  #results .results-offer-stack {
    height: 150px;
    min-height: 150px;
  }

  #results .results-offer-stack .offer-wall.offer-showcase,
  #results .results-offer-stack .offer-lane {
    height: 104px;
  }

  #results .results-offer-stack .offer-sequence .offer-card,
  #results .results-offer-stack .offer-sequence .offer-card:nth-child(n),
  #results .results-offer-stack .offer-sequence .offer-card:first-child {
    width: 58px;
    height: 103px;
  }

  #results .results-featured-videos {
    --results-row-height: 72px;
    min-height: 154px;
  }

  #results .final-cta {
    padding-block: 7px;
  }
}

/* iPhone SE 等短屏：保留全部成果内容，同时确保底部行动入口完整露出。 */
@media (max-height: 980px) {
  #results {
    padding-top: calc(var(--preview-safe-top, max(42px, env(safe-area-inset-top))) + 35px);
  }

  #results .results-offer-interview {
    width: 78%;
  }

  #results .results-offer-stack {
    height: 165px;
    min-height: 165px;
  }

  #results .results-offer-stack .offer-wall.offer-showcase,
  #results .results-offer-stack .offer-lane {
    height: 115px;
  }

  #results .results-offer-stack .offer-sequence .offer-card,
  #results .results-offer-stack .offer-sequence .offer-card:nth-child(n),
  #results .results-offer-stack .offer-sequence .offer-card:first-child {
    width: 68px;
    height: 121px;
  }

  #results .results-featured-videos {
    --results-row-height: 78px;
    min-height: 166px;
    row-gap: 8px;
  }

  #results .results-video-section {
    margin-top: 4px;
  }

  #results .final-cta {
    min-height: 44px;
    padding-block: 6px;
  }
}