:root {
      --ink: #17130f;
      --muted: #6f655b;
      --edge: rgba(121, 99, 77, .38);
      --paper: #f6f1e8;
      --paper-hi: #fffdf8;
      --gold: #b3976e;
      --gold-deep: #8b6b43;
      --seal: #a23a31;
      --shadow: rgba(91, 70, 45, .18);
      --ease-out: cubic-bezier(.16, 1, .3, 1);
      --ease-inout: cubic-bezier(.65, 0, .35, 1);
      --spring: cubic-bezier(.2, .85, .24, 1);
}

/* 首页附录部类名称较长，允许自然换行并保持完整可读。 */
.taisho-card.taisho-unclassified strong {
  font-size: 20px;
  line-height: 1.12;
  white-space: normal;
  overflow: visible;
  text-overflow: clip;
}
    * { box-sizing: border-box; }
    html, body { width: 100%; height: 100%; margin: 0; }
    body {
      overflow-x: hidden;
      overflow-y: auto;
      color: var(--ink);
      background:
        radial-gradient(1200px 760px at 58% 44%, rgba(255,255,255,.72), rgba(241,230,214,.84) 48%, rgba(214,194,166,.52) 100%),
        #eee1cd;
      font-family: "Songti SC", "Noto Serif CJK SC", "Source Han Serif SC", STSong, "SimSun", serif;
      -webkit-font-smoothing: antialiased;
      text-rendering: geometricPrecision;
      display: block;
    }
    button, input { font: inherit; }
    .stage {
      --stage-w: 100vw;
      --stage-h: max(100vh, calc(100vw * 941 / 1672));
      position: relative;
      width: var(--stage-w);
      height: var(--stage-h);
      min-height: 100vh;
      overflow: hidden;
      isolation: isolate;
      background:
        linear-gradient(90deg, rgba(255,255,255,.56), rgba(255,255,255,.22) 45%, rgba(255,255,255,.02)),
        radial-gradient(760px 330px at 50% 47%, rgba(221,220,209,.26), transparent 72%),
        radial-gradient(520px 260px at 40% 60%, rgba(205,200,186,.16), transparent 70%),
        #f5efe6;
      box-shadow: 0 calc(var(--stage-w) * .018) calc(var(--stage-w) * .055) rgba(72,52,31,.12);
      transform: translateZ(0);
    }
    .stage::before {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background-image: url("data:image/svg+xml;charset=utf-8,<svg%20xmlns='http://www.w3.org/2000/svg'%20width='220'%20height='220'%20viewBox='0%200%20220%20220'><filter%20id='n'><feTurbulence%20type='fractalNoise'%20baseFrequency='.72'%20numOctaves='4'%20stitchTiles='stitch'/><feColorMatrix%20type='saturate'%20values='0'/><feComponentTransfer><feFuncA%20type='table'%20tableValues='0%20.08'/></feComponentTransfer></filter><rect%20width='220'%20height='220'%20filter='url(%23n)'%20opacity='.6'/></svg>");
      background-size: calc(var(--stage-w) * .13) auto;
      opacity: .74;
      mix-blend-mode: multiply;
    }
    .stage::after {
      content: "";
      position: absolute;
      inset: 0;
      z-index: 0;
      pointer-events: none;
      background:
        radial-gradient(520px 260px at 50% 40%, rgba(180, 170, 150, .10), transparent 70%),
        linear-gradient(180deg, rgba(255,255,255,.28), transparent 52%, rgba(201,172,138,.06));
    }
    .hero-art {
      position: absolute;
      left: calc(535 / 1672 * 100%);
      top: 0;
      z-index: 1;
      width: calc(1137 / 1672 * 100%);
      height: 100%;
      object-fit: fill;
      pointer-events: none;
      user-select: none;
    }
    .title-img {
      position: absolute;
      left: calc(145 / 1672 * 100%);
      top: calc(170 / 941 * 100%);
      z-index: 2;
      width: calc(515 / 1672 * 100%);
      height: calc(180 / 941 * 100%);
      object-fit: fill;
      pointer-events: none;
      user-select: none;
      filter: drop-shadow(0 calc(var(--stage-w) * .002) calc(var(--stage-w) * .0014) rgba(42, 35, 27, .06));
    }
    .subtitle-img {
      position: absolute;
      left: calc(150 / 1672 * 100%);
      top: calc(360 / 941 * 100%);
      z-index: 2;
      width: calc(420 / 1672 * 100%);
      height: calc(60 / 941 * 100%);
      object-fit: fill;
      pointer-events: none;
      user-select: none;
      opacity: .94;
    }
    .sr-only {
      position: absolute;
      width: 1px;
      height: 1px;
      padding: 0;
      margin: -1px;
      overflow: hidden;
      clip: rect(0, 0, 0, 0);
      white-space: nowrap;
      border: 0;
    }

    /* 真组件搜索框：不是覆盖在截图上的毛玻璃，而是可输入、可提交的页面部件 */
    .search-wrap {
      position: absolute;
      left: calc(160 / 1672 * 100%);
      top: calc(457 / 941 * 100%);
      z-index: 6;
      width: calc(596 / 1672 * 100%);
      height: calc(76 / 941 * 100%);
      overflow: visible;
    }
    .search-form {
      --mx: 50%;
      --my: 50%;
      position: relative;
      width: 100%;
      height: 100%;
      display: flex;
      align-items: center;
      border-radius: calc(var(--stage-w) * .0066);
      border: calc(var(--stage-w) * .00072) solid rgba(112, 97, 82, .52);
      background:
        radial-gradient(ellipse calc(var(--stage-w) * .30) calc(var(--stage-w) * .09) at var(--mx) var(--my), rgba(255,255,255,.38), transparent 68%),
        linear-gradient(180deg, rgba(255,255,255,.48), rgba(248,241,231,.38));
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.78),
        inset 0 -1px 0 rgba(126,100,71,.10),
        0 calc(var(--stage-w) * .004) calc(var(--stage-w) * .018) rgba(77,55,35,.055);
      overflow: hidden;
      transform: translateZ(0);
      transition:
        border-color 420ms var(--ease-out),
        box-shadow 520ms var(--ease-out),
        background 520ms var(--ease-out),
        transform 520ms var(--spring);
    }
    .search-form:hover {
      border-color: rgba(122, 93, 61, .72);
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.86),
        0 calc(var(--stage-w) * .008) calc(var(--stage-w) * .026) rgba(77,55,35,.09);
    }
    .search-wrap:focus-within .search-form {
      border-color: rgba(151, 54, 43, .56);
      transform: translateY(calc(var(--stage-w) * -.0012));
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.9),
        0 0 0 calc(var(--stage-w) * .002) rgba(160, 58, 49, .07),
        0 calc(var(--stage-w) * .012) calc(var(--stage-w) * .038) rgba(84,60,36,.13);
    }
    .search-form::after {
      content: "";
      position: absolute;
      left: calc(var(--stage-w) * .030);
      right: calc(var(--stage-w) * .030);
      bottom: 0;
      height: max(1px, calc(var(--stage-w) * .0009));
      background: linear-gradient(90deg, transparent, rgba(153, 54, 45, .78), transparent);
      opacity: 0;
      transform: scaleX(.62);
      transition: opacity 360ms var(--ease-out), transform 620ms var(--ease-out);
    }
    .search-wrap:focus-within .search-form::after { opacity: 1; transform: scaleX(1); }
    .search-form svg {
      flex: 0 0 auto;
      width: calc(var(--stage-w) * .0216);
      height: calc(var(--stage-w) * .0216);
      margin-left: calc(var(--stage-w) * .0142);
      margin-right: calc(var(--stage-w) * .0150);
      stroke: rgba(42, 40, 38, .88);
      transition: stroke 360ms var(--ease-out), transform 520ms var(--spring);
    }
    .search-wrap:focus-within svg { stroke: rgba(128, 55, 46, .9); transform: scale(1.035); }
    .search-input {
      width: 100%;
      min-width: 0;
      height: 100%;
      border: 0;
      outline: 0;
      color: #27231f;
      background: transparent;
      font-family: "Songti SC", "Noto Serif CJK SC", STSong, serif;
      font-size: 24px;
      letter-spacing: 0;
      padding: 0 116px 0 0;
      caret-color: var(--seal);
    }
    .search-input::placeholder { color: rgba(105,96,86,.78); opacity: 1; }
    .search-input::-webkit-search-cancel-button {
      display: none;
      -webkit-appearance: none;
      appearance: none;
    }
    .search-input::-ms-clear { display: none; }
    .search-clear {
      position: absolute;
      z-index: 2;
      top: 50%;
      right: 104px;
      display: grid;
      place-items: center;
      width: 30px;
      height: 30px;
      padding: 0 0 3px;
      border: 0;
      border-radius: 0;
      background: transparent;
      color: rgba(112, 66, 56, .64);
      font-family: "Segoe UI Symbol", "Segoe UI", sans-serif;
      font-size: 23px;
      font-weight: 300;
      line-height: 1;
      cursor: pointer;
      opacity: 0;
      visibility: hidden;
      pointer-events: none;
      transform: translateY(-50%) scale(.88);
      transition: opacity 180ms var(--ease-out), visibility 180ms var(--ease-out), color 180ms var(--ease-out), background 180ms var(--ease-out), border-color 180ms var(--ease-out), transform 240ms var(--spring);
    }
    .search-form.has-query .search-clear {
      opacity: 1;
      visibility: visible;
      pointer-events: auto;
      transform: translateY(-50%) scale(1);
    }
    .search-clear:hover,
    .search-clear:focus-visible {
      background: transparent;
      color: rgba(112, 43, 37, .92);
      outline: none;
    }
    .search-clear:active { transform: translateY(-50%) scale(.94); }
    .search-submit {
      position: absolute;
      right: 9px;
      top: 9px;
      bottom: 9px;
      min-width: 86px;
      border: 0;
      border-radius: 14px;
      background: linear-gradient(135deg, rgba(124, 42, 36, .96), rgba(87, 31, 28, .92));
      color: rgba(255,255,255,.96);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      font-size: 16px;
      font-weight: 650;
      letter-spacing: 0;
      cursor: pointer;
      box-shadow: 0 10px 24px rgba(96, 38, 31, .18), inset 0 1px 0 rgba(255,255,255,.22);
      transition: transform 220ms var(--ease-out), box-shadow 220ms var(--ease-out), filter 220ms var(--ease-out);
    }
    .search-submit:hover,
    .search-submit:focus-visible {
      filter: brightness(1.04);
      transform: translateY(-1px);
      box-shadow: 0 14px 30px rgba(96, 38, 31, .22), inset 0 1px 0 rgba(255,255,255,.26);
      outline: none;
    }
    .search-suggestions {
      position: absolute;
      top: calc(100% + var(--stage-w) * .010);
      left: 0;
      width: 100%;
      display: grid;
      grid-template-columns: repeat(4, 1fr);
      gap: calc(var(--stage-w) * .006);
      padding: calc(var(--stage-w) * .006);
      border: 1px solid rgba(125, 103, 78, .20);
      border-radius: calc(var(--stage-w) * .008);
      background: linear-gradient(180deg, rgba(255,253,249,.96), rgba(246,238,226,.94));
      box-shadow: 0 calc(var(--stage-w) * .018) calc(var(--stage-w) * .045) rgba(73, 51, 29, .12);
      opacity: 0;
      transform: translateY(calc(var(--stage-w) * -.008)) scale(.985);
      transform-origin: top center;
      pointer-events: none;
      transition: opacity 280ms var(--ease-out), transform 520ms var(--ease-out);
    }
    .search-wrap:focus-within .search-suggestions {
      opacity: 1;
      transform: translateY(0) scale(1);
      pointer-events: auto;
    }
    .search-suggestions a {
      display: block;
      min-height: calc(var(--stage-w) * .035);
      padding: calc(var(--stage-w) * .006) calc(var(--stage-w) * .005);
      border-radius: calc(var(--stage-w) * .005);
      color: #3c332a;
      text-decoration: none;
      text-align: center;
      font-size: 15px;
      line-height: 1.25;
      background: rgba(255,255,255,.34);
      transition: background 260ms var(--ease-out), transform 360ms var(--spring), color 260ms var(--ease-out);
    }
    .search-suggestions a:hover { background: rgba(181, 151, 105, .15); color: #7d342c; transform: translateY(-1px); }
    .search-suggestions small { display: block; margin-top: .25em; color: rgba(94,80,64,.58); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif; font-size: .78em; letter-spacing: .02em; }

    .card-layer {
      position: absolute;
      inset: 0;
      z-index: 5;
      pointer-events: none;
    }
    .canon-card {
      --mx: 50%;
      --my: 50%;
      --rx: 0deg;
      --ry: 0deg;
      position: absolute;
      top: calc(654 / 941 * 100%);
      height: calc(246 / 941 * 100%);
      display: block;
      text-decoration: none;
      color: transparent;
      border-radius: calc(var(--stage-w) * .0038);
      background-size: 100% 100%;
      background-repeat: no-repeat;
      background-position: center;
      overflow: hidden;
      pointer-events: auto;
      transform: perspective(1200px) translate3d(0, 0, 0) rotateX(0deg) rotateY(0deg) scale(1);
      transform-style: preserve-3d;
      box-shadow: 0 0 0 rgba(0,0,0,0);
      outline: none;
      -webkit-tap-highlight-color: transparent;
      will-change: transform, box-shadow, filter;
      transition:
        transform 620ms var(--spring),
        box-shadow 620ms var(--ease-out),
        filter 620ms var(--ease-out);
    }
    .canon-card:nth-child(1) { left: calc(60 / 1672 * 100%); width: calc(303 / 1672 * 100%); background-image: url("../images/home-css-01.webp"); }
    .canon-card:nth-child(2) { left: calc(363 / 1672 * 100%); width: calc(314 / 1672 * 100%); background-image: url("../images/home-css-02.webp"); }
    .canon-card:nth-child(3) { left: calc(677 / 1672 * 100%); width: calc(314 / 1672 * 100%); background-image: url("../images/home-css-03.webp"); }
    .canon-card:nth-child(4) { left: calc(991 / 1672 * 100%); width: calc(313 / 1672 * 100%); background-image: url("../images/home-css-04.webp"); }
    .canon-card:nth-child(5) { left: calc(1304 / 1672 * 100%); width: calc(306 / 1672 * 100%); background-image: url("../images/home-css-05.webp"); }
    .canon-card::before {
      content: "";
      position: absolute;
      inset: 0;
      pointer-events: none;
      border-radius: inherit;
      background:
        radial-gradient(ellipse calc(var(--stage-w) * .20) calc(var(--stage-w) * .13) at var(--mx) var(--my), rgba(191, 149, 92, .12), transparent 58%),
        linear-gradient(180deg, rgba(255,255,255,.22), rgba(255,255,255,0) 40%, rgba(113,80,42,.025));
      opacity: 0;
      transition: opacity 460ms var(--ease-out);
    }
    .canon-card::after {
      content: "";
      position: absolute;
      left: 50%;
      bottom: calc(var(--stage-w) * .021);
      width: calc(var(--stage-w) * .028);
      height: max(1px, calc(var(--stage-w) * .0011));
      border-radius: 999px;
      background: linear-gradient(90deg, transparent, rgba(159, 48, 39, .9), transparent);
      opacity: 0;
      transform: translateX(-50%) scaleX(.25);
      transition: opacity 420ms var(--ease-out), transform 640ms var(--spring);
    }
    .canon-card:hover,
    .canon-card:focus-visible,
    .canon-card.is-pressing { z-index: 10; }
    .canon-card:focus-visible {
      box-shadow: 0 0 0 calc(var(--stage-w) * .0022) rgba(152, 58, 48, .24), 0 calc(var(--stage-w) * .012) calc(var(--stage-w) * .032) rgba(78,56,33,.14);
    }
    @media (hover: hover) and (pointer: fine) {
      .canon-card:hover {
        transform:
          perspective(1200px)
          translate3d(0, calc(var(--stage-w) * -.0065), 0)
          rotateX(var(--rx))
          rotateY(var(--ry))
          scale(1.012);
        box-shadow:
          0 calc(var(--stage-w) * .012) calc(var(--stage-w) * .034) rgba(90,67,38,.15),
          0 calc(var(--stage-w) * .003) calc(var(--stage-w) * .008) rgba(90,67,38,.10);
        filter: saturate(1.035) contrast(1.012);
      }
      .canon-card:hover::before { opacity: 1; }
      .canon-card:hover::after { opacity: .96; transform: translateX(-50%) scaleX(1.02); }
    }
    .canon-card.is-pressing {
      transform: perspective(1200px) translate3d(0, calc(var(--stage-w) * -.0018), 0) scale(.993) !important;
      transition-duration: 120ms;
      box-shadow: 0 calc(var(--stage-w) * .005) calc(var(--stage-w) * .014) rgba(76,52,29,.12) !important;
    }
    .ink-ripple {
      position: absolute;
      left: var(--ripple-x);
      top: var(--ripple-y);
      width: calc(var(--stage-w) * .012);
      height: calc(var(--stage-w) * .012);
      border-radius: 50%;
      pointer-events: none;
      transform: translate(-50%, -50%) scale(.1);
      opacity: .56;
      background:
        radial-gradient(circle, rgba(151, 54, 44, .24) 0 18%, rgba(179, 139, 88, .16) 31%, rgba(179,139,88,.07) 46%, transparent 68%);
      mix-blend-mode: multiply;
      animation: inkRipple 760ms var(--ease-out) forwards;
    }
    @keyframes inkRipple {
      0% { transform: translate(-50%, -50%) scale(.1); opacity: .48; filter: blur(0); }
      70% { opacity: .22; }
      100% { transform: translate(-50%, -50%) scale(16); opacity: 0; filter: blur(1px); }
    }

    @media (max-aspect-ratio: 1/1) {
      body { overflow: auto; }
      .stage {
        --stage-w: 100vw;
        --stage-h: calc(100vw * 941 / 1672);
        min-width: 0;
        min-height: max(100vh, calc(100vw * 941 / 1672));
      }
    }
    @media (prefers-reduced-motion: reduce) {
      *, *::before, *::after {
        animation-duration: .001ms !important;
        animation-iteration-count: 1 !important;
        scroll-behavior: auto !important;
        transition-duration: .001ms !important;
      }
    }

    .taisho-layer {
      position: absolute;
      left: calc(74 / 1672 * 100%);
      right: calc(74 / 1672 * 100%);
      bottom: calc(35 / 941 * 100%);
      height: calc(295 / 941 * 100%);
      z-index: 6;
      display: grid;
      grid-template-columns: repeat(9, minmax(0, 1fr));
      gap: calc(var(--stage-w) * .006);
      pointer-events: auto;
    }
    .taisho-card {
      position: relative;
      display: flex;
      flex-direction: column;
      justify-content: center;
      min-width: 0;
      padding: calc(var(--stage-w) * .0085) calc(var(--stage-w) * .0095);
      border: 1px solid rgba(138, 104, 65, .18);
      border-radius: calc(var(--stage-w) * .011);
      color: rgba(48, 42, 35, .92);
      text-decoration: none;
      background:
        linear-gradient(180deg, rgba(255,255,255,.76), rgba(255,255,255,.43)),
        radial-gradient(circle at 20% 0%, rgba(255,255,255,.85), transparent 56%);
      box-shadow:
        0 calc(var(--stage-w) * .0045) calc(var(--stage-w) * .018) rgba(61, 47, 34, .075),
        inset 0 1px 0 rgba(255,255,255,.72);
      backdrop-filter: blur(18px) saturate(1.05);
      -webkit-backdrop-filter: blur(18px) saturate(1.05);
      transform: translateY(0) scale(1);
      transition: transform 460ms var(--spring), box-shadow 460ms var(--ease-out), border-color 320ms var(--ease-out), background 320ms var(--ease-out);
      overflow: hidden;
    }
    .taisho-card::after {
      content: "";
      position: absolute;
      inset: auto 12% 0 12%;
      height: 1px;
      background: linear-gradient(90deg, transparent, rgba(139, 39, 34, .58), transparent);
      opacity: 0;
      transform: scaleX(.45);
      transition: opacity 320ms var(--ease-out), transform 520ms var(--spring);
    }
    .taisho-card:hover,
    .taisho-card:focus-visible {
      transform: translateY(calc(var(--stage-w) * -.004)) scale(1.012);
      border-color: rgba(133, 45, 40, .24);
      box-shadow:
        0 calc(var(--stage-w) * .010) calc(var(--stage-w) * .026) rgba(61, 47, 34, .13),
        inset 0 1px 0 rgba(255,255,255,.84);
      outline: none;
    }
    .taisho-card:hover::after,
    .taisho-card:focus-visible::after {
      opacity: 1;
      transform: scaleX(1);
    }
    .taisho-card .section-number {
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      font-size: 13px;
      line-height: 1;
      color: rgba(129, 49, 42, .78);
      font-weight: 700;
      letter-spacing: 0;
      margin-bottom: calc(var(--stage-w) * .004);
    }
    .taisho-card strong {
      font-size: 25px;
      line-height: 1.05;
      letter-spacing: 0;
      font-weight: 650;
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .taisho-card em {
      margin-top: calc(var(--stage-w) * .004);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      font-size: 13px;
      line-height: 1.2;
      font-style: normal;
      color: rgba(71, 64, 56, .64);
      white-space: nowrap;
      overflow: hidden;
      text-overflow: ellipsis;
    }
    .taisho-overview {
      background:
        linear-gradient(135deg, rgba(120, 36, 32, .94), rgba(83, 31, 28, .84)),
        radial-gradient(circle at 20% 0%, rgba(222, 182, 111, .22), transparent 60%);
      color: rgba(255,255,255,.96);
      border-color: rgba(218, 182, 116, .28);
      box-shadow: 0 calc(var(--stage-w) * .010) calc(var(--stage-w) * .03) rgba(92, 34, 29, .20);
    }
    .taisho-overview .section-number,
    .taisho-overview em { color: rgba(255, 239, 210, .78); }
    @media (max-width: 760px) {
      .taisho-layer {
        grid-template-columns: repeat(3, minmax(0, 1fr));
        height: calc(420 / 941 * 100%);
        bottom: calc(20 / 941 * 100%);
        overflow: auto;
        padding-right: 2px;
      }
      .taisho-card strong { font-size: 21px; }
      .taisho-card em { font-size: 12px; }
      .taisho-card .section-number { font-size: 12px; }
    }

    /* V1.16 智能自适应：页面流式重排，文字不随窗口宽度连续缩放 */
    body {
      background:
        radial-gradient(980px 620px at 76% 18%, rgba(255,255,255,.78), rgba(244,236,224,.58) 54%, transparent 82%),
        linear-gradient(90deg, #eadcc7 0, #f5efe6 9%, #f7f2ea 82%, #e8d8bf 100%);
    }
    .stage {
      --stage-w: 100%;
      --content-x: clamp(28px, 7vw, 148px);
      width: 100%;
      min-height: 100vh;
      height: auto;
      padding: 82px var(--content-x) 48px;
      overflow: hidden;
      box-shadow: none;
    }
    .stage::before {
      background-size: 220px auto;
      opacity: .52;
    }
    .hero-art {
      left: auto;
      right: 0;
      top: 0;
      width: min(66rem, 62vw);
      height: min(50rem, 86vh);
      object-fit: contain;
      object-position: right top;
      opacity: .96;
    }
    .title-img,
    .subtitle-img {
      display: none;
    }
    .hero-copy {
      position: relative;
      z-index: 5;
      width: min(42rem, 100%);
      padding-top: 64px;
      pointer-events: none;
    }
    .hero-kicker {
      margin: 0 0 18px;
      color: rgba(134, 44, 38, .82);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      font-size: 15px;
      line-height: 1.3;
      font-weight: 700;
      letter-spacing: 0;
    }
    .hero-title {
      margin: 0;
      color: #13100c;
      font-size: 86px;
      line-height: 1.04;
      font-weight: 560;
      letter-spacing: 0;
      text-shadow: 0 2px 1px rgba(255,255,255,.38);
    }
    .hero-subtitle {
      margin: 24px 0 0;
      color: rgba(70, 61, 51, .78);
      font-size: 26px;
      line-height: 1.65;
      letter-spacing: 0;
    }
    .search-wrap {
      position: relative;
      left: auto;
      top: auto;
      z-index: 7;
      width: min(39rem, 100%);
      height: 68px;
      margin-top: 38px;
      overflow: visible;
    }
    .search-form {
      border-radius: 18px;
      border: 1px solid rgba(112, 97, 82, .48);
      background:
        radial-gradient(ellipse 520px 120px at var(--mx) var(--my), rgba(255,255,255,.42), transparent 68%),
        linear-gradient(180deg, rgba(255,255,255,.58), rgba(248,241,231,.48));
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.82),
        0 8px 30px rgba(77,55,35,.08);
    }
    .search-form:hover {
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.88),
        0 14px 40px rgba(77,55,35,.10);
    }
    .search-wrap:focus-within .search-form {
      transform: translateY(-1px);
      box-shadow:
        inset 0 1px 0 rgba(255,255,255,.92),
        0 0 0 3px rgba(160, 58, 49, .07),
        0 16px 46px rgba(84,60,36,.13);
    }
    .search-form::after {
      left: 38px;
      right: 38px;
      height: 1px;
    }
    .search-form svg {
      width: 28px;
      height: 28px;
      margin-left: 22px;
      margin-right: 20px;
    }
    .search-input {
      font-size: 24px;
      letter-spacing: 0;
      padding: 0 112px 0 0;
    }
    .search-suggestions {
      top: calc(100% + 12px);
      gap: 10px;
      padding: 10px;
      border-radius: 16px;
      box-shadow: 0 20px 48px rgba(73, 51, 29, .13);
    }
    .search-suggestions a {
      min-height: 44px;
      padding: 8px 10px;
      border-radius: 10px;
      font-size: 15px;
      letter-spacing: 0;
    }
    .taisho-layer {
      position: relative;
      left: auto;
      right: auto;
      bottom: auto;
      z-index: 6;
      width: 100%;
      height: auto;
      margin-top: 84px;
      display: grid;
      grid-template-columns: repeat(auto-fit, minmax(148px, 1fr));
      gap: 14px;
      pointer-events: auto;
    }
    .taisho-card {
      min-height: 88px;
      padding: 16px 18px;
      border-radius: 18px;
      box-shadow:
        0 10px 32px rgba(61, 47, 34, .075),
        inset 0 1px 0 rgba(255,255,255,.74);
    }
    .taisho-card:hover,
    .taisho-card:focus-visible {
      transform: translateY(-3px);
      box-shadow:
        0 18px 44px rgba(61, 47, 34, .13),
        inset 0 1px 0 rgba(255,255,255,.84);
    }
    .taisho-card .section-number {
      font-size: 13px;
      margin-bottom: 8px;
      letter-spacing: 0;
    }
    .taisho-card strong {
      font-size: 25px;
      line-height: 1.08;
      letter-spacing: 0;
    }
    .taisho-card em {
      margin-top: 7px;
      font-size: 13px;
      line-height: 1.25;
      letter-spacing: 0;
    }
    @media (max-width: 1180px) {
      .hero-art {
        width: min(58rem, 74vw);
        opacity: .42;
      }
      .stage {
        padding-top: 64px;
      }
      .hero-copy {
        padding-top: 34px;
      }
      .taisho-layer {
        margin-top: 64px;
        grid-template-columns: repeat(auto-fit, minmax(144px, 1fr));
      }
    }
    @media (max-width: 720px) {
      .stage {
        --content-x: 20px;
        padding-top: 36px;
        padding-bottom: 34px;
      }
      .hero-art {
        width: 112vw;
        height: 560px;
        opacity: .22;
      }
      .hero-copy {
        padding-top: 22px;
      }
      .hero-title {
        font-size: 56px;
      }
      .hero-subtitle {
        font-size: 20px;
        line-height: 1.55;
      }
      .search-wrap {
        width: 100%;
        height: 60px;
        margin-top: 28px;
      }
      .search-input {
        font-size: 19px;
      }
      .search-submit {
        min-width: 72px;
        font-size: 14px;
        border-radius: 13px;
      }
      .search-suggestions {
        position: static;
        margin-top: 12px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        opacity: 1;
        transform: none;
        pointer-events: auto;
      }
      .taisho-layer {
        margin-top: 128px;
        grid-template-columns: repeat(2, minmax(0, 1fr));
        gap: 10px;
      }
      .taisho-card {
        min-height: 82px;
        padding: 14px;
        border-radius: 16px;
      }
      .taisho-card strong {
        font-size: 21px;
      }
      .taisho-card em {
        font-size: 12px;
      }
    }

    /* V1.17 细节修复：去残影、稳定拉伸、移动端不让浮层压住分类 */
    *,
    *::before,
    *::after {
      box-sizing: border-box;
    }
    .stage {
      --content-x: clamp(28px, 6vw, 132px);
      padding-top: clamp(52px, 6vh, 76px);
      padding-bottom: 60px;
      box-sizing: border-box;
      overflow-x: hidden;
      background:
        radial-gradient(980px 560px at 72% 16%, rgba(255,255,255,.54), transparent 74%),
        #f8f3ec;
    }
    .stage::before {
      opacity: .28;
      mix-blend-mode: normal;
    }
    .stage::after {
      z-index: 2;
      opacity: 1;
      background: linear-gradient(
        90deg,
        rgba(248,243,236,1) 0%,
        rgba(248,243,236,.99) 30%,
        rgba(248,243,236,.94) 41%,
        rgba(248,243,236,.66) 51%,
        rgba(248,243,236,.22) 63%,
        transparent 73%
      );
    }
    .hero-art {
      width: clamp(440px, 43vw, 760px);
      height: clamp(360px, 43vw, 650px);
      right: 0;
      top: 0;
      object-fit: cover;
      object-position: 88% 0;
      opacity: .88;
      filter: saturate(.96) contrast(.98);
      -webkit-mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.12) 16%, rgba(0,0,0,.62) 38%, #000 58%);
      mask-image: linear-gradient(90deg, transparent 0%, rgba(0,0,0,.12) 16%, rgba(0,0,0,.62) 38%, #000 58%);
    }
    .hero-copy {
      max-width: 620px;
      padding-top: clamp(30px, 5vh, 58px);
    }
    .hero-title {
      font-size: 92px;
      font-weight: 540;
    }
    .hero-subtitle {
      max-width: 28em;
      font-size: 25px;
    }
    .search-wrap {
      width: min(640px, 100%);
    }
    .taisho-layer {
      box-sizing: border-box;
      width: min(100%, 1680px);
      margin-top: clamp(42px, 5.5vh, 66px);
      padding: 18px;
      border: 1px solid rgba(128, 103, 75, .14);
      border-radius: 30px;
      background:
        linear-gradient(180deg, rgba(255,255,255,.54), rgba(255,255,255,.30)),
        rgba(246, 239, 229, .30);
      box-shadow:
        0 20px 70px rgba(74, 55, 35, .08),
        inset 0 1px 0 rgba(255,255,255,.62);
      backdrop-filter: blur(10px);
      -webkit-backdrop-filter: blur(10px);
      grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));
    }
    .taisho-card {
      box-sizing: border-box;
      background:
        linear-gradient(180deg, rgba(255,255,255,.88), rgba(255,255,255,.66)),
        radial-gradient(circle at 20% 0%, rgba(255,255,255,.9), transparent 62%);
    }
    @media (min-width: 1680px) {
      .taisho-layer {
        grid-template-columns: repeat(9, minmax(0, 1fr));
      }
    }
    @media (max-width: 1180px) {
      .hero-art {
        width: clamp(420px, 48vw, 620px);
        opacity: .34;
      }
      .taisho-layer {
        grid-template-columns: repeat(auto-fit, minmax(145px, 1fr));
      }
      .hero-title {
        font-size: 78px;
      }
      .hero-subtitle {
        font-size: 24px;
      }
    }
    @media (max-height: 920px) and (min-width: 900px) {
      .stage {
        padding-top: 36px;
        padding-bottom: 36px;
      }
      .hero-copy {
        padding-top: 20px;
      }
      .hero-kicker {
        margin-bottom: 12px;
      }
      .hero-title {
        font-size: 84px;
      }
      .hero-subtitle {
        margin-top: 18px;
        font-size: 24px;
      }
      .search-wrap {
        height: 64px;
        margin-top: 28px;
      }
      .taisho-layer {
        margin-top: 34px;
        padding: 16px;
        gap: 12px;
      }
      .taisho-card {
        min-height: 80px;
        padding: 13px 16px;
      }
    }
    @media (max-height: 800px) and (min-width: 900px) {
      .stage {
        padding-top: 28px;
      }
      .hero-copy {
        padding-top: 10px;
      }
      .hero-title {
        font-size: 70px;
      }
      .hero-subtitle {
        margin-top: 10px;
        font-size: 22px;
      }
      .search-wrap {
        height: 56px;
        margin-top: 16px;
      }
      .taisho-layer {
        margin-top: 20px;
        padding: 14px;
        gap: 10px;
      }
      .taisho-card {
        min-height: 72px;
        padding: 10px 14px;
      }
      .taisho-card strong {
        font-size: 23px;
      }
      .taisho-card .section-number,
      .taisho-card em {
        font-size: 12px;
      }
    }
    @media (max-height: 800px) and (min-width: 900px) and (max-width: 1180px) {
      .stage {
        padding-top: 24px;
        padding-bottom: 24px;
      }
      .hero-copy {
        padding-top: 4px;
      }
      .hero-title {
        font-size: 64px;
      }
      .hero-subtitle {
        margin-top: 8px;
        font-size: 21px;
      }
      .search-wrap {
        height: 54px;
        margin-top: 14px;
      }
      .taisho-layer {
        margin-top: 18px;
        padding: 12px;
        gap: 8px;
      }
      .taisho-card {
        min-height: 62px;
        padding: 7px 12px;
      }
      .taisho-card strong {
        font-size: 21px;
      }
      .taisho-card .section-number {
        margin-bottom: 5px;
      }
      .taisho-card em {
        margin-top: 4px;
      }
    }
    @media (max-width: 720px) {
      .stage {
        padding: 34px 20px 34px;
        max-width: 100vw;
        background:
          radial-gradient(420px 300px at 92% 6%, rgba(236,224,207,.65), transparent 72%),
          #f7f1e8;
      }
      .hero-art {
        display: none;
      }
      .hero-copy {
        padding-top: 16px;
      }
      .hero-title {
        font-size: 54px;
      }
      .hero-subtitle {
        font-size: 19px;
      }
      .search-suggestions {
        display: none;
        position: absolute;
        margin-top: 0;
        grid-template-columns: repeat(2, minmax(0, 1fr));
      }
      .search-wrap {
        width: calc(100% - 20px);
        max-width: calc(100% - 20px);
      }
      .search-wrap:focus-within .search-suggestions {
        display: grid;
      }
      .taisho-layer {
        width: calc(100% - 20px);
        max-width: calc(100% - 20px);
        margin-top: 34px;
        padding: 10px;
        border-radius: 22px;
        grid-template-columns: repeat(auto-fit, minmax(min(100%, 180px), 1fr));
      }
    }
    @media (max-width: 520px) {
      .hero-title {
        font-size: 54px;
      }
      .hero-subtitle {
        font-size: 22px;
      }
      .taisho-layer {
        grid-template-columns: 1fr;
      }
    }
    .taisho-layer .taisho-overview {
      background:
        linear-gradient(135deg, rgba(130, 42, 37, .96), rgba(91, 34, 31, .90)),
        radial-gradient(circle at 16% 0%, rgba(229, 190, 121, .28), transparent 60%);
      color: rgba(255,255,255,.98);
      border-color: rgba(224, 188, 116, .30);
      box-shadow:
        0 16px 42px rgba(104, 39, 33, .18),
        inset 0 1px 0 rgba(255,255,255,.16);
    }
    .taisho-layer .taisho-overview .section-number,
    .taisho-layer .taisho-overview em {
      color: rgba(255, 239, 211, .82);
    }

    /* 部类卡片直接铺在首页背景上，未填满的网格不再显出空白外框。 */
    .taisho-layer {
      padding: 0;
      border: 0;
      border-radius: 0;
      background: transparent;
      box-shadow: none;
      backdrop-filter: none;
      -webkit-backdrop-filter: none;
    }

    /* 右侧主视觉贯穿首页高度，左侧保持干净并自然渐隐。 */
    @media (min-width: 721px) {
      .hero-art {
        left: auto;
        right: 0;
        top: 0;
        width: min(62vw, 1056px);
        height: 100%;
        object-fit: cover;
        object-position: right top;
        opacity: .96;
        -webkit-mask-image: none;
        mask-image: none;
      }
    }

    @media (min-width: 721px) and (max-width: 1180px) {
      .hero-art {
        width: 100%;
        object-position: right top;
        opacity: .78;
        -webkit-mask-image: none;
        mask-image: none;
      }
    }

    /* Search sample only: exact live homepage styles, vertical ranked results. */
    .search-wrap .search-suggestions {
      grid-template-columns: minmax(0, 1fr);
      visibility: hidden;
    }
    .search-wrap .search-suggestions::after {
      content: "查看完整结果，请点击“搜索”按钮";
      display: block;
      grid-column: 1 / -1;
      padding: 2px 6px 1px;
      color: rgba(94, 80, 64, .58);
      font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
      font-size: 12px;
      font-weight: 400;
      line-height: 1.45;
      text-align: center;
      letter-spacing: 0;
    }
    .search-wrap:focus-within .search-suggestions {
      opacity: 0;
      transform: translateY(calc(var(--stage-w) * -.008)) scale(.985);
      pointer-events: none;
    }
    .search-wrap.has-search-results:focus-within .search-suggestions {
      visibility: visible;
      opacity: 1;
      transform: translateY(0) scale(1);
      pointer-events: auto;
    }
    .search-suggestions a {
      display: flex;
      flex-wrap: wrap;
      align-items: baseline;
      justify-content: flex-start;
      column-gap: 12px;
      row-gap: 3px;
      min-width: 0;
      min-height: 50px;
      padding: 9px 16px;
      border: 1px solid rgba(132, 99, 67, .18);
      border-radius: 11px;
      background: rgba(255, 255, 255, .82);
      box-shadow: 0 4px 14px rgba(73, 51, 29, .07), inset 0 1px 0 rgba(255, 255, 255, .92);
      text-align: left;
      transition: background 220ms var(--ease-out), border-color 220ms var(--ease-out), box-shadow 220ms var(--ease-out), transform 300ms var(--spring), color 220ms var(--ease-out);
    }
    .search-suggestions .suggestion-title,
    .search-suggestions .suggestion-credit {
      display: block;
      min-width: 0;
      overflow-wrap: anywhere;
    }
    .search-suggestions .suggestion-credit {
      margin-top: 0;
      color: rgba(94, 80, 64, .68);
      font-size: 13px;
      line-height: 1.35;
      text-align: left;
    }
    .search-suggestions .suggestion-title {
      color: #302820;
      font-size: 16px;
      font-weight: 700;
      line-height: 1.35;
    }
    .search-suggestions a[aria-selected="true"] {
      color: #7d342c;
      border-color: rgba(139, 55, 47, .32);
      background: rgba(249, 238, 225, .96);
      box-shadow: 0 6px 18px rgba(94, 54, 37, .12), inset 3px 0 0 rgba(139, 55, 47, .68);
    }
    .search-suggestions a:hover {
      border-color: rgba(139, 55, 47, .26);
      background: rgba(252, 244, 234, .96);
      box-shadow: 0 7px 20px rgba(94, 54, 37, .11);
    }
    .search-live-status {
      position: absolute;
      width: 1px;
      height: 1px;
      margin: -1px;
      overflow: hidden;
      clip: rect(0 0 0 0);
      white-space: nowrap;
    }
    @media (min-width: 721px) and (max-width: 980px) {
      .search-wrap .search-suggestions {
        position: absolute;
        top: calc(100% + 12px);
        margin-top: 0;
      }
    }
    @media (max-width: 720px) {
      .search-wrap .search-suggestions {
        display: none;
        grid-template-columns: minmax(0, 1fr);
      }
      .search-wrap.has-search-results .search-suggestions {
        display: grid;
        visibility: visible;
        opacity: 1;
        transform: translateY(0) scale(1);
        pointer-events: auto;
      }
      .search-suggestions a {
        column-gap: 9px;
        row-gap: 2px;
        min-height: 52px;
        padding: 9px 12px;
      }
      .search-suggestions .suggestion-title {
        font-size: 15px;
      }
      .search-suggestions .suggestion-credit {
        font-size: 12px;
      }
      .search-clear {
        right: 87px;
        width: 28px;
        height: 28px;
        font-size: 22px;
      }
    }