/* Trạm Ký Ức — light parchment theme */
:root {
  --light-paper: rgba(255, 250, 238, .88);
  --light-paper-strong: rgba(255, 253, 246, .96);
  --light-paper-soft: rgba(247, 235, 211, .84);
  --light-ink: #352315;
  --light-ink-soft: #705b47;
  --light-red: #8f3024;
  --light-red-deep: #6f2119;
  --light-gold: #a56d20;
  --light-line: rgba(132, 86, 36, .32);
  --light-shadow: 0 18px 48px rgba(65, 34, 13, .18);
  color-scheme: light;
}

/* SP earning guide */
.site-light .sp-guide {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 22px;
  margin-top: 34px;
}

.site-light .sp-guide-intro {
  display: grid;
  grid-template-columns: 58px minmax(0, 1fr);
  align-items: center;
  gap: 18px;
  padding: 22px 24px;
  border: 1px solid var(--light-line);
  border-left: 3px solid var(--light-red);
  background: linear-gradient(105deg, rgba(181, 86, 48, .12), rgba(255, 250, 240, .94));
  box-shadow: 0 9px 24px rgba(68, 35, 13, .08);
}

.site-light .sp-guide-intro > span {
  width: 54px;
  height: 54px;
  display: grid;
  place-items: center;
  border: 1px solid rgba(144, 55, 34, .45);
  border-radius: 50%;
  color: var(--light-red-deep);
  background: rgba(255, 255, 255, .55);
  font: 900 17px/1 var(--font-display);
  letter-spacing: .04em;
}

.site-light .sp-guide-intro > div { display: grid; gap: 6px; }
.site-light .sp-guide-intro small,
.site-light .sp-section-heading small,
.site-light .sp-exp-copy > small,
.site-light .sp-steps > header small {
  color: var(--light-red);
  font-size: 11px;
  font-weight: 900;
  letter-spacing: .14em;
  text-transform: uppercase;
}
.site-light .sp-guide-intro strong { color: var(--light-ink); font-size: 21px; line-height: 1.35; }
.site-light .sp-guide-intro p { margin: 0; color: var(--light-ink-soft); font-size: 15px; line-height: 1.65; }

.site-light .sp-scroll-section,
.site-light .sp-exp-section,
.site-light .sp-steps {
  padding: 26px 27px 28px;
  border: 1px solid var(--light-line);
  background: rgba(255, 250, 240, .91);
  box-shadow: 0 9px 24px rgba(68, 35, 13, .08);
}

.site-light .sp-section-heading {
  display: grid;
  grid-template-columns: minmax(230px, .8fr) minmax(320px, 1.2fr);
  align-items: end;
  gap: 24px;
  margin-bottom: 21px;
}
.site-light .sp-section-heading h3,
.site-light .sp-exp-copy h3,
.site-light .sp-steps > header h3 {
  margin: 6px 0 0;
  color: var(--light-red-deep);
  font: 700 28px/1.2 var(--font-display);
}
.site-light .sp-section-heading > p { margin: 0; color: var(--light-ink-soft); font-size: 14px; line-height: 1.65; }
.site-light .sp-section-heading > p strong { color: var(--light-ink); }

.site-light .sp-scroll-grid {
  display: grid;
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 13px;
}
.site-light .sp-scroll-card {
  min-width: 0;
  overflow: hidden;
  border: 1px solid var(--light-line);
  background: rgba(255, 255, 255, .72);
  box-shadow: 0 8px 18px rgba(68, 35, 13, .07);
}
.site-light .sp-scroll-card figure {
  position: relative;
  aspect-ratio: 4 / 5;
  margin: 0;
  overflow: hidden;
  background: linear-gradient(145deg, #181816, #050505);
}
.site-light .sp-scroll-card img { width: 100%; height: 100%; display: block; object-fit: contain; }
.site-light .sp-scroll-card figcaption {
  position: absolute;
  left: 0;
  right: 0;
  bottom: 0;
  display: flex;
  align-items: center;
  justify-content: space-between;
  gap: 10px;
  padding: 10px 12px;
  background: linear-gradient(90deg, rgba(79, 25, 21, .96), rgba(132, 61, 31, .9));
  color: #fff3dc;
}
.site-light .sp-scroll-card figcaption span { font-size: 10px; font-weight: 900; letter-spacing: .08em; opacity: .75; }
.site-light .sp-scroll-card figcaption strong { color: #fff3dc; font-size: 13px; text-transform: uppercase; }
.site-light .sp-scroll-card > div { padding: 16px 15px 18px; }
.site-light .sp-scroll-card b { display: block; color: var(--light-red-deep); font: 800 24px/1.1 var(--font-display); }
.site-light .sp-scroll-card p { margin: 9px 0 0; color: var(--light-ink-soft); font-size: 13px; line-height: 1.55; }

.site-light .sp-exp-section {
  display: grid;
  grid-template-columns: minmax(250px, .72fr) minmax(380px, 1.28fr);
  align-items: stretch;
  gap: 24px;
}
.site-light .sp-exp-image {
  min-height: 350px;
  margin: 0;
  overflow: hidden;
  border: 1px solid rgba(132, 86, 36, .24);
  background: linear-gradient(145deg, #171715, #050505);
}
.site-light .sp-exp-image img { width: 100%; height: 100%; display: block; object-fit: contain; }
.site-light .sp-exp-copy { align-self: center; }
.site-light .sp-exp-copy p { margin: 15px 0 0; color: var(--light-ink-soft); font-size: 15px; line-height: 1.7; }
.site-light .sp-exp-copy ul { display: grid; gap: 10px; margin: 19px 0 0; padding: 0; list-style: none; }
.site-light .sp-exp-copy li { position: relative; padding: 11px 13px 11px 35px; border: 1px solid var(--light-line); background: rgba(239, 222, 190, .5); color: var(--light-ink-soft); font-size: 14px; line-height: 1.55; }
.site-light .sp-exp-copy li::before { content: "✓"; position: absolute; left: 13px; top: 11px; color: var(--light-red); font-weight: 900; }

.site-light .sp-steps > header { margin-bottom: 19px; text-align: center; }
.site-light .sp-step-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 11px; }
.site-light .sp-step-grid > div { position: relative; min-height: 166px; padding: 23px 17px 19px; border: 1px solid var(--light-line); background: rgba(239, 222, 190, .38); }
.site-light .sp-step-grid span { display: block; margin-bottom: 18px; color: rgba(144, 55, 34, .53); font-size: 11px; font-weight: 900; letter-spacing: .1em; }
.site-light .sp-step-grid strong { color: var(--light-ink); font-size: 14px; text-transform: uppercase; }
.site-light .sp-step-grid p { margin: 8px 0 0; color: var(--light-ink-soft); font-size: 13px; line-height: 1.55; }

.site-light .sp-guide-note {
  display: grid;
  grid-template-columns: 42px minmax(0, 1fr);
  align-items: center;
  gap: 15px;
  padding: 18px 20px;
  border: 1px solid var(--light-line);
  background: rgba(239, 222, 190, .56);
  box-shadow: 0 9px 24px rgba(68, 35, 13, .06);
}
.site-light .sp-guide-note > span { width: 38px; height: 38px; display: grid; place-items: center; border: 1px solid rgba(144, 55, 34, .42); border-radius: 50%; color: var(--light-red); font-weight: 900; }
.site-light .sp-guide-note strong { color: var(--light-red-deep); font-size: 15px; text-transform: uppercase; }
.site-light .sp-guide-note p { margin: 5px 0 0; color: var(--light-ink-soft); font-size: 14px; line-height: 1.6; }

@media (max-width: 1080px) {
  .site-light .sp-scroll-grid,
  .site-light .sp-step-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 720px) {
  .site-light .sp-guide { gap: 16px; margin-top: 25px; }
  .site-light .sp-guide-intro { grid-template-columns: 46px minmax(0, 1fr); gap: 13px; padding: 18px 16px; }
  .site-light .sp-guide-intro > span { width: 44px; height: 44px; font-size: 14px; }
  .site-light .sp-guide-intro strong { font-size: 18px; }
  .site-light .sp-guide-intro p { font-size: 13px; line-height: 1.58; }
  .site-light .sp-scroll-section,
  .site-light .sp-exp-section,
  .site-light .sp-steps { padding: 19px 15px 21px; }
  .site-light .sp-section-heading { grid-template-columns: 1fr; gap: 10px; }
  .site-light .sp-section-heading h3,
  .site-light .sp-exp-copy h3,
  .site-light .sp-steps > header h3 { font-size: 24px; }
  .site-light .sp-scroll-grid,
  .site-light .sp-step-grid,
  .site-light .sp-exp-section { grid-template-columns: 1fr; }
  .site-light .sp-scroll-card figure { aspect-ratio: 5 / 6; }
  .site-light .sp-exp-image { min-height: 280px; }
  .site-light .sp-step-grid > div { min-height: 0; }
  .site-light .sp-guide-note { grid-template-columns: 36px minmax(0, 1fr); padding: 16px; }
  .site-light .sp-guide-note > span { width: 34px; height: 34px; }
}

body.site-light {
  color: var(--light-ink);
  background:
    linear-gradient(180deg, rgba(255, 250, 240, .72), rgba(248, 237, 216, .84)),
    url("assets/bach-duong-background-v83.jpg") center top / cover fixed no-repeat;
}

body.site-light main,
body.site-light .desktop-poster,
body.site-light .download-page-main,
body.site-light .article-page-main,
body.site-light .rules-page-main { background-color: transparent; }

body.site-light :focus-visible { outline-color: var(--light-red); }

/* Shared light navigation */
.site-light .poster-header,
.site-light .download-page-header,
.site-light .mobile-header {
  border-color: var(--light-line);
  background: rgba(255, 250, 238, .93);
  box-shadow: 0 10px 32px rgba(57, 31, 13, .16);
  backdrop-filter: blur(14px) saturate(1.08);
}

.site-light .poster-brand,
.site-light .poster-footer-brand,
.site-light .poster-nav > a,
.site-light .poster-nav-trigger,
.site-light .download-page-home-mobile,
.site-light .mobile-nav > a,
.site-light .mobile-nav-trigger { color: var(--light-ink); }

.site-light .poster-brand strong,
.site-light .poster-footer-brand strong { color: var(--light-red-deep); }
.site-light .poster-brand img,
.site-light .poster-footer-brand img { filter: sepia(.25) saturate(1.15) drop-shadow(0 3px 8px rgba(101, 52, 18, .2)); }

.site-light .poster-nav-menu,
.site-light .mobile-menu,
.site-light .language-menu {
  border-color: var(--light-line);
  background: rgba(255, 252, 244, .98);
  box-shadow: var(--light-shadow);
}

.site-light .poster-nav .poster-nav-menu a,
.site-light .mobile-menu a,
.site-light .language-menu button { color: var(--light-ink); }
.site-light .poster-nav .poster-nav-menu a:hover,
.site-light .poster-nav .poster-nav-menu a:focus-visible,
.site-light .mobile-menu a:hover,
.site-light .language-menu button:hover,
.site-light .language-menu button[aria-selected="true"] { background: rgba(165, 109, 32, .1); color: var(--light-red-deep); }

.site-light .server-monitor,
.site-light .language-toggle,
.site-light .menu-button {
  border-color: var(--light-line);
  background: rgba(255, 253, 247, .8);
  color: var(--light-ink);
  box-shadow: 0 5px 18px rgba(70, 38, 15, .08);
}
.site-light .server-monitor-label,
.site-light .server-uptime small { color: var(--light-ink-soft); }
.site-light .server-monitor-state strong,
.site-light .server-uptime strong,
.site-light .language-code { color: var(--light-red-deep); }

/* Homepage hero */
.site-light .desktop-poster {
  min-height: calc(max(1020px, 78vw) + clamp(1600px, 100vw, 2050px));
  background: transparent;
}
.site-light .poster-art {
  filter: saturate(.96) contrast(.98) brightness(1.08);
  transform: none;
  animation: none;
}
@keyframes bach-duong-light-motes {
  0% { background-position: 0 0, 18px 32px, 44px 18px; opacity: .42; }
  45% { opacity: .86; }
  100% { background-position: 38px -108px, -26px -142px, 6px -184px; opacity: .54; }
}
@keyframes bach-duong-light-sweep {
  0%, 14% { transform: translate3d(-115%, 0, 0) skewX(-12deg); opacity: 0; }
  38% { opacity: .46; }
  68%, 100% { transform: translate3d(115%, 0, 0) skewX(-12deg); opacity: 0; }
}
.site-light .poster-vignette {
  background:
    linear-gradient(180deg, rgba(255, 249, 234, .18), transparent 24%, rgba(255, 247, 228, .05) 58%, rgba(247, 232, 205, .58) 100%),
    radial-gradient(circle at 50% 34%, transparent 0 30%, rgba(255, 246, 226, .08) 64%, rgba(92, 48, 17, .14) 100%);
}
.site-light .poster-vignette::before {
  content: "";
  position: absolute;
  inset: -8% 25%;
  background: linear-gradient(105deg, transparent 32%, rgba(255, 244, 203, .04) 42%, rgba(255, 229, 157, .34) 50%, rgba(255, 249, 226, .08) 58%, transparent 68%);
  filter: blur(9px);
  pointer-events: none;
  animation: bach-duong-light-sweep 12s ease-in-out infinite;
}
.site-light .poster-vignette::after {
  content: "";
  position: absolute;
  inset: 0;
  background-image:
    radial-gradient(circle, rgba(255, 226, 130, .98) 0 1.8px, transparent 3px),
    radial-gradient(circle, rgba(255, 255, 244, .92) 0 1.25px, transparent 2.4px),
    radial-gradient(circle, rgba(255, 194, 72, .92) 0 2.8px, transparent 4.3px);
  background-size: 72px 84px, 116px 131px, 205px 184px;
  background-position: 0 0, 18px 32px, 44px 18px;
  -webkit-mask-image: linear-gradient(180deg, transparent 3%, #000 18%, #000 72%, transparent 96%);
  mask-image: linear-gradient(180deg, transparent 3%, #000 18%, #000 72%, transparent 96%);
  filter: drop-shadow(0 0 7px rgba(255, 188, 73, .95));
  mix-blend-mode: screen;
  pointer-events: none;
  animation: bach-duong-light-motes 11s linear infinite;
}

.site-light .poster-hero-copy {
  padding: clamp(18px, 1.8vw, 30px) clamp(24px, 3vw, 48px);
  border: 0;
  border-radius: 0;
  background: transparent;
  box-shadow: none;
  backdrop-filter: none;
}
.site-light .poster-hero-copy h1 {
  color: var(--light-red-deep);
  -webkit-text-stroke: 1px rgba(255, 244, 215, .72);
  text-shadow: 0 2px 0 rgba(255, 250, 237, .9), 0 5px 16px rgba(49, 16, 8, .62), 0 0 28px rgba(255, 239, 196, .45);
}
.site-light .poster-tagline { color: #fff1d2; text-shadow: 0 2px 4px rgba(52, 15, 7, .95), 0 0 16px rgba(52, 15, 7, .7); }
.site-light .hero-brand-mark { filter: sepia(.2) saturate(1.2) drop-shadow(0 6px 12px rgba(77, 35, 13, .25)); }
.site-light .hero-button-dark { border-color: #8d5d28; background: rgba(255, 250, 239, .9); color: var(--light-red-deep); }

.site-light .poster-feature-card {
  border-color: rgba(145, 91, 37, .34);
  background: linear-gradient(145deg, rgba(255, 253, 246, .5), rgba(240, 219, 183, .34));
  color: var(--light-ink);
  box-shadow: 0 12px 28px rgba(70, 37, 14, .12), inset 0 0 20px rgba(255, 255, 255, .12);
  backdrop-filter: blur(1px) saturate(1.04);
}
.site-light .poster-feature-card::before { border-color: rgba(145, 91, 37, .13); }
.site-light .poster-feature-card strong {
  color: #611d15;
  font-weight: 900;
  text-shadow: 0 1px 1px rgba(255, 252, 242, .95), 0 0 8px rgba(255, 248, 229, .72);
}
.site-light .poster-feature-card em {
  color: #38251c;
  font-weight: 700;
  text-shadow: 0 1px 1px rgba(255, 253, 246, .98), 0 0 7px rgba(255, 249, 232, .82);
}
.site-light .poster-feature-card-commitment {
  border-color: rgba(139, 67, 31, .72);
  background: radial-gradient(circle at 88% 18%, rgba(188, 112, 36, .2), transparent 30%), linear-gradient(145deg, rgba(255, 249, 231, .78), rgba(239, 207, 155, .62));
  box-shadow: 0 14px 34px rgba(92, 42, 16, .2), inset 0 0 28px rgba(255, 255, 255, .28);
}
.site-light .commitment-eyebrow { border-color: rgba(128, 50, 28, .38); background: rgba(255, 250, 234, .56); color: #842d20; }
.site-light .commitment-seal { border-color: rgba(128, 50, 28, .42); background: rgba(255, 250, 234, .72); color: #7c281d; box-shadow: 0 0 18px rgba(128, 50, 28, .12); }

.site-light .homepage-commitment {
  border-color: rgba(143, 78, 32, .48);
  background:
    radial-gradient(circle at 50% -20%, rgba(255, 229, 169, .62), transparent 42%),
    linear-gradient(135deg, rgba(255, 252, 243, .88), rgba(239, 216, 177, .74));
  box-shadow: 0 16px 38px rgba(76, 39, 14, .14), inset 0 0 34px rgba(255, 255, 255, .3);
  backdrop-filter: blur(2px) saturate(1.04);
}
.site-light .homepage-commitment::before { border-color: rgba(143, 78, 32, .13); }
.site-light .homepage-commitment-heading p { color: #a64b2d; }
.site-light .homepage-commitment-heading h2 { color: var(--light-red-deep); text-shadow: 0 1px 0 rgba(255, 255, 255, .72); }
.site-light .homepage-commitment-heading span { color: #4c3023; font-weight: 700; }
.site-light .homepage-commitment-seal { border-color: rgba(139, 67, 31, .46); background: rgba(255, 250, 234, .64); color: #812b20; box-shadow: 0 0 20px rgba(128, 50, 28, .11); }
.site-light .homepage-commitment-list li { border-color: rgba(145, 83, 33, .22); background: rgba(255, 253, 246, .46); }
.site-light .homepage-commitment-list b { color: #a0472b; }
.site-light .homepage-commitment-list span { color: #38251c; font-weight: 700; }

/* Preserve photographic cards while making their frames brighter */
.site-light .promo-carousel-viewport { border-color: rgba(141, 86, 31, .55); background: #efe0c5; box-shadow: var(--light-shadow); }
.site-light .promo-carousel-desktop .promo-carousel-slide img { filter: sepia(.12) saturate(.86) contrast(1.02) brightness(.8); }
.site-light .promo-carousel-desktop .promo-carousel-slide::after { background: linear-gradient(180deg, rgba(30, 14, 5, .02), rgba(33, 15, 5, .76) 90%); }
.site-light .promo-carousel-arrow { border-color: #b58135; background: rgba(255, 249, 235, .92); color: var(--light-red-deep); box-shadow: 0 7px 20px rgba(59, 31, 12, .16); }
.site-light .promo-carousel-dots button { background: #b49a72; }

.site-light .latest-panel,
.site-light .media-center-panel {
  border-color: rgba(var(--latest-accent, 174, 116, 43), .48);
  background: linear-gradient(145deg, rgba(255, 252, 244, .94), rgba(240, 222, 190, .88));
  box-shadow: var(--light-shadow);
}
@keyframes latest-panel-glint {
  0%, 12% { transform: translateX(-180%); opacity: 0; }
  28% { opacity: .9; }
  58%, 100% { transform: translateX(520%); opacity: 0; }
}
.site-light .latest-panel {
  overflow: hidden;
  border-color: rgba(var(--latest-accent), .34);
  background: linear-gradient(145deg, rgba(255, 252, 244, .62), rgba(240, 222, 190, .44));
  box-shadow: 0 14px 34px rgba(68, 35, 13, .1), inset 0 0 28px rgba(255, 255, 255, .16);
  backdrop-filter: blur(2px) saturate(1.04);
}
.site-light .latest-panel::after { border-color: rgba(var(--latest-accent), .11); }
.site-light .latest-panel::before {
  content: "";
  position: absolute;
  z-index: 3;
  top: 0;
  left: 0;
  width: 22%;
  height: 2px;
  background: linear-gradient(90deg, transparent, rgba(255, 245, 207, .95), rgb(var(--latest-accent)), transparent);
  box-shadow: 0 0 12px rgba(var(--latest-accent), .58);
  pointer-events: none;
  animation: latest-panel-glint 8s ease-in-out infinite;
}
.site-light .latest-panel-events::before { animation-delay: -4s; }
.site-light .latest-panel-heading h2,
.site-light .poster-journey h2,
.site-light .media-center-heading h2 { color: var(--light-red-deep); }
.site-light .latest-panel-events .latest-panel-heading h2 { color: #9e3f31; }
.site-light .latest-updates-title h2 { color: var(--light-red-deep); text-shadow: 0 2px 12px rgba(255, 248, 229, .9); }
.site-light .latest-updates-title::before,
.site-light .latest-updates-title::after { background: linear-gradient(90deg, transparent, rgba(158, 85, 35, .62)); }
.site-light .latest-card {
  border-color: rgba(var(--card-accent), .44);
  border-bottom-color: rgba(var(--card-accent), .86);
  background: rgba(255, 250, 238, .7);
  box-shadow: 0 8px 20px rgba(72, 38, 16, .1);
}
.site-light .latest-card-link:hover,
.site-light .latest-card-link:focus-visible { background-color: rgba(255, 248, 232, .34); }
.site-light .latest-archive p { background: rgba(255, 252, 245, .7); color: var(--light-ink-soft); }
.site-light .media-center-mark { background: rgba(165, 109, 32, .1); color: var(--light-red); }
.site-light .poster-community-strip {
  top: calc(max(1020px, 78vw) + clamp(800px, 49vw, 1120px) + clamp(730px, 40vw, 790px));
  border-color: var(--light-line);
  background: rgba(255, 250, 238, .9);
  box-shadow: 0 -10px 36px rgba(68, 37, 14, .1);
}
.site-light .poster-community-strip strong,
.site-light .poster-community-strip p { color: var(--light-red-deep); }

/* Inner-page canvas and hero */
.site-light .download-page-main,
.site-light .article-page-main,
.site-light .rules-page-main {
  background:
    linear-gradient(180deg, rgba(255, 250, 239, .1), rgba(255, 250, 239, .52) 260px, rgba(247, 234, 211, .7));
}
.site-light .download-page-hero,
.site-light .article-page-hero,
.site-light .rules-page-hero {
  background-image:
    linear-gradient(180deg, rgba(255, 248, 230, .16), rgba(250, 238, 214, .42) 60%, rgba(246, 232, 207, .88) 100%),
    url("assets/bach-duong-background-v83.jpg");
  background-position: center 40%;
  background-size: cover;
}
.site-light .download-page-hero::after,
.site-light .article-page-hero::after,
.site-light .rules-page-hero::before { background: radial-gradient(ellipse at 50% 56%, rgba(255, 252, 245, .06), rgba(89, 45, 15, .18) 82%); }
.site-light .download-page-hero-copy {
  padding: 18px 28px;
  border: 1px solid rgba(143, 88, 32, .28);
  border-radius: 5px;
  background: rgba(255, 251, 241, .82);
  text-shadow: none;
  box-shadow: 0 16px 42px rgba(68, 34, 12, .16);
  backdrop-filter: blur(5px);
}
.site-light .download-page-hero-copy h1 { color: var(--light-red-deep); text-shadow: none; }
.site-light .download-page-hero-copy > p { color: var(--light-gold); }
.site-light .download-page-hero-copy > span { color: var(--light-ink-soft); }
.site-light .article-page-hero-copy,
.site-light .rules-page-hero-copy {
  padding: clamp(20px, 2.5vw, 38px) clamp(26px, 4vw, 58px);
  border: 1px solid rgba(143, 88, 32, .28);
  border-radius: 6px;
  background: rgba(255, 251, 241, .84);
  text-shadow: none;
  box-shadow: 0 18px 48px rgba(68, 34, 12, .18);
  backdrop-filter: blur(6px);
}
.site-light .article-page-hero-copy h1,
.site-light .rules-page-hero-copy h1 { color: var(--light-red-deep); text-shadow: none; }
.site-light .article-page-hero-copy > p,
.site-light .rules-page-hero-copy > p { color: var(--light-gold); }
.site-light .article-page-hero-copy > span,
.site-light .rules-page-hero-copy > span { color: var(--light-ink-soft); }

/* Shared paper panels */
.site-light .download-hub,
.site-light .community-page-directory,
.site-light .guide-hub,
.site-light .article-paper,
.site-light .article-sidebar,
.site-light .rules-overview,
.site-light .rules-toc,
.site-light .rules-legal,
.site-light .rules-chapter,
.site-light .system-requirements,
.site-light .community-section {
  border-color: var(--light-line);
  background: var(--light-paper);
  color: var(--light-ink);
  box-shadow: var(--light-shadow);
  backdrop-filter: blur(10px) saturate(1.03);
}
.site-light .community-section { background-image: none; }
.site-light .download-hub-requirements,
.site-light .download-hub-links,
.site-light .guide-content,
.site-light .article-content,
.site-light .rules-content { background-color: transparent; }
.site-light .guide-tabs-sidebar { background: rgba(235, 218, 188, .9); }
.site-light .guide-tabs-sidebar > p:not(.guide-tabs-kicker),
.site-light .guide-tab-panel > p:not(.guide-panel-kicker) { color: var(--light-ink-soft); }

.site-light main :is(h1, h2, h3, h4, h5, strong) { color: var(--light-ink); }
.site-light main :is(p, li, dd, dt, em) { color: var(--light-ink-soft); }
.site-light main :is(.download-kicker, .community-kicker, .guide-tabs-kicker, .guide-panel-kicker, .article-kicker, .rules-kicker) { color: var(--light-red); }

/* Light cards and tables across download, guide, article and rules pages */
.site-light .download-page-card,
.site-light .download-hub-package-heading,
.site-light .download-hub-server-option,
.site-light .download-hub-launcher,
.site-light .download-hub-tools a,
.site-light .windows-recommendation,
.site-light .requirements-table-wrap,
.site-light .social-card,
.site-light .group-function-placeholder,
.site-light .guide-tab,
.site-light .race-profile,
.site-light .character-create-guide,
.site-light .character-create-step,
.site-light .character-create-notes > section,
.site-light .weapon-guide-intro,
.site-light .weapon-school-card,
.site-light .weapon-force-note,
.site-light .equipment-guide-intro,
.site-light .equipment-seal-section,
.site-light .degree-card,
.site-light .seal-rank-card,
.site-light .equipment-name-parts,
.site-light .seal-later-versions,
.site-light .seal-later-grid > div,
.site-light .equipment-type-card,
.site-light .equipment-how-section,
.site-light .equipment-how-grid > div,
.site-light .ingame-bot-hero,
.site-light .ingame-feature-section,
.site-light .ingame-feature-card,
.site-light .bot-settings-panel,
.site-light .bot-settings-header,
.site-light .ingame-bot-note,
.site-light .article-breadcrumb,
.site-light .article-update-state,
.site-light .article-editor-note,
.site-light .article-related-card,
.site-light .event-guide-intro,
.site-light .event-type-card,
.site-light .weekly-event-board,
.site-light .weekly-event-grid > div,
.site-light .event-guide-note,
.site-light .academy-guide-intro,
.site-light .academy-guide-card,
.site-light .academy-buff-board,
.site-light .academy-buff-facts > div,
.site-light .academy-guide-note,
.site-light .mbot-video-card,
.site-light .rules-law-card,
.site-light .rules-sources,
.site-light .rules-closing,
.site-light .guide-step-grid > div,
.site-light .guide-info-grid > div,
.site-light .shortcut-grid > div,
.site-light .guide-alert,
.site-light .guide-server-note,
.site-light .level-formula > div,
.site-light .stat-card,
.site-light .guide-flow > div,
.site-light .build-path-grid > div,
.site-light .guide-callout-grid > div,
.site-light .alchemy-path-grid article,
.site-light .job-checklist,
.site-light .party-compare-grid > div,
.site-light .share-mode-grid > div,
.site-light .job-triangle article,
.site-light .pet-card-grid article,
.site-light .pet-care-list > div {
  border-color: var(--light-line);
  background: var(--light-paper-strong);
  color: var(--light-ink);
  box-shadow: 0 9px 24px rgba(68, 35, 13, .08);
}
.site-light .mbot-video-card figcaption span { color: var(--light-ink-soft); }

.site-light .guide-tab.is-active,
.site-light .download-page-card:hover,
.site-light .social-card:hover,
.site-light .article-related-card:hover { background: #f3dfba; }
.site-light .requirements-table thead th { background: #ead5ad; color: var(--light-red-deep); }
.site-light .requirements-table th,
.site-light .requirements-table td { border-color: rgba(132, 86, 36, .2); color: var(--light-ink-soft); }
.site-light .requirements-table th:first-child { color: var(--light-red-deep); }
.site-light .rules-law-grid,
.site-light .guide-step-grid,
.site-light .pet-care-list { background: rgba(132, 86, 36, .18); }
.site-light .rules-legal > header h2 { color: var(--light-red-deep); }
.site-light .rules-legal > header p { color: var(--light-ink-soft); }

/* Keep text over photos/video high contrast */
.site-light .latest-card h3,
.site-light .promo-carousel-copy strong,
.site-light .promo-carousel-copy p,
.site-light .media-center-embed strong,
.site-light .media-center-embed small,
.site-light .download-hub-primary strong,
.site-light .download-hub-primary small,
.site-light .download-hub-package-client strong,
.site-light .download-hub-package-client small { color: #fff3cf; }
.site-light .latest-card-readmore { color: rgb(var(--card-accent)); }
@keyframes latest-card-shine {
  0%, 18% { transform: translateX(-155%) skewX(-16deg); opacity: 0; }
  34% { opacity: .72; }
  62%, 100% { transform: translateX(255%) skewX(-16deg); opacity: 0; }
}
body.site-light .latest-card::before {
  content: "";
  position: absolute;
  z-index: 1;
  top: 0;
  bottom: auto;
  left: 0;
  width: 34%;
  height: 58%;
  background: linear-gradient(90deg, transparent, rgba(255, 246, 207, .08), rgba(255, 238, 174, .38), rgba(255, 255, 242, .13), transparent);
  filter: blur(2px);
  pointer-events: none;
  animation: latest-card-shine 7.5s ease-in-out infinite;
}
body.site-light .latest-card:nth-child(2)::before { animation-delay: -1.8s; }
body.site-light .latest-card:nth-child(3)::before { animation-delay: -3.6s; }
body.site-light .latest-card:nth-child(4)::before { animation-delay: -5.4s; }
body.site-light .latest-card h3 {
  position: relative;
  z-index: 2;
  align-self: stretch;
  max-width: none;
  margin: clamp(13px, .9vw, 17px) clamp(14px, 1vw, 19px) 0;
  padding: 0;
  border: 0;
  border-radius: 0;
  background: transparent;
  color: #69251c;
  font-weight: 900;
  line-height: 1.35;
  text-shadow: none;
  box-shadow: none;
  backdrop-filter: none;
  transition: color .24s ease;
}
body.site-light .latest-card-meta { color: #7a624e; }
body.site-light .latest-card-meta span { color: rgb(var(--card-accent)); }
body.site-light .latest-card-readmore {
  position: relative;
  z-index: 2;
  margin-top: auto;
  padding: 7px 11px;
  border: 1px solid rgba(var(--card-accent), .56);
  border-radius: 4px;
  background: rgba(255, 250, 238, .86);
  color: #4d1d14;
  text-shadow: none;
  box-shadow: 0 4px 12px rgba(56, 24, 10, .13);
  backdrop-filter: blur(2px);
  transition: transform .24s ease, background .24s ease, box-shadow .24s ease;
}
body.site-light .latest-card-link:hover h3,
body.site-light .latest-card-link:focus-visible h3 { transform: none; background: transparent; color: #8b2f22; }
body.site-light .latest-card-link:hover .latest-card-readmore,
body.site-light .latest-card-link:focus-visible .latest-card-readmore { transform: translateY(-2px); background: #fffaf0; box-shadow: 0 7px 17px rgba(56, 24, 10, .17), 0 0 10px rgba(var(--card-accent), .18); }
.site-light .download-hub-package-client strong,
.site-light .download-hub-package-client small,
.site-light .download-hub-primary strong,
.site-light .download-hub-primary small { color: #2b1608; }
.site-light .media-center-embed { background: rgba(25, 14, 7, .92); }

.site-light .download-page-footer,
.site-light .poster-footer {
  border-color: var(--light-line);
  background: rgba(255, 250, 238, .94);
  color: var(--light-ink-soft);
}
.site-light .download-page-footer p,
.site-light .poster-footer > p,
.site-light .poster-footer nav a { color: var(--light-ink-soft); }

.site-light .messenger-support-float { box-shadow: 0 10px 28px rgba(37, 77, 190, .28); }

@media (prefers-reduced-motion: reduce) {
  .site-light .poster-vignette::before { display: none; }
  .site-light .poster-vignette::after { animation: none; opacity: .36; }
  .site-light .latest-panel::before { display: none; }
  body.site-light .latest-card::before { display: none; }
}

/* Mobile light layout */
@media (max-width: 860px) {
  body.site-light {
    background:
      linear-gradient(180deg, rgba(255, 250, 240, .76), rgba(247, 234, 211, .88)),
      url("assets/bach-duong-background-v83.jpg") center top / auto 100vh scroll no-repeat;
  }
  .site-light .mobile-hero::after { background: linear-gradient(180deg, rgba(255, 248, 230, .08), rgba(246, 230, 202, .52) 72%, #f2dfbb 100%); }
  .site-light .mobile-content { background: rgba(247, 235, 213, .86); }
  .site-light .feature-card,
  .site-light .latest-panel,
  .site-light .mobile-media-center,
  .site-light .mobile-community { background: rgba(255, 252, 244, .92); border-color: var(--light-line); }
  .site-light .feature-card-commitment { border-color: rgba(128, 50, 28, .58); background: radial-gradient(circle at 90% 18%, rgba(188, 112, 36, .18), transparent 32%), rgba(255, 247, 226, .94); }
  .site-light .mobile-hero h1,
  .site-light .mobile-hero p { color: #fff0c8; text-shadow: 0 3px 14px rgba(43, 18, 5, .72); }
  .site-light .download-page-hero-copy { padding: 15px 18px; }
  .site-light .download-hub,
  .site-light .guide-hub { background: rgba(255, 251, 242, .94); }
}
/* Caravan event detail */
.caravan-detail-page .article-page-grid{grid-template-columns:minmax(0,1fr)}
.caravan-detail-page .article-paper{padding:clamp(18px,3vw,42px)}
.caravan-detail-page .article-breadcrumb{flex-wrap:wrap}
.caravan-detail-intro{max-width:920px;margin:0 auto 28px;text-align:center}
.caravan-detail-intro small{display:block;margin-bottom:8px;color:#a25a35;font-size:11px;font-weight:900;letter-spacing:.15em}
.caravan-detail-intro h2{margin:0 0 12px;color:#77291f;font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(32px,5vw,54px)}
.caravan-detail-intro p{margin:0;color:#6b5a4f;line-height:1.7}
.caravan-guide{display:grid;gap:22px;min-width:0;max-width:100%;margin-top:28px;color:#3f3027}
.caravan-draft-banner{display:flex;align-items:center;gap:16px;padding:14px 18px;border:1px solid rgba(143,48,31,.32);background:linear-gradient(90deg,rgba(143,48,31,.12),rgba(214,170,83,.12));box-shadow:inset 4px 0 #8f301f}
.caravan-draft-banner strong{flex:0 0 auto;color:#8b281b;font-size:12px;letter-spacing:.14em}
.caravan-draft-banner span{font-size:14px;font-weight:700}
.caravan-hero{position:relative;overflow:hidden;margin:0;min-height:390px;border:1px solid rgba(112,77,42,.3);background:#1e1712}
.caravan-hero::after{content:"";position:absolute;inset:0;background:linear-gradient(90deg,rgba(25,13,8,.86) 0%,rgba(25,13,8,.44) 48%,rgba(25,13,8,.08) 75%),linear-gradient(0deg,rgba(25,13,8,.55),transparent 48%);pointer-events:none}
.caravan-hero>img{display:block;width:100%;height:100%;min-height:390px;object-fit:cover}
.caravan-hero-copy{position:absolute;z-index:2;left:34px;bottom:46px;max-width:510px;color:#fff7e8}
.caravan-hero-copy small,.caravan-section header small{display:block;margin-bottom:8px;color:#c89443;font-size:11px;font-weight:900;letter-spacing:.16em}
.caravan-hero-copy strong{color:#fff7e8;font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(27px,4vw,44px);line-height:1.12;text-shadow:0 2px 16px rgba(0,0,0,.45)}
.caravan-hero figcaption{position:absolute;z-index:2;right:14px;bottom:10px;color:rgba(255,247,232,.78);font-size:11px}
.caravan-facts{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));border:1px solid rgba(112,77,42,.24);background:rgba(255,251,242,.72)}
.caravan-facts>div{display:grid;gap:5px;padding:20px;border-right:1px solid rgba(112,77,42,.18)}
.caravan-facts>div:last-child{border-right:0}
.caravan-facts span{color:#9b4b2e;font-family:Georgia,"Times New Roman",serif;font-size:24px;font-weight:700}
.caravan-facts strong{font-size:14px;text-transform:uppercase}
.caravan-facts small{color:#75665c;font-size:12px;line-height:1.45}
.caravan-section{min-width:0;max-width:100%;padding:28px;border:1px solid rgba(112,77,42,.24);background:rgba(255,252,245,.72)}
.caravan-section>header{margin-bottom:20px}
.caravan-section h3{margin:0;color:#77291f;font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(24px,3vw,34px);line-height:1.15}
.caravan-faction-grid,.caravan-reward-grid{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:14px}
.caravan-faction-grid article{display:flex;gap:16px;min-width:0;padding:20px;border:1px solid rgba(112,77,42,.22);background:#f6ecd7}
.caravan-faction-grid article>span{display:grid;place-items:center;flex:0 0 52px;height:52px;border:1px solid rgba(143,48,31,.35);border-radius:50%;color:#8b281b;font-weight:900}
.caravan-faction-grid strong{display:block;margin-bottom:6px;color:#53251e;font-size:17px}
.caravan-faction-grid p,.caravan-reward>p,.caravan-reward-grid p,.caravan-warning p{margin:0;color:#6b5a4f;line-height:1.65}
.caravan-schedule>img{display:block;width:100%;height:auto;margin-bottom:20px;border:1px solid rgba(112,77,42,.22)}
.caravan-table-wrap{max-width:100%;overflow-x:auto;border:1px solid rgba(112,77,42,.22)}
.caravan-table-wrap table{width:100%;min-width:780px;border-collapse:collapse;background:#fffaf0;font-size:13px}
.caravan-table-wrap th,.caravan-table-wrap td{padding:12px 13px;border-bottom:1px solid rgba(112,77,42,.17);text-align:left;vertical-align:top}
.caravan-table-wrap th{background:#74291f;color:#fff1d4;font-size:11px;letter-spacing:.05em;text-transform:uppercase}
.caravan-table-wrap tbody tr:last-child td{border-bottom:0}
.caravan-table-wrap td:last-child{color:#8b281b;font-weight:900}
.caravan-step-grid{display:grid;grid-template-columns:repeat(4,minmax(0,1fr));gap:12px}
.caravan-step-grid article{min-width:0;min-height:210px;padding:20px;border:1px solid rgba(112,77,42,.22);background:#f8efdc}
.caravan-step-grid span{display:block;margin-bottom:34px;color:#b36d45;font-size:12px;font-weight:900}
.caravan-step-grid strong{display:block;margin-bottom:9px;color:#4a2d21;font-size:15px;text-transform:uppercase}
.caravan-step-grid p{margin:0;color:#76665b;font-size:13px;line-height:1.6}
.caravan-play-flow{grid-template-columns:repeat(3,minmax(0,1fr))}
.caravan-play-flow article{min-height:230px}
.caravan-role-guide{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));gap:16px;margin-top:18px}
.caravan-role-guide>article{min-width:0;padding:22px;border:1px solid rgba(112,77,42,.24);background:#fffaf0}
.caravan-role-guide>article>header{display:flex;align-items:center;gap:14px;margin-bottom:15px;padding-bottom:14px;border-bottom:1px solid rgba(112,77,42,.17)}
.caravan-role-guide>article>header>span{display:grid;place-items:center;flex:0 0 46px;height:46px;border:1px solid rgba(143,48,31,.3);border-radius:50%;background:#f3e3c6;font-size:20px}
.caravan-role-guide header small{margin:0 0 4px;color:#a25a35;font-size:10px;font-weight:900;letter-spacing:.13em}
.caravan-role-guide header strong{display:block;color:#53251e;font-size:18px}
.caravan-role-guide ol{display:grid;gap:12px;margin:0;padding-left:20px}
.caravan-role-guide li{padding-left:3px;color:#6b5a4f;font-size:13px;line-height:1.6}
.caravan-role-guide li::marker{color:#a25a35;font-weight:900}
.caravan-role-guide li b{color:#4f3025}
.caravan-eligibility{display:grid;grid-template-columns:auto repeat(3,minmax(0,1fr));align-items:center;gap:10px;margin-top:16px;padding:15px 18px;border:1px solid rgba(143,48,31,.28);background:#f3e3c6}
.caravan-eligibility strong{color:#77291f;font-size:13px;text-transform:uppercase}
.caravan-eligibility span{padding:9px 10px;border-left:2px solid rgba(143,48,31,.42);color:#625147;font-size:12px;font-weight:700}
.caravan-formula{margin-bottom:18px;padding:17px 20px;border-left:4px solid #8f301f;background:#f0dfbe;color:#5e241c;font-family:"Segoe UI",Arial,sans-serif;font-size:clamp(18px,2.4vw,25px);font-weight:700}
.caravan-reward>p{margin-bottom:18px}
.caravan-reward-grid article{min-width:0;padding:20px;border:1px solid rgba(112,77,42,.22);background:#fffaf0}
.caravan-reward-grid small{display:block;margin-bottom:7px;color:#a25a35;font-size:10px;font-weight:900;letter-spacing:.12em}
.caravan-reward-grid strong{display:block;margin-bottom:8px;color:#5b291f;font-size:17px}
.caravan-warning{display:flex;gap:16px;padding:22px;border:1px solid rgba(143,48,31,.28);background:#f4e5ca}
.caravan-warning>span{display:grid;place-items:center;flex:0 0 40px;height:40px;border:1px solid #9f4a31;border-radius:50%;color:#8b281b;font-weight:900}
.caravan-warning strong{display:block;margin-bottom:6px;color:#77291f;text-transform:uppercase}
@media(max-width:900px){.caravan-facts{grid-template-columns:repeat(2,minmax(0,1fr))}.caravan-facts>div:nth-child(2){border-right:0}.caravan-facts>div:nth-child(-n+2){border-bottom:1px solid rgba(112,77,42,.18)}.caravan-step-grid{grid-template-columns:repeat(2,minmax(0,1fr))}.caravan-eligibility{grid-template-columns:1fr 1fr}.caravan-eligibility strong{grid-column:1/-1}}
@media(max-width:620px){.caravan-guide{gap:14px}.caravan-draft-banner{align-items:flex-start;flex-direction:column;gap:5px}.caravan-hero,.caravan-hero>img{min-height:430px}.caravan-hero>img{object-position:58% center}.caravan-hero-copy{left:20px;right:20px;bottom:52px}.caravan-hero-copy strong{font-size:28px}.caravan-hero figcaption{left:20px;right:20px}.caravan-facts,.caravan-faction-grid,.caravan-reward-grid,.caravan-step-grid,.caravan-role-guide,.caravan-eligibility{grid-template-columns:1fr}.caravan-facts>div{border-right:0;border-bottom:1px solid rgba(112,77,42,.18)}.caravan-facts>div:last-child{border-bottom:0}.caravan-section{padding:20px 16px}.caravan-step-grid article{min-height:0}.caravan-step-grid span{margin-bottom:24px}.caravan-role-guide>article{padding:18px 16px}.caravan-eligibility strong{grid-column:auto}.caravan-warning{align-items:flex-start}.caravan-schedule>img{display:none}}
.caravan-faction-grid>*,.caravan-reward-grid>*,.caravan-step-grid>*,.caravan-warning>div{min-width:0;overflow-wrap:anywhere}
.site-light .caravan-hero .caravan-hero-copy{z-index:3;color:#fff7e8}
.site-light .caravan-hero .caravan-hero-copy strong{color:#fff7e8!important}
@media(max-width:620px){.caravan-table-wrap{overflow:visible;border:0}.caravan-table-wrap table{display:block;min-width:0;background:transparent}.caravan-table-wrap thead{display:none}.caravan-table-wrap tbody{display:grid;gap:12px}.caravan-table-wrap tr{display:grid;padding:10px 14px;border:1px solid rgba(112,77,42,.22);background:#fffaf0}.caravan-table-wrap td{display:grid;grid-template-columns:105px minmax(0,1fr);gap:10px;padding:8px 0;border-bottom:1px dashed rgba(112,77,42,.18)}.caravan-table-wrap td:last-child{border-bottom:0}.caravan-table-wrap td::before{color:#9a4e31;font-size:10px;font-weight:900;letter-spacing:.06em;text-transform:uppercase}.caravan-table-wrap td:nth-child(1)::before{content:"Ngày"}.caravan-table-wrap td:nth-child(2)::before{content:"Mở ký gửi"}.caravan-table-wrap td:nth-child(3)::before{content:"Xuất phát"}.caravan-table-wrap td:nth-child(4)::before{content:"Phe bảo vệ"}.caravan-table-wrap td:nth-child(5)::before{content:"Phe tấn công"}.caravan-table-wrap td:nth-child(6)::before{content:"Hệ số"}}
