@import url("/interior-design.css?v=7");
@import url("/image-motion.css?v=5");

/* Panda Junyu — shared visual language, September 2026.
   Official typefaces, original artwork, one consistent reading rhythm. */
@font-face{font-family:"Alibaba PuHuiTi";src:url("/fonts/alibaba-puhuiti-regular-site.woff2?v=20260925-goods") format("woff2");font-weight:400;font-style:normal;font-display:swap}
@font-face{font-family:"Alibaba PuHuiTi";src:url("/fonts/alibaba-puhuiti-medium-site.woff2?v=20260925-goods") format("woff2");font-weight:500;font-style:normal;font-display:swap}
@font-face{font-family:"Alibaba PuHuiTi";src:url("/fonts/alibaba-puhuiti-semibold-site.woff2?v=20260925-goods") format("woff2");font-weight:600;font-style:normal;font-display:swap}
@font-face{font-family:"QianTu HouHei";src:url("/fonts/qiantu-houhei-site.woff2?v=20260925-goods") format("woff2");font-weight:800;font-style:normal;font-display:swap}
:root {
  --ink:#101820; --ink-soft:#37414a; --muted:#59636b; --quiet:#59636b;
  --line:#dce0e3; --soft:#f5f6f6; --white:#fff;
  --sans:"Alibaba PuHuiTi","PingFang SC","Microsoft YaHei",sans-serif;
  --display:"QianTu HouHei","Alibaba PuHuiTi",sans-serif;
  --gutter:clamp(24px,5vw,88px);
  --pad:max(var(--gutter),calc((100vw - 1320px)/2));
  --page-pad:var(--pad);
  --space:clamp(72px,8vw,128px);
  --ease:cubic-bezier(.16,1,.3,1);
}
html {scroll-padding-top:0; -webkit-text-size-adjust:100%;}
/* Each destination owns its clearance; do not add a second root scroll offset. */
:where(main[id],main [id]) {scroll-margin-top:100px;}
html body {font-family:var(--sans);font-synthesis:none;}
html body :is(h1,h2,h3,h4,h5,h6),
html body :is(.season-intro-title,.solar-hero-art figcaption strong,.festival-hero-gallery figcaption strong,.solar-grid figcaption strong,.festival-grid figcaption strong,.games-category-covers figcaption strong,.concept-category-status strong,.tea-counter-heading strong,.character-name,.hero-word,.category-link strong,.goods-category-link strong,.goods-item strong,.home-concept-status,.nav-sublabel,.book-hook,.belief blockquote,.book-intro blockquote,.world-principle blockquote) {
  font-family:var(--display)!important;font-weight:800!important;font-style:normal;
  letter-spacing:0; text-wrap:balance; overflow-wrap:break-word;
}
html body :is(p,li,figcaption,label,input,select,textarea,button,.page-breadcrumb,.series-breadcrumb) {font-family:var(--sans);}
html body :is(.partners-chapter,.partner-intro) {font-family:var(--sans);}
html body :is(.partner-profile p,.partner-profile small,.partner-roster-note) {font-family:var(--sans);}
html body :is(h2,h3,h4) {line-height:1.3;}
p {text-wrap:pretty;}
html body :is(button,a,input,select,textarea):focus-visible {outline:2px solid var(--ink);outline-offset:5px;}
html body .skip-link {z-index:220;}

/* Keep the established navigation behavior; simplify its visual furniture. */
@media(min-width:1081px) {
  header:is(.site-header,.story-header,.world-header,.goods-header,.about-header) {padding-inline:var(--gutter);gap:20px;}
  /* Equal visible gaps: 13px inset + 6px layout gap + 13px inset = 32px.
     A rotated 6px chevron spans 6 * sqrt(2); its button keeps the same insets. */
  header > nav[aria-label="网站主导航"] {--nav-link-inset:13px;--nav-toggle-width:calc(2 * var(--nav-link-inset) + 6px * 1.41421356237);gap:6px;padding:0;border-radius:0;background:transparent;}
  header > nav[aria-label="网站主导航"] .nav-link {position:relative;padding:0 var(--nav-link-inset);border-radius:0;font-size:15px;}
  header > nav[aria-label="网站主导航"] > .nav-link:is([aria-current],[data-active]),
  header > nav[aria-label="网站主导航"] .nav-group-heading:has(.nav-link:is([aria-current],[data-active])) {color:var(--ink);background:transparent;}
  header > nav[aria-label="网站主导航"] :is(.nav-link[aria-current],.nav-link[data-active])::after {content:"";position:absolute;bottom:4px;left:var(--nav-link-inset);right:var(--nav-link-inset);height:2px;background:var(--ink);transform:none;}
  header > nav[aria-label="网站主导航"] .nav-group-heading .nav-link::after {right:0;}
  header > nav[aria-label="网站主导航"] .nav-group-heading {border-radius:4px;}
  header > nav[aria-label="网站主导航"] .nav-submenu-toggle {width:var(--nav-toggle-width);flex-basis:var(--nav-toggle-width);}
  header > nav[aria-label="网站主导航"] .nav-submenu-toggle span {transform:translateY(-2px) rotate(45deg);}
  header > nav[aria-label="网站主导航"] .nav-submenu-toggle[aria-expanded="true"] span {transform:translateY(2px) rotate(225deg);}
  header > nav[aria-label="网站主导航"] > .nav-link:not([aria-current],[data-active]):hover,
  header > nav[aria-label="网站主导航"] .nav-group-heading:not(:has(.nav-link:is([aria-current],[data-active]))):is(:hover,:has([aria-expanded="true"])) {background:#f3f5f6;}
  header > nav[aria-label="网站主导航"] .nav-submenu {top:calc(100% + 16px);width:560px;padding:14px;border:1px solid var(--line);border-radius:8px;box-shadow:0 20px 48px #10182012;}
  header > nav[aria-label="网站主导航"] .nav-submenu a {min-height:112px;border-radius:4px;gap:12px;}
  header > nav[aria-label="网站主导航"] .nav-submenu small {font-size:13px;line-height:1.6;}
}
header > :is(.header-action,.header-read) {border-radius:5px;gap:18px;}
html .mobile-nav-toggle {border-radius:5px;}
@media(max-width:1080px) {
  header > nav[aria-label="网站主导航"] .nav-link {font-family:var(--sans);font-weight:500;}
  header > nav[aria-label="网站主导航"] .nav-submenu a {border-radius:4px;}
  header > nav[aria-label="网站主导航"] {gap:10px!important;}
}
@media(max-width:700px) {
  :root {--gutter:20px;--pad:20px;--page-pad:20px;--space:72px;}
  html body :is(h2,h3,h4) {letter-spacing:0;}
  header > :is(.header-action,.header-read) {gap:8px;}
}
@media(prefers-reduced-motion:reduce) {
  html {scroll-behavior:auto!important;}
  html body *,html body *::before,html body *::after {animation-duration:.01ms!important;animation-iteration-count:1!important;transition-duration:.01ms!important;scroll-behavior:auto!important;}
}
@media(forced-colors:active) {
  header > nav[aria-label="网站主导航"] :is(.nav-link[aria-current],.nav-link[data-active])::after {background:CanvasText;}
}

/* The reader has an extended Alibaba subset for all 36 pages of transcripts. */
@font-face {font-family:"Junyu Reader Text";src:url("/fonts/alibaba-puhuiti-reader-regular.woff2") format("woff2");font-weight:400;font-style:normal;font-display:swap;}
html body .transcript-content p {font-family:"Junyu Reader Text",var(--sans);font-weight:400;}
html body .skip-link {position:fixed;top:12px;left:16px;padding:14px 20px;background:#101820;color:#fff;font:500 15px var(--sans);text-decoration:none;transform:translateY(-180%);}
html body .skip-link:focus {transform:none;}

html body .character-name small {font-family:var(--sans);font-weight:400;}

/* Fit all five stack-game controls inside the narrowest supported phone. */
@media(max-width:360px) {
  html body .game-controls {grid-template-columns:44px 44px minmax(0,1fr) 44px 44px;gap:4px;}
  html body .game-controls button {padding-inline:0;font-size:12px;}
}

/* Keep both official records together; the supplied badge precedes its number. */
body footer .footer-legal {
  display:flex;flex-direction:column;align-items:flex-end;justify-self:end;
  gap:2px;max-width:100%;color:var(--muted);font:400 12px/1.7 var(--sans);
  letter-spacing:0;text-align:right;
}
body footer .footer-copyright {font:inherit;white-space:nowrap;}
body footer .footer-registrations {display:flex;align-items:center;justify-content:flex-end;flex-wrap:wrap;gap:0 16px;}
body footer .footer-registrations a {
  display:inline-flex;align-items:center;justify-content:center;gap:6px;
  min-height:44px;max-width:100%;color:inherit;font:inherit;line-height:20px;
  letter-spacing:0;text-decoration:none;white-space:nowrap;
}
body footer .police-registration img {display:block;flex:0 0 18px;width:18px;height:20px;object-fit:contain;}
body footer .police-registration span {font:inherit;color:inherit;}
body footer .footer-registrations a:hover {color:var(--ink);text-decoration:underline;text-underline-offset:4px;}
body footer.registration-footer {
  display:flex;flex-direction:column;align-items:center;justify-content:center;
  gap:4px;margin:0;padding:20px var(--gutter);border-top:1px solid var(--line);
  background:var(--white);color:var(--muted);font:400 12px/1.7 var(--sans);text-align:center;
}
body footer.registration-footer .footer-legal {align-items:center;text-align:center;}
body footer.registration-footer .footer-registrations {justify-content:center;}
@media(max-width:1080px) {
  body footer .footer-legal {align-items:center;align-self:center;justify-self:center;text-align:center;}
  body footer .footer-registrations {justify-content:center;}
}
@media(max-width:600px) {
  body footer .footer-legal {gap:0;}
  body footer .footer-copyright {display:flex;align-items:center;min-height:32px;line-height:20px;}
  body footer .footer-registrations {flex-direction:column;gap:0;}
  body footer .footer-registrations a {min-height:32px;}
}
