:root {
  --paper:#f6f5f0;
  --surface:#fdfcf9;
  --ink:#252b29;
  --muted:#747a74;
  --line:#dcded6;
  --accent:#aa603b;
  --accent-light:#f0e4d8;
  --sage:#e6e9df;
  --serif:"Songti SC","Noto Serif CJK SC","SimSun",serif;
  --sans:"Microsoft YaHei","PingFang SC",Arial,sans-serif;
  --header:106px;
  --footer:92px;
  --safe:1530px
}
* {
  box-sizing:border-box
}
html,body {
  margin:0;
  width:100%;
  height:100%;
  overflow:hidden
}
body {
  font-family:var(--sans);
  color:var(--ink);
  background:var(--paper);
  font-size:15px;
  -webkit-font-smoothing:antialiased
}
button,a {
  -webkit-tap-highlight-color:transparent
}
button {
  font:inherit;
  color:inherit
}
button:focus-visible,a:focus-visible,[tabindex]:focus-visible {
  outline:2px solid var(--accent);
  outline-offset:5px
}
button {
  cursor:pointer
}
a {
  color:inherit
}
svg {
  display:block;
  max-width:100%
}
button svg {
  width:20px;
  height:20px;
  stroke:currentColor;
  stroke-width:1.5;
  fill:none
}
button:disabled {
  opacity:.28;
  cursor:default
}
.sr-only {
  position:absolute;
  width:1px;
  height:1px;
  overflow:hidden;
  clip:rect(0,0,0,0);
  white-space:nowrap
}
.skip-link {
  position:fixed;
  top:8px;
  left:16px;
  transform:translateY(-180%);
  z-index:20;
  background:var(--ink);
  color:white;
  padding:12px
}
.skip-link:focus {
  transform:none
}
.masthead {
  height:var(--header);
  position:relative;
  z-index:5;
  max-width:calc(var(--safe) + 112px);
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  padding:0 56px;
  border-bottom:1px solid var(--line)
}
.brand {
  display:flex;
  gap:12px;
  align-items:center;
  text-decoration:none
}
.brand>svg {
  width:51px;
  height:33px;
  stroke:var(--accent);
  stroke-width:2.8;
  stroke-linecap:round;
  stroke-linejoin:round
}
.brand>span {
  font-family:var(--serif);
  font-size:24px;
  font-weight:700;
  letter-spacing:4px;
  line-height:1.1
}
.brand small {
  display:block;
  font:8px var(--sans);
  letter-spacing:2.3px;
  margin-top:7px
}
.masthead-note {
  font-size:12px;
  letter-spacing:1px;
  display:flex;
  align-items:center;
  gap:18px;
  color:var(--muted)
}
.tiny-divider {
  height:14px;
  border-left:1px solid var(--line)
}
.edition {
  font-size:9px;
  letter-spacing:1.6px;
  color:var(--muted)
}
#presentation {
  position:relative;
  height:calc(100dvh - var(--header) - var(--footer));
  outline:0
}
.slide {
  position:absolute;
  inset:0;
  visibility:hidden;
  opacity:0;
  transform:translateY(16px);
  transition:opacity .42s ease,transform .5s ease,visibility .5s;
  overflow-y:auto;
  overflow-x:hidden;
  overscroll-behavior:contain;
  scrollbar-width:thin;
  scrollbar-color:var(--line) transparent
}
.slide.is-active {
  visibility:visible;
  opacity:1;
  transform:none;
  z-index:1
}
.slide-inner {
  max-width:calc(var(--safe) + 112px);
  margin:auto;
  padding:46px 56px;
  min-height:100%;
  display:flex;
  flex-direction:column;
  justify-content:center
}
.eyebrow {
  display:flex;
  align-items:center;
  gap:12px;
  font-size:10px;
  letter-spacing:2.2px;
  color:var(--accent);
  font-weight:600;
  margin:0 0 22px;
  text-transform:uppercase
}
.eyebrow:before {
  content:"";
  width:24px;
  border-top:1px solid currentColor
}
h1,h2,h3,p {
  margin:0
}
h1,h2 {
  font-family:var(--serif);
  font-weight:500;
  letter-spacing:1px;
  text-wrap:balance
}
h1 {
  font-size:clamp(42px,3.45vw,69px);
  line-height:1.4
}
h2 {
  font-size:clamp(32px,2.3vw,46px);
  line-height:1.42
}
h3 {
  font-size:20px;
  font-weight:500
}
.accent-text {
  color:var(--accent)
}
.intro {
  font-size:14px;
  line-height:1.95;
  color:var(--muted);
  margin-top:20px;
  max-width:660px
}
.section-heading {
  margin-bottom:38px
}
.section-heading .intro {
  margin-top:14px
}
.kicker {
  font-size:10px;
  letter-spacing:2px;
  color:var(--muted);
  text-transform:uppercase
}
.deck-footer {
  height:var(--footer);
  max-width:calc(var(--safe) + 112px);
  padding:0 56px;
  margin:auto;
  display:flex;
  align-items:center;
  justify-content:space-between;
  gap:20px;
  border-top:1px solid var(--line);
  position:relative;
  z-index:5
}
.page-progress {
  display:flex;
  gap:13px;
  align-items:center;
  font-size:11px;
  font-variant-numeric:tabular-nums
}
.page-progress>span:first-child {
  color:var(--accent)
}
.progress-line {
  width:76px;
  height:1px;
  background:var(--line);
  position:relative
}
.progress-line i {
  position:absolute;
  inset:0 auto 0 0;
  background:var(--accent);
  transition:width .35s
}
#page-total {
  color:var(--muted)
}
#page-label {
  padding-left:11px;
  color:var(--muted);
  font-size:10px
}
.page-dots {
  display:flex;
  gap:1px;
  align-items:center
}
.page-dots button {
  background:none;
  border:0;
  width:24px;
  height:44px;
  padding:0;
  position:relative
}
.page-dots button:after {
  content:"";
  position:absolute;
  top:19px;
  left:9px;
  width:5px;
  height:5px;
  border-radius:50%;
  background:#c9cdc4;
  transition:background .25s,transform .25s
}
.page-dots button[aria-current="page"]:after {
  background:var(--accent);
  transform:scale(1.35)
}
.page-actions {
  display:flex;
  align-items:center;
  gap:10px
}
.gesture-hint {
  font-size:10px;
  color:var(--muted);
  margin-right:15px;
  letter-spacing:1px
}
.page-actions button {
  border:1px solid var(--line);
  width:36px;
  height:36px;
  background:transparent;
  border-radius:50%;
  display:grid;
  place-items:center;
  transition:background .2s
}
.page-actions button:not(:disabled):hover {
  background:var(--accent-light);
  border-color:var(--accent)
}
.text-button {
  border:0;
  border-bottom:1px solid var(--accent);
  background:none;
  padding:12px 0;
  color:var(--accent);
  font-size:12px;
  display:inline-flex;
  gap:30px;
  align-items:center;
  width:max-content
}
.text-button svg {
  width:20px;
  height:20px
}
.pill {
  border:1px solid var(--line);
  border-radius:30px;
  padding:8px 14px;
  font-size:11px;
  display:inline-flex;
  align-items:center;
  gap:7px;
  color:var(--muted)
}
.pill i {
  height:5px;
  width:5px;
  border-radius:50%;
  background:var(--accent)
}
.rule-note {
  border-top:1px solid var(--line);
  padding-top:18px;
  margin-top:24px;
  color:var(--muted);
  font-size:11px;
  line-height:1.8
}
.icon {
  width:25px;
  height:25px;
  fill:none;
  stroke:currentColor;
  stroke-width:1.35;
  stroke-linecap:round;
  stroke-linejoin:round
}
.noscript {
  position:fixed;
  inset:30% 10%;
  background:var(--surface);
  padding:40px;
  z-index:10
}
.mini-label {
  font-size:10px;
  letter-spacing:1.2px;
  color:var(--muted)
}
@media(prefers-reduced-motion:reduce) {
  *,*:before,*:after {
    animation:none!important;
    transition:none!important;
    scroll-behavior:auto!important
  }
}