.nd2 {
  --nd2-night: #061b31;
  --nd2-deep: #0a2a43;
  --nd2-panel: #0d3853;
  --nd2-paper: #fffaf0;
  --nd2-ink: #183249;
  --nd2-gold: #f2c65d;
  --nd2-gold-soft: #ffe9a7;
  --nd2-red: #a21f35;
  --nd2-green: #1f6d5b;
  --nd2-blue: #dff4ff;
  --nd2-line: rgba(242, 198, 93, .45);
  background:
    radial-gradient(circle at 50% -10%, rgba(80, 173, 173, .23), transparent 38rem),
    linear-gradient(160deg, #06192c, #0a2a43 55%, #071d34);
  border: 1px solid rgba(242, 198, 93, .36);
  border-radius: 28px;
  color: #f9fbff;
  container-type: inline-size;
  font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", sans-serif;
  margin: 1.5rem auto;
  max-width: 1180px;
  overflow: hidden;
  position: relative;
}

.nd2 *,
.nd2 *::before,
.nd2 *::after { box-sizing: border-box; }

.nd2 button,
.nd2 select,
.nd2 input { font: inherit; }

.nd2 button { min-height: 44px; }

.nd2 button:focus-visible,
.nd2 select:focus-visible,
.nd2 a:focus-visible,
.nd2 summary:focus-visible {
  outline: 4px solid #fff2a8;
  outline-offset: 3px;
}

.nd2-preview {
  background: #fff4c7;
  border-bottom: 1px solid #d7aa2d;
  color: #382b0b;
  font-size: .92rem;
  margin: 0;
  padding: .75rem 1rem;
  text-align: center;
}

.nd2-preview code {
  background: rgba(255,255,255,.7);
  border-radius: 4px;
  padding: .1rem .3rem;
}

.nd2-hero {
  align-items: center;
  border-bottom: 1px solid var(--nd2-line);
  display: grid;
  gap: 1.25rem;
  grid-template-columns: minmax(0, 1fr) minmax(280px, 430px);
  padding: clamp(1.25rem, 3vw, 2.25rem);
}

.nd2-hero-copy { min-width: 0; }

.nd2-hero-visual {
  border: 1px solid rgba(242, 198, 93, .65);
  border-radius: 20px;
  box-shadow: 0 18px 40px rgba(0,0,0,.28);
  margin: 0;
  overflow: hidden;
}

.nd2-hero-visual img {
  aspect-ratio: 4 / 3;
  display: block;
  height: auto;
  object-fit: cover;
  width: 100%;
}

.nd2-kicker {
  color: var(--nd2-gold-soft);
  font-size: .78rem;
  font-weight: 850;
  letter-spacing: .12em;
  margin: 0 0 .35rem;
  text-transform: uppercase;
}

.nd2-title {
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.75rem, 4vw, 3.2rem);
  font-weight: 750;
  line-height: 1.05;
  margin: 0;
  text-wrap: balance;
}

.nd2-lead {
  color: #d9edf6;
  font-size: clamp(.98rem, 1.6vw, 1.12rem);
  line-height: 1.55;
  margin: .65rem 0 0;
  max-width: 48rem;
}

.nd2-book-button,
.nd2-primary,
.nd2-secondary,
.nd2-choice,
.nd2-route-node,
.nd2-tap,
.nd2-ignite {
  border-radius: 999px;
  cursor: pointer;
  font-weight: 800;
}

.nd2-book-button {
  background: var(--nd2-gold);
  border: 2px solid #fff2b4;
  color: #2d2308;
  margin-top: 1rem;
  padding: .7rem 1.1rem;
}

.nd2-days {
  display: grid;
  gap: .5rem;
  grid-template-columns: repeat(12, minmax(44px, 1fr));
  padding: 1rem clamp(1rem, 3vw, 2rem);
}

.nd2-day-button {
  align-items: center;
  background: rgba(255,255,255,.08);
  border: 1px solid rgba(255,255,255,.24);
  border-radius: 12px;
  color: #fff;
  cursor: pointer;
  display: flex;
  font-weight: 850;
  justify-content: center;
  min-width: 44px;
  padding: .45rem;
  position: relative;
}

.nd2-day-button[aria-current="date"] {
  background: var(--nd2-gold);
  border-color: #fff2b4;
  color: #2d2308;
}

.nd2-day-button.is-complete::after {
  align-items: center;
  background: #effff7;
  border: 1px solid #1b7359;
  border-radius: 50%;
  color: #11624b;
  content: "✓";
  display: flex;
  font-size: .65rem;
  height: 17px;
  justify-content: center;
  position: absolute;
  right: -4px;
  top: -5px;
  width: 17px;
}

.nd2-day-button:disabled {
  cursor: not-allowed;
  opacity: .42;
}

.nd2-book {
  background: linear-gradient(90deg, #f9efd7, #fffaf0 48%, #f7ecd4 52%, #fffaf0);
  border: 2px solid var(--nd2-gold);
  border-radius: 20px;
  color: var(--nd2-ink);
  margin: 0 clamp(1rem, 3vw, 2rem) 1rem;
  padding: clamp(1rem, 3vw, 1.75rem);
}

.nd2-book[hidden] { display: none; }
.nd2-book h2 { color: #6e2230; margin: 0 0 .35rem; }
.nd2-book > p { margin-top: .35rem; }

.nd2-book-grid {
  display: grid;
  gap: .7rem;
  grid-template-columns: repeat(auto-fit, minmax(190px, 1fr));
  margin-top: 1rem;
}

.nd2-book-entry {
  background: rgba(255,255,255,.72);
  border: 1px solid #d7c49a;
  border-radius: 14px;
  min-height: 96px;
  padding: .8rem;
}

.nd2-book-entry.is-empty { opacity: .68; }
.nd2-book-entry strong { color: #6e2230; display: block; }
.nd2-book-entry p { font-size: .9rem; line-height: 1.4; margin: .35rem 0 0; }
.nd2-book-symbol { font-size: 1.45rem; }

.nd2-stage { padding: 0 clamp(1rem, 3vw, 2rem) 2rem; }

.nd2-day-head {
  align-items: end;
  display: flex;
  gap: 1rem;
  justify-content: space-between;
  margin: .5rem 0 1rem;
}

.nd2-date {
  color: var(--nd2-gold-soft);
  font-size: .8rem;
  font-weight: 850;
  letter-spacing: .08em;
  margin: 0 0 .25rem;
  text-transform: uppercase;
}

.nd2-day-title {
  color: #fff;
  font-family: Georgia, "Times New Roman", serif;
  font-size: clamp(1.55rem, 3.2vw, 2.45rem);
  line-height: 1.12;
  margin: 0;
}

.nd2-grid {
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(0, 1.35fr) minmax(290px, .65fr);
}

.nd2-card {
  background: var(--nd2-paper);
  border: 1px solid rgba(242, 198, 93, .65);
  border-radius: 22px;
  color: var(--nd2-ink);
  overflow: hidden;
}

.nd2-scene-copy {
  background:
    radial-gradient(circle at 100% 0, rgba(242,198,93,.22), transparent 16rem),
    linear-gradient(145deg, #fffaf0, #f7edd2);
  min-height: 190px;
  padding: clamp(1.2rem, 3vw, 2rem);
}
.nd2-scene-copy h3 { color: #762234; margin: 0 0 .45rem; }
.nd2-scene-copy p { line-height: 1.58; margin: 0; }

.nd2-audio {
  border-top: 1px solid #e4d7b8;
  padding: .9rem clamp(1rem, 2.5vw, 1.5rem) 1.1rem;
}

.nd2-audio-speaker { color: #5e2430; font-weight: 850; margin: 0 0 .65rem; }
.nd2-audio audio { max-width: 100%; width: 100%; }
.nd2-audio-wait { color: #5b4a27; font-size: .9rem; margin: 0 0 .65rem; }
.nd2-transcript { border-top: 1px dashed #cdbb92; margin-top: .7rem; padding-top: .65rem; }
.nd2-transcript summary { color: #5e2430; cursor: pointer; font-weight: 800; }
.nd2-transcript p { line-height: 1.55; }

.nd2-lantern-card { padding: 1rem; text-align: center; }
.nd2-lantern-card h3 { color: #6e2230; margin: 0 0 .25rem; }
.nd2-lantern-status { color: #564827; font-size: .9rem; margin: .25rem 0 .75rem; }

.nd2-lantern {
  filter: drop-shadow(0 12px 16px rgba(2, 20, 34, .26));
  height: auto;
  max-width: 330px;
  overflow: visible;
  width: 100%;
}

.nd2-lantern-frame { fill: #b77a1a; stroke: #ffe9a2; stroke-width: 8; }
.nd2-lantern-inner { fill: #08283e; stroke: #7d4f0b; stroke-width: 5; }
.nd2-lantern-handle { fill: none; stroke: #dca83f; stroke-linecap: round; stroke-width: 18; }
.nd2-lantern-bar { fill: #e0ab3c; stroke: #6f4408; stroke-width: 4; }
.nd2-pane { fill: #071c2c; stroke: #e0ab3c; stroke-width: 5; transition: fill .6s ease, filter .6s ease, opacity .6s ease; }
.nd2-pane.is-filled { filter: drop-shadow(0 0 8px currentColor); }
.nd2-pane-1.is-filled { fill: #ffd45d; color: #ffd45d; }
.nd2-pane-2.is-filled { fill: #8bd9f5; color: #8bd9f5; }
.nd2-pane-3.is-filled { fill: #d94b65; color: #d94b65; }
.nd2-pane-4.is-filled { fill: #65bd81; color: #65bd81; }
.nd2-pane-5.is-filled { fill: #a783df; color: #a783df; }
.nd2-pane-6.is-filled { fill: #f2a84b; color: #f2a84b; }
.nd2-pane-7.is-filled { fill: #ecfbff; color: #ecfbff; }
.nd2-wick { fill: #16110a; stroke: #c28c2f; stroke-width: 4; }
.nd2-flame { fill: transparent; stroke: transparent; transition: fill .8s ease, filter .8s ease; }
.nd2-lantern.is-lit .nd2-flame { fill: #fff2a6; filter: drop-shadow(0 0 15px #ffc343); }
.nd2-spark { fill: #fff4b1; opacity: 0; }
.nd2-lantern.has-sparks .nd2-spark { animation: nd2-spark 1.8s ease-in-out infinite alternate; opacity: 1; }

@keyframes nd2-spark {
  from { opacity: .35; transform: translateY(2px); }
  to { opacity: 1; transform: translateY(-3px); }
}

.nd2-task {
  background: linear-gradient(180deg, #fffaf0, #f7efd9);
  border: 2px solid var(--nd2-gold);
  border-radius: 22px;
  color: var(--nd2-ink);
  margin-top: 1rem;
  padding: clamp(1rem, 3vw, 1.6rem);
}

.nd2-task-kicker { color: #85243a; font-size: .78rem; font-weight: 900; letter-spacing: .08em; margin: 0 0 .3rem; text-transform: uppercase; }
.nd2-task h3 { color: #5e2430; font-size: clamp(1.3rem, 2.5vw, 1.75rem); margin: 0; }
.nd2-instruction { font-size: 1.04rem; line-height: 1.55; margin: .55rem 0 1rem; }

.nd2-task-area {
  background: rgba(255,255,255,.72);
  border: 1px solid #dccb9e;
  border-radius: 16px;
  min-height: 120px;
  padding: 1rem;
}

.nd2-primary,
.nd2-ignite {
  background: #9c2035;
  border: 2px solid #c9475c;
  color: #fff;
  padding: .72rem 1.15rem;
}

.nd2-secondary {
  background: #fff;
  border: 2px solid #b99036;
  color: #4b3510;
  padding: .65rem 1rem;
}

.nd2-actions { display: flex; flex-wrap: wrap; gap: .65rem; margin-top: 1rem; }
.nd2-choice-grid { display: grid; gap: .65rem; grid-template-columns: repeat(auto-fit, minmax(150px, 1fr)); }

.nd2-choice,
.nd2-route-node {
  background: #fff;
  border: 2px solid #b7cbd6;
  color: var(--nd2-ink);
  padding: .75rem .8rem;
  text-align: left;
}

.nd2-choice:hover,
.nd2-route-node:hover { border-color: #b37b1c; }
.nd2-choice.is-selected,
.nd2-route-node.is-selected { background: #fff0b4; border-color: #9c6a11; }
.nd2-choice.is-correct { background: #e5f8ef; border-color: #25795d; }
.nd2-choice.is-wrong { background: #fff0ef; border-color: #b84444; }

.nd2-pattern-prompt { font-size: 1.05rem; font-weight: 850; margin: 0 0 .85rem; }
.nd2-pattern-line { display: flex; flex-wrap: wrap; gap: .45rem; margin: .5rem 0 1rem; }
.nd2-token { align-items: center; background: #0e3d59; border: 2px solid #e4c05c; border-radius: 12px; color: #fff; display: inline-flex; font-size: 1.25rem; font-weight: 900; justify-content: center; min-height: 48px; min-width: 48px; padding: .4rem .65rem; }
.nd2-token.is-gap { background: #fff; border-style: dashed; color: #6b5a35; }

.nd2-order-list { display: grid; gap: .55rem; margin: 0; padding: 0; }
.nd2-order-item { align-items: center; background: #fff; border: 1px solid #bdcfd8; border-radius: 13px; display: grid; gap: .6rem; grid-template-columns: 1fr auto; list-style: none; padding: .65rem .7rem .65rem .9rem; }
.nd2-order-label { font-weight: 750; line-height: 1.35; }
.nd2-order-buttons { display: flex; gap: .3rem; }
.nd2-order-buttons button { background: #edf5f8; border: 1px solid #86a9b9; border-radius: 8px; color: #16384a; cursor: pointer; min-height: 40px; min-width: 40px; }

.nd2-match-list,
.nd2-setting-list { display: grid; gap: .75rem; }
.nd2-match-row,
.nd2-setting-row { align-items: center; background: #fff; border: 1px solid #cbd7dc; border-radius: 13px; display: grid; gap: .7rem; grid-template-columns: minmax(150px, 1fr) minmax(170px, 1fr); padding: .75rem; }
.nd2-match-row label,
.nd2-setting-row label { font-weight: 780; line-height: 1.35; }
.nd2-match-row select,
.nd2-setting-row select { background: #fff; border: 2px solid #8caab8; border-radius: 9px; color: #173247; min-height: 44px; padding: .55rem; width: 100%; }

.nd2-route-pool { display: grid; gap: .55rem; grid-template-columns: repeat(auto-fit, minmax(125px, 1fr)); }
.nd2-route-built { align-items: center; background: #eef8fb; border: 1px dashed #769bad; border-radius: 13px; display: flex; flex-wrap: wrap; gap: .4rem; margin-top: .8rem; min-height: 58px; padding: .55rem; }
.nd2-route-step { background: #0d3b55; border-radius: 999px; color: #fff; font-weight: 800; padding: .45rem .7rem; }

.nd2-memory-display { align-items: center; display: flex; flex-wrap: wrap; gap: .55rem; justify-content: center; min-height: 74px; }
.nd2-memory-pad { background: #0e3e5b; border: 3px solid #e4c05c; border-radius: 16px; color: #fff; cursor: pointer; font-size: 1.4rem; font-weight: 900; min-height: 58px; min-width: 58px; }
.nd2-memory-pad.is-flash { background: #fff0a9; color: #3d2a05; transform: translateY(-3px); }

.nd2-balance { display: grid; gap: 1rem; grid-template-columns: 1fr 1fr; }
.nd2-pan { background: #edf6f7; border: 2px solid #7798a6; border-radius: 16px; min-height: 128px; padding: .75rem; }
.nd2-pan h4 { margin: 0 0 .55rem; text-align: center; }
.nd2-packages { display: flex; flex-wrap: wrap; gap: .45rem; justify-content: center; }
.nd2-package { background: #9d263c; border: 2px solid #f1c45a; border-radius: 10px; color: #fff; cursor: pointer; font-size: 1.3rem; font-weight: 900; min-height: 52px; min-width: 58px; }
.nd2-package[data-side="left"] { background: #1b6a6f; }
.nd2-package[data-side="right"] { background: #6e3d87; }
.nd2-package-key { color: #5a4a26; font-size: .88rem; margin: .75rem 0 0; text-align: center; }

.nd2-tap-area { text-align: center; }
.nd2-rhythm-display { align-items: center; display: flex; gap: .7rem; justify-content: center; min-height: 58px; }
.nd2-beat { background: #0e3d59; border: 3px solid #e5bd4d; border-radius: 50%; height: 28px; opacity: .35; width: 28px; }
.nd2-beat.is-on { background: #fff0a8; box-shadow: 0 0 20px #e5bd4d; opacity: 1; transform: scale(1.2); }
.nd2-beat-gap { width: 34px; }
.nd2-tap { background: #7d2436; border: 5px solid #efc65a; color: #fff; font-size: 1.1rem; margin-top: .8rem; min-height: 86px; min-width: min(100%, 250px); padding: 1rem 1.4rem; }
.nd2-tap-count { color: #5b4926; font-weight: 800; margin: .55rem 0 0; }
.nd2-ignite { margin-top: 1rem; min-height: 58px; min-width: min(100%, 260px); position: relative; transition: box-shadow .2s ease, transform .2s ease; }
.nd2-ignite.is-holding { box-shadow: 0 0 0 7px rgba(229,189,77,.42), 0 0 24px rgba(229,189,77,.9); transform: scale(1.03); }
.nd2-hold-status { color: #5b4926; font-weight: 750; margin: .55rem 0 0; }

.nd2-feedback { border-radius: 12px; line-height: 1.45; margin: .85rem 0 0; min-height: 24px; padding: .65rem .8rem; }
.nd2-feedback:empty { margin: 0; min-height: 0; padding: 0; }
.nd2-feedback.is-hint { background: #fff1be; color: #46360f; }
.nd2-feedback.is-good { background: #e4f8ef; color: #14533f; }

.nd2-help { background: transparent; border: 0; color: #722235; cursor: pointer; font-weight: 850; margin-top: .65rem; text-decoration: underline; text-underline-offset: 3px; }
.nd2-help[hidden] { display: none; }

.nd2-success { background: #e3f7ef; border: 2px solid #2e8164; border-radius: 18px; color: #123f33; margin-top: 1rem; padding: 1rem; }
.nd2-success h3 { color: #14533f; margin: 0 0 .35rem; }
.nd2-success p { line-height: 1.5; margin: .35rem 0; }
.nd2-cliff { border-top: 1px dashed #76a695; font-style: italic; padding-top: .65rem; }

.nd2-bonus { background: #fff9df; border: 1px solid #caa23d; border-radius: 15px; margin-top: .8rem; padding: .85rem; }
.nd2-bonus h4 { color: #6f2836; margin: 0 0 .45rem; }
.nd2-bonus p { margin: .35rem 0 .7rem; }

.nd2-closed { padding: 3rem 1rem; text-align: center; }
.nd2-closed h2 { color: #fff; }
.nd2-closed-door { background: #7b2b27; border: 7px solid #d4a94a; border-radius: 80px 80px 10px 10px; box-shadow: inset 0 0 0 8px #471c1a, 0 14px 30px rgba(0,0,0,.35); height: 190px; margin: 0 auto 1.5rem; position: relative; width: 135px; }
.nd2-closed-door span { background: #f2c65d; border-radius: 50%; height: 14px; position: absolute; right: 20px; top: 105px; width: 14px; }

.nd2-parent { background: rgba(0,0,0,.18); border-top: 1px solid var(--nd2-line); padding: 1rem; text-align: center; }
.nd2-parent a { color: #fff0b3; font-weight: 750; }
.nd2-parent span { font-size: .88em; }

@container (max-width: 820px) {
  .nd2-hero { grid-template-columns: 1fr; }
  .nd2-hero-visual { max-width: 620px; }
  .nd2-days { grid-template-columns: repeat(8, minmax(44px, 1fr)); }
  .nd2-grid { grid-template-columns: 1fr; }
  .nd2-lantern-card { order: -1; }
  .nd2-lantern { max-width: 260px; }
}

@container (max-width: 560px) {
  .nd2 { border-radius: 20px; }
  .nd2-book-button { width: 100%; }
  .nd2-days { grid-template-columns: repeat(6, minmax(44px, 1fr)); padding-inline: .75rem; }
  .nd2-stage { padding-inline: .75rem; }
  .nd2-day-head { align-items: start; flex-direction: column; }
  .nd2-match-row,
  .nd2-setting-row { grid-template-columns: 1fr; }
  .nd2-balance { grid-template-columns: 1fr; }
  .nd2-choice-grid { grid-template-columns: 1fr; }
}

@container (max-width: 350px) {
  .nd2-days { grid-template-columns: repeat(4, minmax(44px, 1fr)); }
}

@media (prefers-reduced-motion: reduce) {
  .nd2 *,
  .nd2 *::before,
  .nd2 *::after {
    animation-duration: .01ms !important;
    animation-iteration-count: 1 !important;
    scroll-behavior: auto !important;
    transition-duration: .01ms !important;
  }
}


/* 2.0.0-preview.7 polish */
#nd2-app .nd2-scene-copy h3 { color: #762234 !important; }
#nd2-app .nd2-lantern-card h3 { color: #6e2230 !important; }
#nd2-app .nd2-task h3 { color: #5e2430 !important; }
#nd2-app .nd2-success h3 { color: #14533f !important; }

.nd2-santa-final {
  align-items: center;
  background: #fffaf0;
  border: 1px solid #d7aa2d;
  border-radius: 16px;
  display: grid;
  gap: 1rem;
  grid-template-columns: minmax(84px, 120px) 1fr;
  margin: .9rem 0;
  padding: .75rem 1rem;
}
.nd2-santa-final img { display: block; height: auto; max-height: 150px; object-fit: contain; width: 100%; }
.nd2-santa-final figcaption { color: #183249; font-weight: 800; line-height: 1.45; }

.nd2-diploma {
  background: #f8efe0;
  border: 1px solid #b98929;
  border-radius: 16px;
  margin-top: 1rem;
  padding: 1rem;
}
#nd2-app .nd2-diploma > h4 { color: #5e2430 !important; font-size: 1.2rem; margin: 0 0 .25rem; }
.nd2-diploma-intro { color: #4d4b43; margin: 0 0 .8rem !important; }
.nd2-certificate {
  background: #fffdf6;
  border: 5px solid #d1a83a;
  box-shadow: inset 0 0 0 3px #0c644e;
  color: #18342d;
  padding: clamp(1.2rem, 4vw, 2.2rem);
  text-align: center;
}
.nd2-certificate-star { color: #b78416; font-size: 2.8rem; line-height: 1; }
.nd2-certificate-kicker { color: #6e5a28 !important; font-size: .75rem; font-weight: 900; letter-spacing: .12em; margin: .45rem 0 !important; text-transform: uppercase; }
#nd2-app .nd2-certificate-title { color: #762234 !important; font-family: Georgia, 'Times New Roman', serif; font-size: clamp(2.2rem, 7vw, 3.5rem); line-height: 1; margin: .45rem 0 .25rem; }
.nd2-certificate-subtitle { color: #0c644e !important; font-size: 1rem; font-weight: 900; margin: 0 0 1.2rem !important; }
.nd2-certificate-name {
  border-bottom: 2px solid #b98929;
  color: #762234 !important;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: clamp(1.45rem, 5vw, 2.15rem);
  font-weight: 700;
  margin: 0 auto 1.1rem !important;
  max-width: 520px;
  min-height: 2.2rem;
  overflow-wrap: anywhere;
  padding: 0 .5rem .25rem;
}
.nd2-certificate-text { color: #263f3a !important; line-height: 1.65 !important; margin: 0 auto .9rem !important; max-width: 620px; }
.nd2-certificate-motto { color: #762234 !important; font-family: Georgia, 'Times New Roman', serif; font-style: italic; font-weight: 700; margin: .7rem 0 1.2rem !important; }
.nd2-certificate-signatures { display: grid; gap: 1.25rem; grid-template-columns: 1fr 1fr; margin: 1.1rem auto .8rem; max-width: 520px; }
.nd2-certificate-signature { border-top: 0; padding-top: 0; }
.nd2-certificate-signature::before {
  color: #0c644e;
  display: block;
  font-family: 'Segoe Script', 'Brush Script MT', 'Mountains of Christmas', 'Snell Roundhand', cursive;
  font-size: 1.9rem;
  font-style: italic;
  font-weight: 700;
  letter-spacing: .01em;
  line-height: 1;
  min-height: 2.3rem;
  padding: 0 .25rem .18rem;
  text-shadow: 0 .3px currentColor;
  transform: rotate(-3deg);
  transform-origin: center bottom;
}
.nd2-certificate-signature:nth-child(1)::before { content: 'Glimt'; }
.nd2-certificate-signature:nth-child(2)::before {
  color: #762234;
  content: 'Jultomten';
  font-size: 2.05rem;
  transform: rotate(-4deg);
}
.nd2-certificate-signature p { margin: 0 !important; }
.nd2-certificate-signature-name {
  border-top: 1px solid #8d7b54;
  color: #18342d !important;
  font-family: Georgia, 'Times New Roman', serif;
  font-size: 1.15rem;
  font-weight: 700;
  padding-top: .4rem;
}
.nd2-certificate-signature-title { color: #5b6964 !important; font-size: .75rem; }
.nd2-certificate-date { color: #5b6964 !important; font-size: .75rem; font-weight: 800; margin: .9rem 0 0 !important; }
.nd2-diploma-fields { align-items: end; display: flex; flex-wrap: wrap; gap: .75rem; margin-top: .85rem; }
.nd2-diploma-fields label { color: #4a3820; flex: 1 1 240px; font-size: .83rem; font-weight: 850; }
.nd2-diploma-name {
  background: #fff;
  border: 2px solid #8d7650;
  border-radius: 10px;
  color: #1f2f2b;
  display: block;
  font: inherit;
  margin-top: .3rem;
  min-height: 44px;
  padding: .55rem .7rem;
  width: 100%;
}
.nd2-diploma-name:focus-visible { outline: 4px solid #efc65a; outline-offset: 2px; }
.nd2-print-root { display: none; }

@media print {
  @page { size: A4 portrait; margin: 10mm; }

  html,
  body.nd2-printing {
    background: #fff !important;
    margin: 0 !important;
    min-height: 0 !important;
    padding: 0 !important;
  }

  body.nd2-printing > :not(#nd2-print-root) { display: none !important; }

  body.nd2-printing > #nd2-print-root {
    display: block !important;
    height: 277mm !important;
    margin: 0 !important;
    padding: 0 !important;
    position: static !important;
    width: 190mm !important;
  }

  #nd2-print-root .nd2-certificate {
    background: #fffdf6 !important;
    border: 2mm solid #d1a83a !important;
    border-radius: 0 !important;
    box-shadow: inset 0 0 0 1.4mm #0c644e !important;
    box-sizing: border-box !important;
    color: #18342d !important;
    display: flex !important;
    flex-direction: column;
    height: 277mm !important;
    justify-content: center;
    margin: 0 !important;
    overflow: hidden !important;
    padding: 18mm 17mm !important;
    page-break-inside: avoid !important;
    break-inside: avoid !important;
    text-align: center !important;
    width: 190mm !important;
    -webkit-print-color-adjust: exact !important;
    print-color-adjust: exact !important;
  }

  #nd2-print-root .nd2-certificate-star { color: #b78416 !important; font-size: 30pt !important; }
  #nd2-print-root .nd2-certificate-kicker { color: #6e5a28 !important; font-size: 8.5pt !important; margin: 4mm 0 2mm !important; }
  #nd2-print-root .nd2-certificate-title { color: #762234 !important; font-size: 36pt !important; margin: 3mm 0 1.5mm !important; }
  #nd2-print-root .nd2-certificate-subtitle { color: #0c644e !important; font-size: 13pt !important; margin: 0 0 11mm !important; }
  #nd2-print-root .nd2-certificate-name { color: #762234 !important; font-size: 22pt !important; margin: 0 auto 8mm !important; min-height: 12mm !important; width: 135mm !important; }
  #nd2-print-root .nd2-certificate-text { color: #263f3a !important; font-size: 12pt !important; line-height: 1.55 !important; margin: 0 auto 6mm !important; max-width: 145mm !important; }
  #nd2-print-root .nd2-certificate-motto { color: #762234 !important; font-size: 12pt !important; margin: 4mm 0 12mm !important; }
  #nd2-print-root .nd2-certificate-signatures { gap: 18mm !important; margin: 0 auto 8mm !important; width: 135mm !important; }
  #nd2-print-root .nd2-certificate-signature::before {
    font-size: 23pt !important;
    min-height: 15mm !important;
    padding: 0 2mm 1.5mm !important;
  }
  #nd2-print-root .nd2-certificate-signature:nth-child(2)::before { font-size: 25pt !important; }
  #nd2-print-root .nd2-certificate-signature-name {
    color: #18342d !important;
    font-size: 13pt !important;
    padding-top: 1.5mm !important;
  }
  #nd2-print-root .nd2-certificate-signature-title { color: #5b6964 !important; font-size: 9pt !important; }
  #nd2-print-root .nd2-certificate-date { color: #5b6964 !important; font-size: 9pt !important; margin: 4mm 0 0 !important; }
}

@container (max-width: 560px) {
  .nd2-santa-final { grid-template-columns: 82px 1fr; padding: .7rem; }
  .nd2-santa-final img { max-height: 112px; }
  .nd2-certificate { padding: 1rem; }
  .nd2-certificate-signatures { gap: .7rem; }
  .nd2-diploma-fields .nd2-primary { width: 100%; }
}