:root {
  /* IDML CMYK C=92 M=68 Y=13 K=0 */
  --idml-ch0-deep: #055397;
  /* IDML CMYK C=70 M=40 Y=0 K=0 */
  --idml-ch0-main: #5085C5;
  /* IDML CMYK C=12 M=3 Y=0 K=0 */
  --idml-ch0-light: #D2DDF1;

  --body-bg: linear-gradient(0deg, #E5EFFA 0%, #F2F7FD 20%, #FFF 100%);

  /* Chapter 1: blue */
  --ch1-dark: #2E6AA3; /* C=80 M=50 Y=10 K=10 */
  --ch1-main: #178DC8; /* C=75 M=25 Y=0 K=10 */
  --ch1-mid: #A1C3E7; /* C=40 M=15 Y=0 K=0 */
  --ch1-light: #E5F0FA; /* C=12 M=3 Y=0 K=0 */

  /* Chapter 2: red */
  --ch2-dark: #BC1124; /* C=20 M=100 Y=90 K=10 */
  --ch2-main: #D9464E; /* C=10 M=85 Y=60 K=0 */
  --ch2-mid: #F3A69C; /* C=0 M=45 Y=30 K=0 */
  --ch2-light: #FDF3F0; /* C=0 M=7 Y=5 K=0 */

  /* Chapter 3: green */
  --ch3-dark: #12735F; /* C=70 M=0 Y=50 K=50 */
  --ch3-main: #2B9D83; /* C=70 M=0 Y=50 K=20 */
  --ch3-mid: #61B17B; /* C=60 M=0 Y=60 K=10 */
  --ch3-light: #D4EBE1; /* C=20 M=0 Y=15 K=0 */
  --ch3-soft: #EBF5EC; /* C=10 M=0 Y=10 K=0 */

  /* Chapter 4: orange */
  --ch4-dark: #945024; /* C=0 M=60 Y=90 K=50 */
  --ch4-main: #BF781A; /* C=0 M=50 Y=100 K=30 */
  --ch4-mid: #F9C158; /* C=0 M=30 Y=70 K=0 */
  --ch4-light: #FFF4D6; /* C=0 M=5 Y=20 K=0 */

  /* Chapter 5: purple */
  --ch5-dark: #6A56A2; /* C=67 M=70 Y=0 K=0 */
  --ch5-main: #A587BD; /* C=40 M=50 Y=0 K=0 */
  --ch5-mid: #DABEDA; /* C=15 M=30 Y=0 K=0 */
  --ch5-light: #E8E6F3; /* C=10 M=10 Y=0 K=0 */

  /* Chapter 6: slate */
  --ch6-dark: #39424A;
  --ch6-main: #475D76;
  --ch6-mid: #6C787F;
  --ch6-light: #E4EBF3;
  --ch6-soft: #E4EBF3;

  --primary-color: var(--idml-ch0-deep);
  --secondary-color: var(--idml-ch0-main);
  --chapter-dark: var(--primary-color);
  --chapter-main: var(--primary-color);
  --chapter-mid: var(--secondary-color);
  --chapter-light: var(--idml-ch0-light);
  --chapter-soft: var(--idml-ch0-light);
  --h2-bg: linear-gradient(90deg, var(--chapter-light) 0%, transparent 100%);;
  --bg-sky: #2790aa;
  --bg-sky-gray: #aac9d8;
  --bg-sky-secondary: #d3e3ea;
  --bg-grass: #64bf71;
  --bg-grass-gray: #dbeeeb;
  --bg-violet: var(--ch1-dark);
  --bg-violet-light: #9d96c9;
  --bg-violet-secondary: #c9c6e3;
  --bg-tan: var(--ch2-main);
  --bg-tan-light: var(--ch2-mid);
  --bg-tan-secondary: var(--ch2-light);
  --text-color: var(--primary-color);
  --line: #d9e5eb;
  --page-max: 1140px;
  --menu-height: 78px;
  --reading-font-increase: 2px;
  color-scheme: light;
  --chapter-linear-color-1: #00AEBB;
  --chapter-linear-color-2: #178DC8;

  --chapter-table-header: var(--guideline-ch0-table-header, var(--guideline-ch0-deep));
  --chapter-table-left: var(--guideline-ch0-table-left, var(--guideline-ch0-soft));
  --chapter-table-stripe: var(--guideline-ch0-table-stripe, var(--guideline-ch0-soft));
  --chapter-table-border: var(--guideline-ch0-table-border, var(--guideline-ch0-deep));
  --chapter-table-bg: #F8FBFE;

  --table-min-width: max-content;
  --table-max-width: 726px;
}

* {
  box-sizing: border-box;
  position: relative;
}

.visually-hidden {
  position: absolute;
  width: 1px;
  height: 1px;
  padding: 0;
  margin: -1px;
  overflow: hidden;
  clip: rect(0, 0, 0, 0);
  white-space: nowrap;
  border: 0;
}

html,
body {
  margin: 0;
  padding: 0;
  font-family: "Noto Sans TC", "PingFang TC", "Microsoft JhengHei", Arial, sans-serif;
  color: #333;
  background: #fff;
  font-size: 16px;
}

body[data-page="ch01"] {
  --chapter-dark: var(--ch1-dark);
  --chapter-main: var(--ch1-main);
  --chapter-mid: var(--ch1-mid);
  --chapter-light: var(--ch1-light);
  --chapter-soft: var(--ch1-light);
  --h2-bg: linear-gradient(90deg, var(--ch1-light) 0%, transparent 100%);
  --body-bg: linear-gradient(0deg, #E5EFFA 0%, #F2F7FD 20%, #FFF 100%);
  --chapter-linear-color-1: #00AEBB;
  --chapter-linear-color-2: #178DC8;

  --chapter-table-header: var(--guideline-ch1-table-header);
  --chapter-table-left: var(--guideline-ch1-table-left);
  --chapter-table-stripe: var(--guideline-ch1-table-stripe);
  --chapter-table-border: var(--guideline-ch1-table-border);
  --chapter-table-bg: #F8FBFE;
}

body[data-page="ch02"] {
  --chapter-dark: var(--ch2-dark);
  --chapter-main: var(--ch2-main);
  --chapter-mid: var(--ch2-mid);
  --chapter-light: var(--ch2-light);
  --chapter-soft: var(--ch2-light);
  --h2-bg: linear-gradient(90deg, var(--ch2-light) 0%, transparent 100%);
  --body-bg: linear-gradient(0deg, #FDEEED 0%, #FEF7F6 20%, #FFF 100%);
  --chapter-linear-color-1: #ED6D46;
  --chapter-linear-color-2: #D34642;

  --chapter-table-header: var(--guideline-ch2-table-header);
  --chapter-table-left: var(--guideline-ch2-table-left);
  --chapter-table-stripe: var(--guideline-ch2-table-stripe);
  --chapter-table-border: var(--guideline-ch2-table-border);
  --chapter-table-bg: #FFFCFC;
}

body[data-page="ch03"] {
  --chapter-dark: var(--ch3-dark);
  --chapter-main: var(--ch3-main);
  --chapter-mid: var(--ch3-mid);
  --chapter-light: var(--ch3-light);
  --chapter-soft: var(--ch3-light);
  --h2-bg: linear-gradient(90deg, var(--ch3-light) 0%, transparent 100%);
  --body-bg: linear-gradient(0deg, #EBF4EB 0%, #F5F9F5 20%, #FFF 100%);
  --chapter-linear-color-1: #CDDF81;
  --chapter-linear-color-2: #219E84;

  --chapter-table-header: var(--guideline-ch3-table-header);
  --chapter-table-left: var(--guideline-ch3-table-left);
  --chapter-table-stripe: var(--guideline-ch3-table-stripe);
  --chapter-table-border: var(--guideline-ch3-table-border);
  --chapter-table-bg: #FAFCFB;
}

body[data-page="ch04"] {
  --chapter-dark: var(--ch4-dark);
  --chapter-main: var(--ch4-main);
  --chapter-mid: var(--ch4-mid);
  --chapter-light: var(--ch4-light);
  --chapter-soft: var(--ch4-light);
  --h2-bg: linear-gradient(90deg, var(--ch4-light) 0%, transparent 100%);
  --body-bg: linear-gradient(0deg, #FEF4D6 0%, #FFF9EB 20%, #FFF 100%);
  --chapter-linear-color-1: #F8B500;
  --chapter-linear-color-2: #BE781A;

  --chapter-table-header: var(--guideline-ch4-table-header);
  --chapter-table-left: var(--guideline-ch4-table-left);
  --chapter-table-stripe: var(--guideline-ch4-table-stripe);
  --chapter-table-border: var(--guideline-ch4-table-border);
  --chapter-table-bg: #FFFEFA;
}

body[data-page="ch05"] {
  --chapter-dark: var(--ch5-dark);
  --chapter-main: var(--ch5-main);
  --chapter-mid: var(--ch5-mid);
  --chapter-light: var(--ch5-light);
  --chapter-soft: var(--ch5-light);
  --h2-bg: linear-gradient(90deg, var(--ch5-light) 0%, transparent 100%);
  --body-bg: linear-gradient(0deg, #E9E6F3 0%, #F4F3F9 20%, #FFF 100%);
  --chapter-linear-color-1: #AF4184;
  --chapter-linear-color-2: #996FA0;

  --chapter-table-header: var(--guideline-ch5-table-header);
  --chapter-table-left: var(--guideline-ch5-table-left);
  --chapter-table-stripe: var(--guideline-ch5-table-stripe);
  --chapter-table-border: var(--guideline-ch5-table-border);
  --chapter-table-bg: #F9F9FC;
}

body[data-page="ch06"] {
  --chapter-dark: var(--ch6-dark);
  --chapter-main: var(--ch6-main);
  --chapter-mid: var(--ch6-mid);
  --chapter-light: var(--ch6-light);
  --chapter-soft: var(--ch6-light);
  --h2-bg: linear-gradient(90deg, var(--ch6-light) 0%, transparent 100%);
  --body-bg: linear-gradient(180deg, #FFF 0%, #F1F5F9 80%, #E4EBF3 100%);
  --chapter-linear-color-1: #465D77;
  --chapter-linear-color-2: #B0B7C0;

  --chapter-table-header: var(--guideline-ch6-table-header);
  --chapter-table-left: var(--guideline-ch6-table-left);
  --chapter-table-stripe: var(--guideline-ch6-table-stripe);
  --chapter-table-border: var(--guideline-ch6-table-border);
  --chapter-table-bg: #F9F9FC;
}

body[data-page="ch06"] .nav-tabs a[aria-selected="true"] {
  background-color: var(--chapter-main) !important;
  color: #fff !important;
}

body.nav-open {
  overflow: hidden;
}

body {
  position: relative;
}

body::before {
  content: '';
  position: fixed;
  top: 0;
  left: 0;
  width: 100%;
  height: 100dvh;
  background: var(--body-bg);
}

h1,
h2,
h3,
h4,
h5,
h6,
p,
ul,
ol,
figure {
  margin: 0;
}

a {
  color: var(--text-color);
  text-decoration: none;
  transition: color 0.2s, background-color 0.2s, border-color 0.2s;
}

.content-link {
  text-decoration: underline;
  text-underline-offset: 0.16em;
}

img {
  display: block;
  max-width: 100%;
  height: auto;
}

.wrapper {
  width: 100%;
  overflow: clip;
}

.menu-height {
  height: var(--menu-height);
}

.header {
  z-index: 20;
}

.navbar {
  position: fixed;
  inset: 0 0 auto;
  z-index: 20;
  min-height: var(--menu-height);
  padding: 0 40px;
  background: #fff;
  box-shadow: 0 1px 0 rgba(0, 0, 0, 0.08);
}

.navbar-inner {
  display: flex;
  align-items: center;
  justify-content: space-between;
  width: 100%;
  min-height: var(--menu-height);
  position: initial;
}

.navbar-brand {
  display: flex;
  align-items: center;
  flex: 0 0 auto;
}

.navbar-brand .home {
  width: auto;
  height: 48px;
  margin: 0;
}

#addMenu {
  display: none;
  color: var(--chapter-main);
  font-size: 14px;
  overflow: hidden;
  text-align: right;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.navbar-collapse {
  display: flex;
  align-self: stretch;
  justify-content: flex-end;
}

.navbar-nav {
  display: flex;
  align-items: center;
  height: 100%;
  gap: 0;
  margin: 0;
  padding: 0;
  list-style: none;
}

.nav-item {
  display: flex;
  align-items: stretch;
  flex: 0 0 auto;
}

.nav-link {
  display: flex;
  align-items: center;
  min-height: var(--menu-height);
  margin: 0;
  padding: 0 16px;
  color: #888;
  font-size: 14px;
  line-height: 1.4;
}

button.nav-link {
  border: 0;
  background: transparent;
  font-family: inherit;
  cursor: pointer;
}

.navbar-collapse .navbar-nav .nav-item {
  margin: 0;
}

.navbar-nav .nav-item .nav-link {
  width: 100px;
  padding: 0;
  justify-content: center;
  align-items: center;
}

.nav-link:hover {
  background: #f5f5f5;
  color: #555;
}

.nav-link.active {
  background: var(--chapter-main);
  color: #fff;
}

.nav-link.disabled,
.nav-link.disabled:hover {
  background: transparent;
  color: #aaa;
  cursor: default;
}

.nav-dropdown {
  display: none;
  position: absolute;
  top: 100%;
  left: 50%;
  min-width: 260px;
  padding: 8px 0;
  border-radius: 3px;
  background: #fff;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.2);
  list-style: none;
  transform: translateX(-72%);
}

.nav-item.has-dropdown.is-open .nav-dropdown {
  display: block;
}

.nav-dropdown a {
  display: block;
  padding: 10px 16px;
  color: var(--primary-color);
  font-size: 14px;
  text-align: center;
}

.navbar-toggler {
  display: none;
  width: 44px;
  height: 44px;
  border: 0;
  background: transparent;
}

.navbar-toggler-icon,
.navbar-toggler-icon::before,
.navbar-toggler-icon::after {
  display: block;
  width: 24px;
  height: 2px;
  margin: auto;
  background: var(--primary-color);
  content: "";
}

.navbar-toggler-icon::before {
  position: absolute;
  top: -7px;
  left: 0;
}

.navbar-toggler-icon::after {
  position: absolute;
  right: 0;
  bottom: -7px;
}

.cover-page {
  background: #fff;
}

.cover {
  width: 100%;
  margin: 0;
}

.page {
  --text-color: var(--chapter-main);
}

.page-banner {
  position: relative;
  width: 100%;
  margin: 0;
  overflow: hidden;
  background: #fff;
  aspect-ratio: 1920 / 500;
}

.page-banner-image {
  display: block;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: center;
}

.page-banner-name {
  position: absolute;
  top: 50%;
  /* left: 62%; */
  right: 20%;
  z-index: 1;
  color: var(--chapter-dark);
  transform: translateY(-50%);
  display: flex;
  flex-direction: column;
  align-items: flex-end;
}



.page-banner-number {
  background: linear-gradient(270deg, var(--chapter-linear-color-1) 0%, var(--chapter-linear-color-2) 100%);
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  font-size: clamp(1.875rem, -0.15rem + 10.125vw, 12rem);
  line-height: normal;
  font-weight: 900;
  font-family: "Roboto";
}

.page-banner-title {
  font-size: var(--guideline-h1-font-size);
  font-weight: var(--guideline-h1-font-weight);
  line-height: var(--guideline-h1-line-height);
  letter-spacing: var(--guideline-h1-letter-spacing);
  color: var(--chapter-main);
}

.page-banner-title::after {
  content: '';
  display: block;
  margin-left: auto;
  margin-top: 40px;
  width: 120px;
  height: 4px;
  background: linear-gradient(270deg, var(--chapter-linear-color-1) 0%, var(--chapter-linear-color-2) 100%);
}

.page-hero {
  padding: 72px 0 42px;
  background: linear-gradient(100deg, color-mix(in srgb, var(--text-color), white 88%), #fff 68%);
}

.container {
  width: min(100% - 40px, var(--page-max));
  margin-inline: auto;
}

.eyebrow {
  margin-bottom: 8px;
  color: var(--text-color);
  font-weight: 700;
  letter-spacing: 0;
}

.page-title {
  color: var(--text-color);
  font-size: clamp(2rem, 5vw, 4rem);
  font-weight: 900;
  line-height: 1.1;
}

.page-summary {
  max-width: 780px;
  margin-top: 18px;
  color: #333;
  font-size: 1rem;
  line-height: 1.8;
  text-align: justify;
}

section {
  margin: 80px 0;
}

h2,
.title {
  color: var(--text-color);
  font-size: 24px;
  font-weight: 900;
}

h3,
.subtitle {
  margin: 30px 0 10px;
  color: var(--text-color);
  font-size: 20px;
  font-weight: 900;
  line-height: 1.6;
}

.content-heading {
  color: var(--block-color, var(--text-color));
}

.content-paragraph {
  margin: 1rem 0;
}

.content-paragraph,
.content-list li {
  color: #231916;
}

.heading-chapter-major {
  display: table;
  isolation: isolate;
  margin: 54px 0 24px;
  padding: 8px 40px;
  color: var(--block-color, var(--chapter-dark));
  font-size: 28px;
  font-weight: 400;
  line-height: 1.14;
  letter-spacing: 10%;
}

.heading-chapter-major::before {
  position: absolute;
  z-index: -1;
  right: 0;
  bottom: 0;
  left: 0;
  height: 100%;
  border-radius: 48px 0 0;
  /* background: var(--chapter-soft); */
  background: var(--h2-bg);
  content: "";
}

.heading-chapter-section {
  margin: 34px 0 14px;
  padding-top: 6px;
  padding-bottom: 6px;
  color: var(--block-color, var(--chapter-main));
  font-size: 24px;
  font-weight: 400;
  line-height: 1.25;
  letter-spacing: 10%;
}

.heading-chapter-subsection {
  margin: 28px 0 10px;
  padding-top: 4px;
  padding-bottom: 4px;
  color: var(--block-color, var(--chapter-dark));
  font-size: 20px;
  font-weight: 400;
  line-height: 1.3;
  letter-spacing: 10%;
}

.heading-chapter-support {
  margin: 20px 0 8px;
  color: var(--block-color, var(--chapter-main));
  font-size: 16px;
  font-weight: 400;
  line-height: 1.6;
}

.heading-step-label {
  display: table;
  margin: 22px 0 12px;
  padding: 3px 15px 4px;
  border-radius: 999px;
  background: var(--chapter-main);
  color: #fff;
  font-size: 15px;
  font-weight: 700;
  line-height: 1.45;
}

p,
li,
.para,
.text {
  margin: 10px 0;
  font-size: clamp(0.875rem, 0.85rem + 0.0078vw, 1rem);
  line-height: 1.75;
  text-align: justify;
  word-break: normal;
  overflow-wrap: anywhere;
}

.content-paragraph {
  max-width: none;
  color: #231916;
  font-size: calc(1rem + var(--reading-font-increase));
  line-height: 1.85;
  text-align: justify;
  text-justify: inter-ideograph;
}

.content-quote {
  margin-left: 0;
  margin-right: 0;
  color: var(--chapter-dark);
  font-weight: 500;
}

.content-list {
  width: 100%;
  max-width: none;
  margin: 12px 0;
  padding-left: 1.35rem;
  font-size: calc(1rem + var(--reading-font-increase));
  line-height: 1.85;
  text-align: justify;
  text-justify: inter-ideograph;
}

.content-list li + li {
  margin-top: 8px;
}

.content-paragraph.note {
  width: 100%;
  font-size: 12px;
  font-weight: 300;
  color: #555;
  line-height: 130%;
  margin-top: -1rem;
}

.note.note-variant-space-lg {
  margin-top: 1rem;
}

.content-note.note {
  width: 100%;
  margin-top: -1rem;
  font-size: 12px;
  font-weight: 300;
  color: #555;
  line-height: 130%;
}

.content-note.note > .content-list {
  margin-block: 0;
}

.content-list.list-variant-small-mark li::marker {
  font-size: 0.5rem;
}

.content-list.list-variant-note-details {
  padding-left: 2rem;
}

.content-list.list-variant-note-details-small-padding {
  padding-left: 10px;
}

.content-list.list-variant-note-details li {
  width: 100%;
  font-size: 12px;
  font-weight: 300;
  color: #555;
  line-height: 130%;
  margin-top: -10px;
}

.content-list.list-variant-note-details li::marker {
  font-size: 0.5rem;
}

.content-grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(260px, 0.42fr);
  gap: 44px;
  align-items: start;
}

.info-card {
  padding: 24px;
  border-top: 6px solid var(--text-color);
  background: color-mix(in srgb, var(--text-color), white 92%);
}

.stats {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 18px;
}

.stat {
  padding: 24px 20px;
  border: 1px solid var(--line);
  border-top: 6px solid var(--text-color);
  background: #fff;
}

.stat strong {
  display: block;
  color: var(--text-color);
  font-size: clamp(2rem, 4vw, 3.5rem);
  font-weight: 900;
  line-height: 1;
}

.stat span {
  display: block;
  margin-top: 8px;
  color: #333;
  font-size: 0.95rem;
  line-height: 1.5;
}

.tabs-group {
  position: sticky;
  top: var(--menu-height);
  z-index: 4;
  margin-bottom: 26px;
  padding: 8px 0;
  background: #fff;
  border-bottom: 1px solid var(--line);
  scrollbar-width: auto;
  scrollbar-color: var(--text-color) #e5eef3;
}

.tabs-group.fixed {
  position: fixed;
  top: var(--menu-height);
  left: 0;
  z-index: 10;
  width: 100%;
  padding-top: 15px;
  background: #fff;
  box-shadow: 0 6px 4px rgba(0, 0, 0, 0.2);
}

.nav-tabs {
  display: flex;
  gap: 8px;
  margin: 0;
  padding: 0;
  border: 0;
  list-style: none;
  overflow-x: auto;
}

.nav-tabs li {
  margin: 0;
}

.nav-tabs a {
  display: block;
  padding: 8px 14px;
  color: var(--text-color);
  white-space: nowrap;
}

.nav-tabs a:hover {
  background: #f1f1f1;
}

.nav-tabs a.active {
  background: var(--text-color);
  color: #fff;
}

.chapter-panel {
  display: none;
  margin-top: 44px;
  scroll-margin-top: calc(var(--menu-height) + 100px);
}

.chapter-panel.active {
  display: block;
}

.tab-panel {
  display: none;
}

.tab-panel.active {
  display: block;
}

.table-container,
.img-container {
  width: 100%;
}

.table-container {
  overflow-x: auto;
  overflow-y: hidden;
  padding-bottom: 12px;
  scrollbar-width: auto;
  scrollbar-color: var(--text-color) #e5eef3;
}

.table-container::-webkit-scrollbar {
  height: 12px;
}

.table-container::-webkit-scrollbar-track {
  background: #e5eef3;
}

.table-container::-webkit-scrollbar-thumb {
  border: 2px solid #e5eef3;
  border-radius: 999px;
  background: var(--text-color);
}

.table-variant-fit .table-container table {
  min-width: max-content;
}

.table-variant-max .table-container table {
  min-width: 726px;
}

.table-variant-full .table-container table {
  min-width: 950px;
}

.data-table-block.table-variant-space-sm {
  margin-top: 0;
  margin-bottom: 0;
}

.img-container {
  overflow-x: auto;
}

.data-table-block {
  /* margin: 28px 0; */
  margin: 1rem 0;
}

.table-scrollbar-note {
  display: none;
  margin-top: 6px;
  color: #64717a;
  font-size: 0.82rem;
  text-align: right;
}

.image-gallery {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 18px;
  margin: 24px 0;
}

.image-gallery figure {
  overflow: hidden;
  border: 1px solid var(--line);
  background: #fff;
}

.image-gallery img {
  width: 100%;
  max-height: 420px;
  object-fit: contain;
  background: #f7fafb;
}

.image-gallery figcaption {
  padding: 10px 12px;
  color: #5b6870;
  font-size: 0.88rem;
  line-height: 1.5;
}

.guideline-preview {
  --text-color: #003055;
}

.guideline-swatch-grid {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 14px;
  margin: 28px 0;
}

.guideline-chapter-scales {
  display: grid;
  gap: 34px;
  margin: 30px 0;
}

.guideline-chapter-scale {
  margin: 0;
  padding: 22px 24px 2px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #f8fbfc 0, #fff 170px);
}

.guideline-chapter-scale-heading {
  display: flex;
  align-items: baseline;
  gap: 12px;
  margin: 0;
  color: var(--text-color);
  font-size: 1.15rem;
}

.guideline-chapter-code {
  color: #fff;
  padding: 3px 8px;
  background: var(--text-color);
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0.06em;
}

.guideline-swatch {
  overflow: hidden;
  border: 1px solid var(--line);
  background: #fff;
}

.guideline-swatch-color {
  display: flex;
  align-items: end;
  min-height: 104px;
  padding: 14px;
  color: #fff;
  font-size: 0.8rem;
  font-weight: 700;
  text-shadow: 0 1px 2px rgba(0, 0, 0, 0.45);
  background: var(--chapter-main);
}

.guideline-swatch h3 {
  margin: 14px 14px 6px;
  font-size: 1rem;
}

.guideline-swatch-token,
.guideline-swatch-meta {
  margin: 0 14px 7px;
  color: #61717b;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.72rem;
  line-height: 1.45;
  text-align: left;
}

.guideline-swatch-meta:last-child {
  margin-bottom: 16px;
}

.guideline-evidence {
  margin: 30px 0;
  padding: 22px 24px;
  border-top: 6px solid var(--text-color);
  background: color-mix(in srgb, var(--text-color), white 94%);
}

.guideline-typography-table {
  margin: 32px 0;
}

.guideline-typography-table .table-container {
  overflow-x: auto;
}

.guideline-typography-table .idml-table {
  min-width: 940px;
}

.guideline-typography-table th,
.guideline-typography-table td {
  vertical-align: top;
}

.guideline-typography-table tbody th {
  color: var(--text-color);
  font-weight: 700;
  text-align: left;
}

.guideline-font-preview {
  margin: 34px 0;
  padding: 24px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #f8fbfc 0, #fff 180px);
}

.guideline-font-preview > h3 {
  margin-top: 0;
}

.guideline-font-preview-description {
  margin: 0 0 24px;
  color: #52636c;
}

.guideline-font-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 16px;
}

.guideline-font-preview-card {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--line);
  background: #fff;
}

.guideline-font-preview-label {
  margin: 0 0 3px;
  color: var(--text-color);
  font-size: 1rem;
  font-weight: 800;
  line-height: 1.35;
}

.guideline-font-preview-semantic {
  margin: 0 0 14px;
  color: #71818a;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.72rem;
}

.guideline-font-preview-sample {
  min-height: 84px;
  margin: 0 0 16px;
  padding: 16px;
  overflow-wrap: anywhere;
  border-left: 4px solid var(--text-color);
  background: color-mix(in srgb, var(--text-color), white 94%);
  color: #15232a;
}

.guideline-font-preview-meta {
  display: grid;
  grid-template-columns: minmax(112px, 0.38fr) minmax(0, 1fr);
  margin: 0;
  color: #52636c;
  font-size: 0.75rem;
  line-height: 1.45;
}

.guideline-font-preview-meta dt,
.guideline-font-preview-meta dd {
  margin: 0;
  padding: 4px 0;
  border-top: 1px solid #edf2f4;
}

.guideline-font-preview-meta dt {
  color: var(--text-color);
  font-weight: 700;
}

.guideline-font-preview-status {
  margin: 14px 0 0;
  font-size: 0.75rem;
  font-weight: 700;
}

.guideline-font-preview-status.is-available {
  color: #287a52;
}

.guideline-font-preview-status.is-fallback {
  color: #a76622;
}

.guideline-table-style-preview {
  margin: 34px 0;
  padding: 24px;
  border: 1px solid var(--line);
  background: linear-gradient(180deg, #f8fbfc 0, #fff 180px);
}

.guideline-table-style-preview > h3 {
  margin-top: 0;
}

.guideline-table-style-preview-description {
  margin: 0 0 24px;
  color: #52636c;
}

.guideline-table-style-preview-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 22px;
}

.guideline-table-style-preview-card {
  min-width: 0;
  padding: 18px;
  border: 1px solid var(--table-preview-border);
  background: #fff;
}

.table-preview-ch0 {
  --table-preview-header: var(--guideline-ch0-table-header);
  --table-preview-left: var(--guideline-ch0-table-left);
  --table-preview-stripe: var(--guideline-ch0-table-stripe);
  --table-preview-border: var(--guideline-ch0-table-border);
  --table-preview-text: #231916;
}

.table-preview-ch1 {
  --table-preview-header: var(--guideline-ch1-table-header);
  --table-preview-left: var(--guideline-ch1-table-left);
  --table-preview-stripe: var(--guideline-ch1-table-stripe);
  --table-preview-border: var(--guideline-ch1-table-border);
  --table-preview-text: #231916;
}

.table-preview-ch2 {
  --table-preview-header: var(--guideline-ch2-table-header);
  --table-preview-left: var(--guideline-ch2-table-left);
  --table-preview-stripe: var(--guideline-ch2-table-stripe);
  --table-preview-border: var(--guideline-ch2-table-border);
  --table-preview-text: #231916;
}

.table-preview-ch3 {
  --table-preview-header: var(--guideline-ch3-table-header);
  --table-preview-left: var(--guideline-ch3-table-left);
  --table-preview-stripe: var(--guideline-ch3-table-stripe);
  --table-preview-border: var(--guideline-ch3-table-border);
  --table-preview-text: #231916;
}

.table-preview-ch4 {
  --table-preview-header: var(--guideline-ch4-table-header);
  --table-preview-left: var(--guideline-ch4-table-left);
  --table-preview-stripe: var(--guideline-ch4-table-stripe);
  --table-preview-border: var(--guideline-ch4-table-border);
  --table-preview-text: #231916;
}

.table-preview-ch5 {
  --table-preview-header: var(--guideline-ch5-table-header);
  --table-preview-left: var(--guideline-ch5-table-left);
  --table-preview-stripe: var(--guideline-ch5-table-stripe);
  --table-preview-border: var(--guideline-ch5-table-border);
  --table-preview-text: #231916;
}

.table-preview-ch6 {
  --table-preview-header: var(--guideline-ch6-table-header);
  --table-preview-left: var(--guideline-ch6-table-left);
  --table-preview-stripe: var(--guideline-ch6-table-stripe);
  --table-preview-border: var(--guideline-ch6-table-border);
  --table-preview-text: #231916;
}

.guideline-table-style-preview-heading {
  display: flex;
  align-items: baseline;
  gap: 10px;
  margin: 0 0 14px;
  color: var(--table-preview-header);
  font-size: 1rem;
  line-height: 1.35;
}

.guideline-table-style-preview-code {
  padding: 3px 7px;
  background: var(--table-preview-header);
  color: #fff;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.72rem;
  letter-spacing: 0.05em;
}

.guideline-table-style-preview-container {
  margin: 0;
}

.guideline-table-style-preview .guideline-preview-table {
  min-width: 500px;
  border-collapse: collapse;
}

.guideline-table-style-preview .guideline-preview-table th,
.guideline-table-style-preview .guideline-preview-table td {
  border-color: var(--table-preview-border);
}

.guideline-table-style-preview .guideline-preview-table thead th {
  background: var(--table-preview-header);
  color: #fff;
  font-weight: 700;
  text-align: center;
}

.guideline-table-style-preview .guideline-preview-table tbody th.guideline-preview-table-left {
  background: var(--table-preview-left);
  color: var(--table-preview-text);
  font-weight: 700;
}

.guideline-table-style-preview .guideline-preview-table tbody td {
  background: #fff;
  color: var(--table-preview-text);
}

.guideline-table-style-preview .guideline-preview-table tbody td.guideline-preview-table-stripe {
  background: var(--table-preview-stripe);
}

.guideline-table-style-preview-legend {
  display: flex;
  flex-wrap: wrap;
  gap: 8px 14px;
  margin-top: 14px;
  color: #52636c;
  font-family: ui-monospace, SFMono-Regular, Menlo, monospace;
  font-size: 0.7rem;
}

.guideline-table-style-preview-swatch {
  display: inline-flex;
  align-items: center;
  gap: 5px;
}

.guideline-table-style-preview-swatch i {
  display: inline-block;
  width: 12px;
  height: 12px;
  border: 1px solid rgb(35 25 22 / 18%);
}

.guideline-table-style-preview-swatch:nth-child(1) i { background: var(--table-preview-header); }
.guideline-table-style-preview-swatch:nth-child(2) i { background: var(--table-preview-left); }
.guideline-table-style-preview-swatch:nth-child(3) i { background: var(--table-preview-stripe); }
.guideline-table-style-preview-swatch:nth-child(4) i { background: var(--table-preview-border); }

.guideline-evidence h3 {
  margin-top: 0;
}

.guideline-evidence-list {
  display: grid;
  grid-template-columns: minmax(150px, 0.32fr) 1fr;
  margin: 0;
}

.guideline-evidence-list dt,
.guideline-evidence-list dd {
  margin: 0;
  padding: 11px 0;
  border-top: 1px solid color-mix(in srgb, var(--text-color), white 82%);
}

.guideline-evidence-list dt {
  color: var(--text-color);
  font-weight: 800;
}

.guideline-evidence-list dd {
  color: #3e4b52;
}

.media-text {
  display: grid;
  grid-template-columns: minmax(0, 1.1fr) minmax(260px, 0.9fr);
  gap: 36px;
  align-items: start;
}

.media-text.media-only {
  grid-template-columns: minmax(0, 1fr);
}

.media-assets {
  display: grid;
  gap: 16px;
}

.media-only .media-assets {
  width: 100%;
  justify-items: center;
}

.security-results,
.source-icon-card-grid {
  margin: 42px 0;
}

.security-results-columns {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 28px;
  align-items: start;
}

.security-results-column {
  display: grid;
  gap: 16px;
  min-width: 0;
}

.security-results-column > .content-heading {
  margin: 0 0 2px;
  color: var(--chapter-dark);
  font-size: 23px;
}

.security-results-column > .content-heading::after {
  display: none;
}

.security-results-column > .content-paragraph {
  margin: 0 0 8px;
}

.security-result-card {
  display: grid;
  grid-template-columns: minmax(126px, 24%) minmax(0, 1fr);
  overflow: hidden;
  min-height: 148px;
  border: 1px solid color-mix(in srgb, var(--chapter-main), white 72%);
  border-radius: 3px;
  background: var(--chapter-light);
  box-shadow: 0 3px 9px rgb(58 42 38 / 12%);
}

.security-result-title {
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  gap: 8px;
  padding: 18px 12px;
  background: var(--chapter-main);
  color: #fff;
  text-align: center;
}

.security-result-title h3 {
  margin: 0;
  color: inherit;
  font-size: 16px;
  font-weight: 500;
  line-height: 1.45;
}

.security-result-icon {
  width: 58px;
  height: 58px;
  object-fit: contain;
}

.source-card-list {
  margin: 0;
  padding: 15px 20px 15px 34px;
  font-size: 14px;
  line-height: 1.55;
}

.source-card-list li {
  margin: 2px 0;
  font-size: inherit;
  line-height: inherit;
}

.nested-source-list {
  margin: 4px 0 2px;
  padding-left: 1.2rem;
  font-size: inherit;
  line-height: inherit;
}

.source-icon-card-grid > .content-paragraph {
  margin-bottom: 28px;
}

.source-icon-card-row {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(180px, 1fr));
  gap: 16px;
  margin-top: 50px;
}

.source-card-count-1 { grid-template-columns: minmax(0, 1fr); }
.source-card-count-2 { grid-template-columns: repeat(2, minmax(0, 1fr)); }
.source-card-count-3 { grid-template-columns: repeat(3, minmax(0, 1fr)); }
.source-card-count-4 { grid-template-columns: repeat(4, minmax(0, 1fr)); }
.source-card-count-5 { grid-template-columns: repeat(5, minmax(0, 1fr)); }
.source-card-count-6 { grid-template-columns: repeat(6, minmax(0, 1fr)); }

.source-icon-card {
  min-width: 0;
  padding: 52px 18px 20px;
  border: 1px solid color-mix(in srgb, var(--chapter-main), white 78%);
  border-radius: 4px;
  background: linear-gradient(180deg, var(--chapter-light), #fff 92%);
}

.source-icon-card-image {
  position: absolute;
  top: -42px;
  left: 50%;
  width: 82px;
  height: 82px;
  transform: translateX(-50%);
  object-fit: contain;
}

.source-icon-card h3,
.source-icon-card h4 {
  margin: 0 0 8px;
  color: var(--chapter-dark);
  font-size: 16px;
  line-height: 1.45;
  text-align: center;
}

.source-icon-card .content-paragraph {
  margin: 0;
  font-size: 14px;
  line-height: 1.65;
}

.content-group.group-variant-commitment-grid {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 32px 40px;
  margin: 42px 0;
}

.content-group.group-variant-commitment-card {
  position: relative;
  min-width: 0;
}

.group-variant-commitment-card > .content-group-icon {
  display: block;
  width: 120px;
  height: 120px;
  margin: 0 auto;
  object-fit: contain;
}

.value-chain .source-icon-card-row {
  gap: 0;
  margin-top: 30px;
}

.value-chain .source-icon-card {
  padding: 126px 24px 22px;
  border-radius: 50% 50% 4px 4px;
  background: #fff;
  text-align: center;
}

.value-chain .source-icon-card-image {
  top: 10px;
  width: 108px;
  height: 108px;
}

.value-chain .source-icon-card .content-paragraph {
  text-align: left;
}

.figure-block {
  display: grid;
  width: fit-content;
  max-width: 100%;
  margin: 1rem auto;
  text-align: left;
}

.figure-block img {
  display: block;
  width: auto;
  max-width: 100%;
  max-height: 520px;
  object-fit: contain;
}

/* 不參與 figure 的寬度計算，但顯示時跟 figure 一樣寬 */
.figure-block figcaption {
  width: 0;
  min-width: 100%;
  margin-top: 8px;
  overflow-wrap: anywhere;
  font-size: 12px;
  font-weight: 300;
  color: #555;
  line-height: 130%;
}

.figure-variant-full {
  width: 100%;
}
.figure-block.figure-variant-full img {
  max-height: unset;
  width: 100%;
}

.content-group.group-variant-figure-row {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  /* gap: clamp(16px, 3vw, 40px); */
  gap: clamp(16px, 3vw, 20px);
  align-items: start;
}

.content-group.group-variant-figure-row > .figure-block {
  width: 100%;
  margin: 0;
  /* margin-block: 1rem; */
}

.content-group.group-variant-figure-row > .figure-block img {
  width: 100%;
  height: auto;
  max-height: unset;
}

.content-group.group-variant-shadow > .figure-block img {
  box-shadow: 10px 10px 20px rgba(0, 0, 0, 0.08);
}

table {
  width: 100%;
  border-collapse: collapse;
}

.idml-table {
  table-layout: fixed;
}

.idml-table th,
.idml-table td,
table p,
table li {
  font-size: calc(14px + var(--reading-font-increase));
  line-height: 1.65;
}

.idml-table th,
.idml-table td {
  /* padding: 7px 8px; */
  padding: 15px 10px;
  border: 1px solid #d9e5eb;
  background: #fff;
  color: var(--block-color, #231916);
  font-weight: 300;
  text-align: left;
  vertical-align: middle;
  overflow-wrap: anywhere;
}

.idml-table th[data-cell-role="header"] {
  text-align: center;
}

.idml-table .table-content-paragraph, .idml-table .content-list li, .idml-table td {
  margin: 0;
  color: inherit;
  /* font-size: clamp(0.875rem, 0.85rem + 0.125vw, 1rem); */
  /* font-size: 0.875rem !important; */
  font-size: 0.75rem !important;
  line-height: 150% !important;
  text-align: inherit;
}

.idml-table .table-content-paragraph + .table-content-paragraph {
  margin-top: 6px;
}

.idml-table .content-list {
  max-width: none;
  margin: 0.25rem;
  padding-left: 1.15rem;
}

.idml-table .content-list li {
  margin: 0;
  color: inherit;
  font-size: inherit;
  line-height: inherit;
  text-align: inherit;
}

.idml-table .content-list li + li {
  margin-top: 4px;
}

.table-cell-icon {
  display: block;
  width: 60px;
  height: 60px;
  margin: 0 auto 4px;
  object-fit: contain;
}

.idml-table th[data-cell-role="header"] {
  font-weight: 500;
}

.idml-table .cell-variant-ch1-2-image .table-cell-icon {
  width: 60%;
  max-width: 150px;
  height: initial
}

.idml-table .cell-variant-small-mark .content-list li::marker {
  font-size: 0.5rem;
}

.idml-table th[data-cell-role="header"] p {
  font-weight: 500 !important;
}

.idml-table th[data-cell-role="header"].cell-variant-ch1-3-header-1 {
  width: 5%;
}

.idml-table th[data-cell-role="header"].cell-variant-ch1-3-header-2 {
  width: 25%;
}

.idml-table th[data-cell-role="header"].cell-variant-ch1-3-header-3 {
  width: 25%;
}

.idml-table:has(.cell-variant-layout-auto) {
  table-layout: auto;
}

.idml-table .cell-variant-ch1-5-1-header-1 {
  width: 10%;
}

.idml-table .cell-variant-ch1-5-1-header-3 {
  width: 15%;
}

.idml-table .cell-variant-ch1-5-1-header-6-1 {
  width: 8%;
}

.idml-table .cell-variant-ch1-5-3-header-1 {
  width: 8%;
}

.idml-table .cell-variant-ch1-5-3-header-2 {
  width: 10%;
}

.idml-table .cell-variant-ch1-5-3-header-3 {
  width: 15%;
}

.idml-table .cell-variant-ch1-5-3-header-4 {
  width: 15%;
}

.idml-table .cell-variant-ch2-1-2-header-1 {
  width: 20%;
}

.idml-table .cell-variant-ch2-1-3-header-1 {
  width: 12%;
}

.idml-table .cell-variant-ch2-1-3-header-2 {
  width: 32%;
}

.idml-table .cell-variant-ch2-1-3-header-4 {
  width: 8%;
}

.idml-table .cell-variant-ch2-2-2-header-1 {
  width: 15%;
}

.idml-table .cell-variant-ch2-2-2-header-2 {
  width: 20%;
}

.idml-table .cell-variant-ch2-2-3-header-1 {
  width: 25%;
}

.idml-table .cell-variant-ch2-2-3-header-2 {
  width: 55%;
}

.idml-table .cell-variant-ch2-2-4-header-1 {
  width: 8%;
}

.idml-table .cell-variant-ch2-2-5-header-1 {
  width: 8%;
}

.idml-table .cell-variant-ch2-2-5-header-2 {
  width: 20%;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-2-5-header-1-1 {
  background: #FCF0EC !important;
}

.idml-table .cell-variant-ch2-2-5-header-1-2 {
  background: #FFFAF9 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-2-5-header-2-1 {
  background: #F4EDF6 !important;
}

.idml-table .cell-variant-ch2-2-5-header-2-2 {
  background: #F4F3FA !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-2-5-header-3-1 {
  background: #E5EEF9 !important;
}

.idml-table .cell-variant-ch2-2-5-header-3-2 {
  background: #F3F8FE !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-2-5-header-4-1 {
  background: #EBF5F1 !important;
}

.idml-table .cell-variant-ch2-2-5-header-4-2 {
  background: #F5FAF6 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-2-6-header-1 {
  background: #DA464E !important;
  width: 20%;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-2-6-header-1 .table-content-paragraph {
  color: #ffffff !important;
}

.idml-table .cell-variant-ch2-2-6-header-2 {
  background: #FEF4F1 !important;
}

.idml-table .cell-variant-ch2-3-5-header-1 {
  width: 25%;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-4-6-header-1-1 {
  background: #F0F7F1 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-4-6-header-1-1 .text-variant-ch2-4-6-icon {
  color: #11745F !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-4-6-header-2-1 {
  background: #FFFAF1 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-4-6-header-2-1 .text-variant-ch2-4-6-icon {
  color: #964F00 !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-4-6-header-3-1 {
  background: #FCF0EC !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-4-6-header-3-1 .text-variant-ch2-4-6-icon {
  color: #BC1124 !important;
  font-size: 2rem !important;
  font-weight: 700 !important;
}

.idml-table .cell-variant-ch2-4-13-header-1, .idml-table .cell-variant-ch2-4-14-header-1 {
  width: 35%;
}

.idml-table .cell-variant-ch3-1-1-header-1, .idml-table .cell-variant-ch3-1-1-header-2, .idml-table .cell-variant-ch3-1-1-header-3, .idml-table .cell-variant-ch3-1-1-header-5, .idml-table .cell-variant-ch3-1-1-header-6, .idml-table .cell-variant-ch3-1-1-header-7, .idml-table .cell-variant-ch3-1-1-header-8, .idml-table .cell-variant-ch3-1-1-header-9, .idml-table .cell-variant-ch3-1-1-header-10 {
  width: 7%;
}

.idml-table .cell-variant-ch3-1-1-header-4 {
  width: 14%;
}

.idml-table .cell-variant-ch3-1-3-header-1 {
  width: 30%;
}

.idml-table .cell-variant-ch3-3-1-header-1 {
  width: 25%;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch3-3-1-header-1-1 {
  width: 6%;
  border-right: 1px solid var(--chapter-table-border);
}

.idml-table .cell-variant-ch3-3-2-header-1 {
  width: 25%;
}

.idml-table .cell-variant-ch4-1-16-header-1 {
  width: 25%;
}

.idml-table .cell-variant-ch4-1-19-header-1 {
  width: 25%;
}

.idml-table .cell-variant-ch4-1-last-header-1 {
  width: 15%;
}

.idml-table .cell-variant-ch4-2-1-header-1, .idml-table .cell-variant-ch4-2-2-header-1 {
  width: 25%;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch4-2-3-header-row {
  font-size: 1.2rem !important;
  color: var(--chapter-dark) !important;
  font-weight: 500 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch4-2-4-header-1 {
  font-weight: 500 !important;
  background: #FFF4E1 !important;
  width: 25%;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch4-2-8-header-1 {
  font-weight: 500 !important;
  background: var(--chapter-main) !important;
  color: #ffffff !important;
  width: 25%;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch4-2-11-header-1-1, .idml-table tbody td[data-cell-role="left-column"].cell-variant-ch4-2-12-header-1-1, .idml-table tbody td[data-cell-role="left-column"].cell-variant-ch4-2-13-header-1-1 {
  width: 5%;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch4-2-11-header-1-2, .idml-table tbody td[data-cell-role="left-column"].cell-variant-ch4-2-12-header-1-2, .idml-table tbody td[data-cell-role="left-column"].cell-variant-ch4-2-13-header-1-2 {
  width: 14%;
}

.idml-table .cell-variant-ch4-2-11-header-2-1, .idml-table .cell-variant-ch4-2-12-header-2-1, .idml-table .cell-variant-ch4-2-13-header-2-1 {
  width: 10%;
}

.idml-table .cell-variant-ch5-header-1 {
  width: 20%;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch5-data-1, .idml-table tbody td[data-cell-role="left-column"].cell-variant-ch5-data-1-2 {
  border-bottom: 1px solid #DFD5E9 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch5-data-1-1 {
  /* border-right: 1px solid var(--chapter-table-border) !important; */
  border-right: 1px solid #DFD5E9 !important;
  border-bottom: 1px solid #DFD5E9 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch6-1-1-header-1 {
  width: 30%;
}

.idml-table .cell-variant-ch6-2-1-header-1, .idml-table .cell-variant-ch6-2-1-header-5, .idml-table .cell-variant-ch6-2-1-header-7, .idml-table .cell-variant-ch6-2-1-header-8 {
  width: 6%;
}

.idml-table .cell-variant-ch6-3-1-header-1 {
  width: 15%;
}

.idml-table .cell-variant-ch6-3-1-header-3 {
  width: 25%;
}

.idml-table .cell-variant-ch6-4-1-header-1 {
  width: 5%;
}

.idml-table .cell-variant-ch6-4-1-header-2 {
  width: 50%;
}

.idml-table .cell-variant-ch6-4-1-header-3 {
  width: 8%;
}

.idml-table .cell-variant-ch6-4-1-header-4 {
  width: 15%;
}

.idml-table .cell-variant-ch6-4-1-header-5 {
  width: 15%;
}

.content-group.group-variant-ch2-5-info-summary {
  width: fit-content;
  padding: 20px;
  border-radius: 10px;
  background: linear-gradient(90deg, #FDEEED 0%, #FEF7F6 20%, #FFF 50%, #FEF7F6 70%, #FDEEED 100%);
}

.content-group.group-variant-ch2-5-info-summary .content-paragraph {
  margin: 0;
}

.text-variant-ch2-4-6-check,
.text-variant-ch2-4-6-label {
  display: block;
}

.idml-table .cell-variant-ch2-2-5-header-1-1 .table-content-paragraph, .idml-table .cell-variant-ch2-2-5-header-2-1 .table-content-paragraph, .idml-table .cell-variant-ch2-2-5-header-3-1 .table-content-paragraph, .idml-table .cell-variant-ch2-2-5-header-4-1 .table-content-paragraph, .idml-table .cell-variant-ch2-2-5-header-1-2 .table-content-paragraph, .idml-table .cell-variant-ch2-2-5-header-2-2 .table-content-paragraph, .idml-table .cell-variant-ch2-2-5-header-3-2 .table-content-paragraph, .idml-table .cell-variant-ch2-2-5-header-4-2 .table-content-paragraph {
  font-weight: 500 !important;
}

.idml-table .cell-variant-ch2-2-4-content .table-content-paragraph {
  color: var(--chapter-dark) !important;
  font-weight: 500 !important;
  font-size: 1.2rem !important;
}

.idml-table .cell-variant-ch2-1-1-content .table-content-paragraph {
  font-size: 1.2rem;
  color: var(--chapter-main) !important;
  font-weight: 700;
}
.idml-table .cell-variant-esg-e .table-content-paragraph {
  color: #11745F !important;
  font-weight: 700 !important;
  font-size: 1.2rem !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-esg-e-header {
  background: #E2F2EB !important;
}

.idml-table .cell-variant-esg-e-header .table-content-paragraph {
  font-size: 2.5rem !important;
  font-weight: 500 !important;
}

.idml-table .cell-variant-esg-s .table-content-paragraph {
  color: #BC1124 !important;
  font-weight: 700 !important;
  font-size: 1.2rem !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-esg-s-header {
  background: #FEF4F1 !important;
}

.idml-table .cell-variant-esg-s-header .table-content-paragraph {
  font-size: 2.5rem !important;
  font-weight: 500 !important;
}

.idml-table .cell-variant-esg-g .table-content-paragraph {
  color: #2E6AA3 !important;
  font-weight: 700 !important;
  font-size: 1.2rem !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-esg-g-header {
  background: #E5F0FA !important;
}

.idml-table .cell-variant-esg-g-header .table-content-paragraph {
  font-size: 2.5rem !important;
  font-weight: 500 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-1-4-header-1-1 {
  background: #EBF4FC !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-1-4-header-1-2 {
  background: #FCF0EC !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch2-1-4-header-1-3 {
  background: #F0F7F1 !important;
}

.cell-variant-ch1-3-image .table-cell-content {
  display: flex;
  align-items: center;
  gap: 15px;
}

.cell-variant-ch1-3-image .table-cell-content img {
  flex-shrink: 0;
  margin: 0;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch1-3-1, .idml-table tfoot td[data-cell-role="left-column"].cell-variant-ch1-3-1 {
  background-color: #E4837B !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch1-3-1 p, .idml-table tfoot td[data-cell-role="left-column"].cell-variant-ch1-3-1 p {
  color: #fff !important;
  font-weight: 500 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch1-3-2, .idml-table tfoot td[data-cell-role="left-column"].cell-variant-ch1-3-2 {
  background-color: #78ACD8 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch1-3-2 p, .idml-table tfoot td[data-cell-role="left-column"].cell-variant-ch1-3-2 p {
  color: #fff !important;
  font-weight: 700 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch1-3-3, .idml-table tfoot td[data-cell-role="left-column"].cell-variant-ch1-3-3 {
  background-color: #7CBAA6 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch1-3-3 p, .idml-table tfoot td[data-cell-role="left-column"].cell-variant-ch1-3-3 p {
  color: #fff !important;
  font-weight: 700 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch1-3-4, .idml-table tfoot td[data-cell-role="left-column"].cell-variant-ch1-3-4 {
  background-color: #BFABD2 !important;
}

.idml-table tbody td[data-cell-role="left-column"].cell-variant-ch1-3-4 p, .idml-table tfoot td[data-cell-role="left-column"].cell-variant-ch1-3-4 p {
  color: #fff !important;
  font-weight: 700 !important;
}

.toc > .container {
  width: 100%;
  max-width: none;
}

.toc-spread {
  min-height: calc(100vh - var(--menu-height));
  margin: 0;
  padding: 58px 0 72px;
  background-image: url("../assets/toc-background.png?v=21082c2c1d6b");
  background-position: center bottom;
  background-repeat: no-repeat;
  background-size: cover;
}

.toc-columns {
  display: grid;
  grid-template-columns: repeat(3, minmax(0, 1fr));
  gap: 72px;
  align-items: start;
  width: min(100% - 56px, 1320px);
  margin-inline: auto;
}

.toc-column {
  min-width: 0;
}

.toc-title {
  margin: 0 0 116px;
  color: #111;
  font-size: 64px;
  font-weight: 400;
  line-height: 1;
}

.toc-group {
  margin: 0 0 66px;
  color: var(--group-color, #39444c);
}

.toc-preface,
.toc-group-1 { --group-color: #2E6AA3; }
.toc-group-2 { --group-color: #BC1124; }
.toc-group-3 { --group-color: #12735F; }
.toc-group-4 { --group-color: #945024; }
.toc-group-5 { --group-color: #6A56A2; }
.toc-group-6 { --group-color: #39424A; }

.toc-preface {
  margin-bottom: 70px;
}

.toc-group-heading {
  display: flex;
  align-items: flex-end;
  gap: 16px;
  width: fit-content;
  color: inherit;
  text-decoration: none;
}

.toc-group-1 .toc-group-heading:hover {
  color: #178DC8;
}

.toc-group-2 .toc-group-heading:hover {
  color: #D9464E;
}

.toc-group-3 .toc-group-heading:hover {
  color: #2B9D83;
}

.toc-group-4 .toc-group-heading:hover {
  color: #BF781A;
}

.toc-group-5 .toc-group-heading:hover {
  color: #A587BD;
}

.toc-group-6 .toc-group-heading:hover {
  color: #475D76;
}

.toc-group-number {
  flex: 0 0 auto;
  font-size: 58px;
  font-weight: 900;
  line-height: 0.95;
}

.toc-group-title {
  font-size: 29px;
  font-weight: 500;
  line-height: 1.2;
  letter-spacing: 15%;
}

.toc-group-rule {
  height: 1px;
  margin: 15px 0 10px;
  border-top: 1px dashed color-mix(in srgb, var(--group-color), white 35%);
}

.toc-group-rule::after {
  position: absolute;
  top: -4px;
  right: 0;
  width: 7px;
  height: 7px;
  border-radius: 50%;
  background: var(--group-color);
  content: "";
}

.toc-row {
  display: grid;
  grid-template-columns: 52px minmax(0, 1fr);
  gap: 10px;
  padding: 8px 0;
  color: #231916;
  font-size: 16px;
  line-height: 1.5;
  text-decoration: none;
}

a.toc-row:hover {
  color: var(--group-color);
}

.toc-row.disabled {
  cursor: default;
}

.toc-item-number {
  white-space: nowrap;
}

.footer-actions {
  display: flex;
  justify-content: center;
  gap: 14px;
  margin: 72px 0 48px;
}

.btn {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 20px;
  border: 1px solid var(--text-color);
  border-radius: 20px;
  background: #fff;
  color: var(--text-color);
  font-size: 1rem;
  letter-spacing: 2px;
  text-align: center;
}

.btn:hover {
  background: var(--text-color);
  color: #fff;
}

@media (max-width: 1399px) {
  #addMenu {
    /* display: block; */
    width: calc(100% - 300px);
  }

  .navbar-toggler {
    display: block;
    flex: 0 0 auto;
  }

  .navbar-collapse {
    display: block;
    position: absolute;
    top: var(--menu-height);
    left: 0;
    width: 100vw;
    max-height: 0;
    overflow: hidden;
    visibility: hidden;
    pointer-events: none;
    background: #fff;
    box-shadow: none;
    transition:
      max-height 0.8s cubic-bezier(0.22, 1, 0.36, 1),
      visibility 0s linear 0.8s,
      box-shadow 0.2s ease;
  }

  .navbar-collapse.show {
    max-height: calc(100vh - var(--menu-height));
    max-height: calc(100dvh - var(--menu-height));
    overflow-y: auto;
    visibility: visible;
    pointer-events: auto;
    box-shadow: 0 6px 4px rgba(0, 0, 0, 0.2);
    transition-delay: 0s;
  }

  .navbar-nav {
    flex-direction: column;
    align-items: center;
    padding: 32px;
  }

  .nav-link {
    min-height: 44px;
    margin: 4px 20px;
    padding: 0 18px;
    font-size: 16px;
    text-align: center;
  }

  .nav-item.has-dropdown {
    flex-direction: column;
    align-items: center;
  }

  .nav-dropdown {
    display: block;
    position: static;
    width: 100%;
    min-width: 0;
    max-height: 0;
    padding-block: 0;
    overflow: hidden;
    visibility: hidden;
    transform: none;
    box-shadow: none;
    transition:
      max-height 0.3s cubic-bezier(0.22, 1, 0.36, 1),
      padding 0.3s cubic-bezier(0.22, 1, 0.36, 1),
      visibility 0s linear 0.3s;
  }

  .nav-item.has-dropdown.is-open .nav-dropdown {
    max-height: 240px;
    padding-block: 8px;
    visibility: visible;
    transition-delay: 0s;
  }
}

@media (max-width: 1399px) and (prefers-reduced-motion: reduce) {
  .navbar-collapse,
  .nav-dropdown {
    transition: none;
  }
}

@media (max-width: 920px) {
  :root {
    --menu-height: 52px;
  }

  .navbar {
    padding: 4px 8px;
  }

  .navbar-inner {
    min-height: 44px;
  }

  .navbar-brand .home {
    height: 36px;
  }

  #addMenu {
    width: calc(100% - 240px);
  }

  .source-icon-card-row {
    grid-template-columns: repeat(2, minmax(0, 1fr));
  }

  .toc > .container {
    width: 100%;
  }

  .toc-spread {
    padding-top: 42px;
    background-position: right bottom;
    background-size: auto 720px;
  }

  .toc-columns {
    grid-template-columns: 1fr;
    gap: 0;
    width: min(100% - 36px, 720px);
  }

  .toc-title {
    margin-bottom: 58px;
    font-size: 52px;
  }

  .toc-group,
  .toc-preface {
    margin-bottom: 52px;
  }
}

@media (max-width: 767px) {
  #addMenu {
    width: auto;
    max-width: calc(100% - 212px);
    text-align: center;
  }

  .container {
    width: min(100% - 28px, var(--page-max));
  }

  .page-hero {
    padding: 46px 0 30px;
  }

  .page-banner-image {
    object-position: center;
  }

  .page-banner-name {
    right: 10%;
  }

  .page-banner-title::after {
    margin-top: 10px;
    width: 30px;
    height: 3px;
  }

  .tabs-group {
    /* top: calc(var(--menu-height) + 4px); */
    top: var(--menu-height);
  }

  section {
    margin: 46px 0;
  }

  .content-grid,
  .stats,
  .image-gallery,
  .media-text,
  .security-results-columns,
  .source-icon-card-row,
  .content-group.group-variant-commitment-grid,
  .content-group.group-variant-figure-row,
  .guideline-swatch-grid {
    grid-template-columns: 1fr;
  }

  .guideline-chapter-scale {
    padding: 18px 16px 1px;
  }

  .guideline-font-preview {
    padding: 18px 16px;
  }

  .guideline-font-preview-grid {
    grid-template-columns: 1fr;
  }

  .guideline-table-style-preview {
    padding: 18px 16px;
  }

  .guideline-table-style-preview-grid {
    grid-template-columns: 1fr;
  }

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

  .guideline-evidence-list dd {
    padding-top: 0;
  }

  .security-result-card {
    grid-template-columns: 112px minmax(0, 1fr);
  }

  .security-result-title {
    padding-inline: 8px;
  }

  .source-card-list {
    padding: 14px 16px 14px 30px;
  }

  .source-icon-card-row {
    gap: 14px;
  }

  .value-chain .source-icon-card-row {
    gap: 48px;
  }

  /* .table-container table {
    min-width: var(--table-min-width, max-content);
  } */

  .idml-table .cell-variant-ch1-2-image {
    width: 30%;
  }

  .idml-table .cell-variant-ch1-2-image .table-cell-icon {
    width: 100%;
  }

  .table-scrollbar-note {
    display: block;
  }

  .footer-actions {
    flex-direction: column;
    margin: 72px 20px 48px;
  }

  .idml-table th,
  .idml-table td {
    padding: 10px;
  }
}

/* Guideline runtime: one shared typography system with chapter-level color contracts. */
:root {
  --guideline-h1-font-family: 'Noto Sans TC', sans-serif;
  --guideline-h1-font-weight: 300;
  --guideline-h1-font-size: clamp(1.5rem, 1rem + 2.5vw, 4rem);
  --guideline-h1-line-height: normal;
  --guideline-h1-letter-spacing: 20%;
  --guideline-h2-font-family: 'Noto Sans TC', sans-serif;
  --guideline-h2-font-weight: 400;
  --guideline-h2-font-size: clamp(1.375rem, 1.3rem + 0.375vw, 1.75rem);
  --guideline-h2-line-height: 114.286%;
  --guideline-h2-letter-spacing: 10%;
  --guideline-h3-font-family: 'Noto Sans TC', sans-serif;
  --guideline-h3-font-weight: 400;
  --guideline-h3-font-size: clamp(1.25rem, 1.2rem + 0.25vw, 1.5rem);
  --guideline-h3-line-height: 125%;
  --guideline-h3-letter-spacing: 10%;
  --guideline-h4-font-family: 'Noto Sans TC', sans-serif;
  --guideline-h4-font-weight: 400;
  --guideline-h4-font-size: clamp(1.125rem, 1.1rem + 0.125vw, 1.25rem);
  --guideline-h4-line-height: 130%;
  --guideline-h4-letter-spacing: 10%;
  --guideline-h5-font-family: 'Noto Sans TC', sans-serif;
  --guideline-h5-font-weight: 400;
  --guideline-h5-font-size: 1.125rem;
  --guideline-h5-line-height: 150%;
  --guideline-h5-letter-spacing: 10%;
  --guideline-h6-font-family: 'Noto Sans TC', sans-serif;
  --guideline-h6-font-weight: 400;
  --guideline-h6-font-size: 1rem;
  --guideline-h6-line-height: normal;
  --guideline-h6-letter-spacing: 10%;
  --guideline-body-font-family: 'Noto Sans TC', sans-serif;
  --guideline-body-font-weight: 300;
  --guideline-body-font-size: 1rem;
  --guideline-body-line-height: 140%;
  --guideline-body-letter-spacing: 5%;
  --guideline-body-english-font-family: 'Roboto' 'Noto Sans TC', sans-serif;
  --guideline-body-english-font-weight: 400;
  --guideline-list-line-height: 140%;
  --guideline-table-header-font-family: 'Noto Sans TC', sans-serif;
  --guideline-table-header-font-weight: 500;
  --guideline-table-header-font-size: 16px;
  --guideline-table-header-line-height: normal;
  --guideline-table-header-letter-spacing: 5%;
  --guideline-table-body-font-family: 'Noto Sans TC', sans-serif;
  --guideline-table-body-font-weight: 300;
  --guideline-table-body-font-size: 16px;
  --guideline-table-body-line-height: normal;
  --guideline-table-body-letter-spacing: 5%;
  --guideline-deep-blue: #003055;

  --guideline-ch0-deep: #255588;
  --guideline-ch0-main: #4D7DB3;
  --guideline-ch0-mid: #C2D1E3;
  --guideline-ch0-light: #C2D1E3;
  --guideline-ch0-soft: #C2D1E3;
  --guideline-ch1-deep: #39648E;
  --guideline-ch1-main: #2C85B2;
  --guideline-ch1-mid: #8FB6D7;
  --guideline-ch1-light: #D9EAF2;
  --guideline-ch1-soft: #D9EAF2;
  --guideline-ch2-deep: #A32631;
  --guideline-ch2-main: #C84954;
  --guideline-ch2-mid: #EB9B93;
  --guideline-ch2-light: #FCEDE7;
  --guideline-ch2-soft: #FCEDE7;
  --guideline-ch3-deep: #1A6653;
  --guideline-ch3-main: #319479;
  --guideline-ch3-mid: #59A97A;
  --guideline-ch3-light: #C8E5D5;
  --guideline-ch3-soft: #E1F1E2;
  --guideline-ch4-deep: #7C4421;
  --guideline-ch4-main: #A76622;
  --guideline-ch4-mid: #F3B665;
  --guideline-ch4-light: #F7CB8A;
  --guideline-ch4-soft: #FBE2B5;
  --guideline-ch5-deep: #625997;
  --guideline-ch5-main: #937DAD;
  --guideline-ch5-mid: #CAB0CA;
  --guideline-ch5-light: #DCDCE7;
  --guideline-ch5-soft: #DCDCE7;
  --guideline-ch6-deep: #363E43;
  --guideline-ch6-main: #667277;
  --guideline-ch6-mid: #445464;
  --guideline-ch6-light: #DCDCE7;
  --guideline-ch6-soft: #DCDCE7;

  --guideline-ch0-table-header: #055397;
  --guideline-ch0-table-left: #EBF4FC;
  --guideline-ch0-table-stripe: #F9FBFE
  --guideline-ch0-table-border: #B1BAD8;
  --guideline-ch1-table-header: #178DC8;
  --guideline-ch1-table-left: #EBF4FC;
  --guideline-ch1-table-stripe: color-mix(in srgb, #D9EAF2 30%, white);
  --guideline-ch1-table-border: #82A5CA;
  --guideline-ch2-table-header: #D9464E;
  --guideline-ch2-table-left: #FCF0EC;
  --guideline-ch2-table-stripe: color-mix(in srgb, #FCEDE7 30%, white);
  --guideline-ch2-table-border: #F6CFC9;
  --guideline-ch3-table-header: #61B27B;
  --guideline-ch3-table-left: #F0F7F1;
  --guideline-ch3-table-stripe: color-mix(in srgb, #E1F1E2 30%, white);
  --guideline-ch3-table-border: #C1DDD2;
  --guideline-ch4-table-header: #C07700;
  --guideline-ch4-table-left: #FFFAF1;
  --guideline-ch4-table-stripe: color-mix(in srgb, #FBE2B5 15%, white);
  --guideline-ch4-table-border: #FEF2DB;
  --guideline-ch5-table-header: #A688BE;
  --guideline-ch5-table-left: #F2EEF7;
  --guideline-ch5-table-stripe: color-mix(in srgb, #DCDCE7 30%, white);
  --guideline-ch5-table-border: #F3EAF4;
  --guideline-ch6-table-header: #485E77;
  --guideline-ch6-table-left: #EDEDF1;
  --guideline-ch6-table-stripe: #F9F9FC;
  --guideline-ch6-table-border: #DADADC;

  --idml-ch0-deep: var(--guideline-ch0-deep);
  --idml-ch0-main: var(--guideline-ch0-main);
  --idml-ch0-light: var(--guideline-ch0-light);
}

html[lang="en"]:root {
  --guideline-body-letter-spacing: 0;
  --guideline-h1-letter-spacing: 0;
  --guideline-h2-letter-spacing: 0;
  --guideline-h3-letter-spacing: 0;
  --guideline-h4-letter-spacing: 0;
  --guideline-h5-letter-spacing: 0;
  --guideline-h6-letter-spacing: 0;
}

html,
body {
  font-family: var(--guideline-body-font-family);
  color: #231916;
}

h1,
.page-title {
  font-family: var(--guideline-h1-font-family);
  font-weight: var(--guideline-h1-font-weight);
  font-size: var(--guideline-h1-font-size);
  line-height: var(--guideline-h1-line-height);
  letter-spacing: var(--guideline-h1-letter-spacing);
}

h2,
.title {
  font-family: var(--guideline-h2-font-family);
  font-weight: var(--guideline-h2-font-weight);
  font-size: var(--guideline-h2-font-size);
  line-height: var(--guideline-h2-line-height);
  letter-spacing: var(--guideline-h2-letter-spacing);
}

h3,
.subtitle {
  font-family: var(--guideline-h3-font-family);
  font-weight: var(--guideline-h3-font-weight);
  font-size: var(--guideline-h3-font-size);
  line-height: var(--guideline-h3-line-height);
  letter-spacing: var(--guideline-h3-letter-spacing);
}

h4 {
  font-family: var(--guideline-h4-font-family);
  font-weight: var(--guideline-h4-font-weight);
  font-size: var(--guideline-h4-font-size);
  line-height: var(--guideline-h4-line-height);
  letter-spacing: var(--guideline-h4-letter-spacing);
}

h5 {
  font-family: var(--guideline-h5-font-family);
  font-weight: var(--guideline-h5-font-weight);
  font-size: var(--guideline-h5-font-size);
  line-height: var(--guideline-h5-line-height);
  letter-spacing: var(--guideline-h5-letter-spacing);
}

h6 {
  font-family: var(--guideline-h6-font-family);
  font-weight: var(--guideline-h6-font-weight);
  font-size: var(--guideline-h6-font-size);
  line-height: var(--guideline-h6-line-height);
  letter-spacing: var(--guideline-h6-letter-spacing);
}

.content-heading.guideline-heading-level-1 { color: var(--chapter-dark); }
.content-heading.guideline-heading-level-2 { color: var(--chapter-dark); }
.content-heading.guideline-heading-level-3 { color: var(--chapter-main); }
.content-heading.guideline-heading-level-4 { color: var(--chapter-dark); }
.content-heading.guideline-heading-level-5 { color: var(--chapter-main); }
.content-heading.guideline-heading-level-6 { color: var(--chapter-main); }

.content-heading.guideline-heading-level-1 {
  font-family: var(--guideline-h1-font-family);
  font-weight: var(--guideline-h1-font-weight);
  font-size: var(--guideline-h1-font-size);
  line-height: var(--guideline-h1-line-height);
  letter-spacing: var(--guideline-h1-letter-spacing);
}
.content-heading.guideline-heading-level-2 {
  font-family: var(--guideline-h2-font-family);
  font-weight: var(--guideline-h2-font-weight);
  font-size: var(--guideline-h2-font-size);
  line-height: var(--guideline-h2-line-height);
  letter-spacing: var(--guideline-h2-letter-spacing);
}
.content-heading.guideline-heading-level-3 {
  font-family: var(--guideline-h3-font-family);
  font-weight: var(--guideline-h3-font-weight);
  font-size: var(--guideline-h3-font-size);
  line-height: var(--guideline-h3-line-height);
  letter-spacing: var(--guideline-h3-letter-spacing);
}
.content-heading.guideline-heading-level-4 {
  font-family: var(--guideline-h4-font-family);
  font-weight: var(--guideline-h4-font-weight);
  font-size: var(--guideline-h4-font-size);
  line-height: var(--guideline-h4-line-height);
  letter-spacing: var(--guideline-h4-letter-spacing);
}
.content-heading.guideline-heading-level-5 {
  font-family: var(--guideline-h5-font-family);
  font-weight: var(--guideline-h5-font-weight);
  font-size: var(--guideline-h5-font-size);
  line-height: var(--guideline-h5-line-height);
  letter-spacing: var(--guideline-h5-letter-spacing);
}
.content-heading.guideline-heading-level-6 {
  font-family: var(--guideline-h6-font-family);
  font-weight: var(--guideline-h6-font-weight);
  font-size: var(--guideline-h6-font-size);
  line-height: var(--guideline-h6-line-height);
  letter-spacing: var(--guideline-h6-letter-spacing);
}

.content-heading.heading-variant-center {
  text-align: center;
}

.content-heading.heading-variant-point {
  width: fit-content;
  padding: 4px 20px;
  border-radius: 100px;
  color: #ffffff;
  font-size: 1rem;
  line-height: 140%;
  letter-spacing: 5%;
  font-weight: 500;
  margin: 0;
  position: absolute;
  top: -15px;
  left: 0;
  z-index: 2;
}

.content-heading.heading-variant-point.heading-variant-first-point {
  background: linear-gradient(
    90deg,
    var(--chapter-main) 0%,
    color-mix(in srgb, var(--chapter-main) 60%, transparent) 100%
  );
}

.content-heading.heading-variant-point.heading-variant-full-point {
  background: var(--chapter-main);
}

.content-heading.heading-variant-step-point, .content-heading.heading-variant-ch1-point {
  width: fit-content;
  padding: 4px 20px;
  border-radius: 100px;
  color: #ffffff;
  font-size: 1rem;
  line-height: 140%;
  letter-spacing: 5%;
  font-weight: 500;
  margin: 0;
  background: linear-gradient(
    90deg,
    var(--chapter-main) 0%,
    color-mix(in srgb, var(--chapter-main) 60%, transparent) 100%
  );
}

.content-heading.heading-variant-ch1-point {
  width: 100%;
  text-align: center;
}

.content-heading.heading-variant-point.heading-variant-second-point {
  background: linear-gradient(90deg, #B31D2C 0%, rgba(179, 29, 44, 0.60) 100%);
}

.content-group.group-variant-point {
  --group-point-color: #055397;
  --group-point-notch-width: 110px;
  --group-point-notch-height: 20px;
  position: relative;
  padding: 30px;
  border-radius: 20px;
  margin-top: 2rem;
}

.content-group.group-variant-full-point {
  --group-point-color: transparent;
  background: var(--chapter-soft);
}

.content-group.group-variant-full-point .content-paragraph {
  margin: 0;
}

.content-group.group-variant-point::before {
  content: "";
  position: absolute;
  inset: 0;
  box-sizing: border-box;
  border: 1px solid var(--group-point-color);
  border-radius: inherit;
  clip-path: polygon(
    var(--group-point-notch-width) 0,
    100% 0,
    100% 100%,
    0 100%,
    0 var(--group-point-notch-height)
  );
  pointer-events: none;
}

.content-group.group-variant-point.group-variant-first-point {
  --group-point-color: var(--chapter-main);
}

.content-group.group-variant-point.group-variant-second-point {
  --group-point-color: #B31D2C;
}

.content-paragraph,
.content-list,
.content-list li {
  font-family: var(--guideline-body-font-family);
  font-weight: var(--guideline-body-font-weight);
  font-size: var(--guideline-body-font-size);
  line-height: var(--guideline-body-line-height);
  letter-spacing: var(--guideline-body-letter-spacing);
  color: #231916;
}

.content-list,
.content-list li {
  line-height: var(--guideline-list-line-height);
}

.content-list.list-variant-bold li::marker {
  font-weight: 500;
}

ul.content-list li::marker {
  color: var(--chapter-main);
}

.content-list .list-item-label {
  color: var(--chapter-dark);
  font-weight: 500;
}

.content-list .list-item-label.label-variant-black {
  color: #231916;
}

.content-list .list-item-label.label-variant-dark {
  color: var(--chapter-dark);
}

.content-list .list-item-label.label-variant-bold {
  font-weight: 700;
}

.content-list .list-item-label.label-variant-underline {
  text-decoration: underline;
  text-underline-offset: 0.15em;
}

.content-list .list-item-label.label-variant-regular {
  font-weight: 300;
}

.content-list.list-marker-cjk-ideographic {
  list-style-type: cjk-ideographic;
}

.content-list.nested-content-list {
  list-style: disc;
}

.content-list.list-variant-first-point li::marker {
  color: var(--chapter-main);
}

.content-list.list-variant-second-point li::marker {
  color: #B31E2C;
}

.content-list.list-variant-lower-alpha {
  list-style-type: lower-alpha;
}

.content-list.list-variant-lower-alpha > li > .nested-content-list {
  list-style: none;
  padding-left: 1.2rem;
}

.content-list.list-variant-lower-alpha > li > .nested-content-list > li {
  position: relative;
}

.content-list.list-variant-lower-alpha > li > .nested-content-list > li::before {
  position: absolute;
  left: -1rem;
  content: "-";
}

.content-list.list-variant-lower-alpha > li::marker {
  font-weight: 500;
}

.content-list.list-variant-hyphen {
  list-style: none;
  padding-left: 1.2rem;
}

.content-list.list-variant-hyphen > li {
  position: relative;
}

.content-list.list-variant-hyphen > li::before {
  position: absolute;
  left: -1rem;
  content: "-";
}

.content-text.text-variant-ch2-3-review-label {
  font-weight: 500;
  color: var(--chapter-dark);
}

.content-text.text-variant-bold {
  font-weight: 500;
}

.guideline-body-english {
  font-family: var(--guideline-body-english-font-family);
  font-weight: var(--guideline-body-english-font-weight);
}

.idml-table th,
.idml-table th p,
.idml-table th li,
.idml-table .table-cell-header {
  font-family: var(--guideline-body-font-family);
  font-weight: var(--guideline-body-font-weight);
  font-size: var(--guideline-body-font-size);
  line-height: var(--guideline-body-line-height);
  letter-spacing: var(--guideline-body-letter-spacing);
  background: var(--chapter-table-header) !important;
  border-color: var(--chapter-table-border) !important;
  color: #fff !important;
}

.idml-table td,
.idml-table td p,
.idml-table td li,
.idml-table .table-cell-left-column,
.idml-table .table-cell-left-column p {
  font-family: var(--guideline-body-font-family);
  font-weight: var(--guideline-body-font-weight);
  font-size: var(--guideline-body-font-size);
  line-height: var(--guideline-body-line-height);
  letter-spacing: var(--guideline-body-letter-spacing);
  border-color: var(--chapter-table-border) !important;
  color: #231916 !important;
}

.idml-table tbody tr.table-row-stripe td[data-cell-role="body"],
.idml-table tfoot tr.table-row-stripe td[data-cell-role="body"] {
  background: var(--chapter-table-stripe) !important;
}

.idml-table tbody td[data-cell-role="left-column"],
.idml-table tfoot td[data-cell-role="left-column"] {
  background: var(--chapter-table-left) !important;
}

.idml-table th[data-cell-role="header"] {
  background: var(--chapter-table-header) !important;
}

.idml-table td {
  text-align: center;
  border-left: #fff;
  border-right: #fff;
}

.idml-table .cell-variant-start {
  text-align: start;
}


.idml-table th.cell-variant-diagonal-header {
  position: relative;
  height: 88px;
  padding: 0;
  overflow: hidden;
  background:
    linear-gradient(
      to top right,
      transparent calc(50% - 0.5px),
      #fff calc(50% - 0.5px),
      #fff calc(50% + 0.5px),
      transparent calc(50% + 0.5px)
    ),
    var(--chapter-table-header) !important;
}

.table-diagonal-header {
  position: absolute;
  inset: 0;
}

.table-diagonal-header-year,
.table-diagonal-header-item {
  position: absolute;
  line-height: 1;
  white-space: nowrap;
}

.table-diagonal-header-year {
  top: 12px;
  right: 12px;
}

.table-diagonal-header-item {
  bottom: 12px;
  left: 12px;
}



/* The preview page demonstrates each chapter independently; keep its swatch-specific table colors. */
.guideline-preview .guideline-preview-table thead th {
  background: var(--table-preview-header) !important;
  border-color: var(--table-preview-border) !important;
}

.guideline-preview .guideline-preview-table tbody th.guideline-preview-table-left {
  background: var(--table-preview-left) !important;
  border-color: var(--table-preview-border) !important;
  color: var(--table-preview-text) !important;
}

.guideline-preview .guideline-preview-table tbody td.guideline-preview-table-stripe {
  background: var(--table-preview-stripe) !important;
  border-color: var(--table-preview-border) !important;
  color: var(--table-preview-text) !important;
}

.guideline-preview .guideline-typography-table .idml-table th {
  background: var(--guideline-deep-blue) !important;
}

.idml-table tbody tr:nth-child(odd) td:not(.table-cell-left-column) {
  background: var(--chapter-table-bg);
}

.idml-table th.has-cell-bg[data-cell-role],
.idml-table td.has-cell-bg[data-cell-role] {
  background: var(--cell-bg) !important;
}

.idml-table .has-cell-border-top[data-cell-role] {
  border-top: var(--cell-border-top) !important;
}

.idml-table .has-cell-border-right[data-cell-role] {
  border-right: var(--cell-border-right) !important;
}

.idml-table .has-cell-border-bottom[data-cell-role] {
  border-bottom: var(--cell-border-bottom) !important;
}

.idml-table .has-cell-border-left[data-cell-role] {
  border-left: var(--cell-border-left) !important;
}

/* English */

html[lang="en"] .navbar-nav .nav-item .nav-link {
  width: 111px;
  word-break: keep-all;
  text-align: center;
}

html[lang="en"] .page-banner-title {
  max-width: 500px;
  text-align: end;
}

html[lang="en"] .idml-table th, .idml-table th p, .idml-table th li, .idml-table .table-cell-header {
  font-size: 0.75rem;
}

html[lang="en"] .btn {
  letter-spacing: 0;
}

html[lang="en"] body {
  hyphens: auto;
}

html[lang="en"] .content-list li {
  text-align: start;
}

html[lang="en"] .idml-table .content-list li {
  text-align: start;
}

html[lang="en"] .content-list.list-marker-cjk-ideographic {
  list-style-type: number;
}

/* CH1 */
html[lang="en"] .idml-table th[data-cell-role="header"].cell-variant-ch1-3-header-1 {
  width: 6%;
}

html[lang="en"] .idml-table .cell-variant-ch1-5-1-header-6-1 {
  width: 6%;
}

/* CH2 */
html[lang="en"] .idml-table .cell-variant-ch2-2-5-header-1 {
  width: 9%;
}

/* CH3 */
html[lang="en"] .idml-table tbody td[data-cell-role="left-column"].cell-variant-ch3-3-1-header-1-1 {
  width: 8%;
}