/* DB-gestuetzter D-Book-Praesentationsmodus V1.2. */

body.teacher-planning-page .teacher-presentation-card {
  display: grid;
  gap: 18px;
  color: var(--teacher-text, var(--text-primary, #f4f7ff));
}

.teacher-presentation-card[hidden] {
  display: none;
}

.teacher-presentation-card__header {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 18px;
  align-items: start;
}

.teacher-presentation-card__text {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.teacher-presentation-card__eyebrow {
  margin: 0;
  color: var(--teacher-muted, var(--text-secondary, #c4d0e6));
  font-family: var(--font-ui);
  font-size: 0.78rem;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.teacher-presentation-card__title,
.teacher-presentation-card__path-title {
  margin: 0;
  overflow-wrap: anywhere;
}

.teacher-presentation-card__title {
  font-size: clamp(1.35rem, 1.1rem + 0.7vw, 1.95rem);
}

.teacher-presentation-card__description,
.teacher-presentation-card__subline,
.teacher-presentation-card__empty {
  margin: 0;
  color: var(--teacher-muted, var(--text-secondary, #c4d0e6));
  max-width: 78ch;
}

.teacher-presentation-card__actions {
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-end;
  gap: 10px;
}

.teacher-presentation-card__button,
.presentation-control,
.presentation-task__button {
  display: inline-flex;
  align-items: center;
  justify-content: center;
  min-height: 42px;
  padding: 10px 14px;
  border: 1px solid rgba(190, 213, 255, 0.34);
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.08);
  color: inherit;
  font-family: var(--font-ui);
  font-size: 0.95rem;
  font-weight: 800;
  line-height: 1.1;
  text-decoration: none;
  cursor: pointer;
}

.teacher-presentation-card__button--primary,
.presentation-control--primary,
.presentation-task__button {
  border-color: rgba(113, 222, 192, 0.5);
  background: linear-gradient(135deg, rgba(18, 112, 140, 0.98), rgba(29, 145, 110, 0.96));
  color: #f7fffd;
}

.teacher-presentation-card__path {
  display: grid;
  gap: 12px;
  padding: 14px;
  border: 1px solid var(--teacher-line, rgba(255, 255, 255, 0.18));
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.055);
}

.teacher-presentation-card__meta {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
}

.teacher-presentation-card__pill {
  display: inline-flex;
  align-items: center;
  min-height: 26px;
  padding: 4px 9px;
  border: 1px solid var(--teacher-line, rgba(255, 255, 255, 0.18));
  border-radius: 8px;
  background: rgba(255, 255, 255, 0.075);
  color: var(--teacher-muted, var(--text-secondary, #c4d0e6));
  font-size: 0.82rem;
  line-height: 1.2;
}

.teacher-presentation-card__pill strong {
  color: var(--teacher-text, var(--text-primary, #f4f7ff));
}

body.presentation-active {
  overflow: hidden;
}

.presentation-shell {
  position: fixed;
  inset: 0;
  z-index: 10000;
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  height: 100vh;
  height: 100dvh;
  min-width: 320px;
  background:
    radial-gradient(circle at top left, rgba(28, 160, 146, 0.16), transparent 34%),
    linear-gradient(180deg, #07111f 0%, #0b1322 52%, #050910 100%);
  color: #edf7ff;
  font-family: var(--font-body);
  --presentation-network-pattern: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='360' height='128' viewBox='0 0 360 128'%3E%3Cg fill='none' stroke='%23c6dbff' stroke-width='1' stroke-linecap='round' opacity='.15'%3E%3Cpath d='M12 88L56 52L104 68L148 30L212 48L260 20L334 46'/%3E%3Cpath d='M56 52L74 104L148 82L212 48L250 102L334 46'/%3E%3Cpath d='M104 68L148 82L194 110L250 102'/%3E%3Cpath d='M148 30L148 82L194 110'/%3E%3C/g%3E%3Cg fill='%23c6dbff' opacity='.24'%3E%3Ccircle cx='12' cy='88' r='2.2'/%3E%3Ccircle cx='56' cy='52' r='2.8'/%3E%3Ccircle cx='74' cy='104' r='2.1'/%3E%3Ccircle cx='104' cy='68' r='2.3'/%3E%3Ccircle cx='148' cy='30' r='2.7'/%3E%3Ccircle cx='148' cy='82' r='2.2'/%3E%3Ccircle cx='194' cy='110' r='2'/%3E%3Ccircle cx='212' cy='48' r='2.5'/%3E%3Ccircle cx='250' cy='102' r='2.1'/%3E%3Ccircle cx='260' cy='20' r='2.4'/%3E%3Ccircle cx='334' cy='46' r='2.8'/%3E%3C/g%3E%3Cg fill='%236ee7c8' opacity='.34'%3E%3Ccircle cx='56' cy='52' r='1.45'/%3E%3Ccircle cx='212' cy='48' r='1.35'/%3E%3Ccircle cx='334' cy='46' r='1.5'/%3E%3C/g%3E%3C/svg%3E");
}

.presentation-shell.is-presentation-title-slide {
  grid-template-rows: minmax(0, 1fr) auto;
}

.presentation-shell.is-presentation-title-slide .presentation-header {
  display: none;
}

.presentation-header,
.presentation-footer {
  position: relative;
  isolation: isolate;
  overflow: hidden;
  border-color: rgba(198, 219, 255, 0.2);
}

.presentation-header::before,
.presentation-footer::before {
  content: "";
  position: absolute;
  inset: 0;
  z-index: 0;
  pointer-events: none;
  background-image:
    linear-gradient(90deg, rgba(8, 18, 32, 0.82), rgba(8, 18, 32, 0.44) 48%, rgba(8, 18, 32, 0.82)),
    var(--presentation-network-pattern);
  background-repeat: no-repeat, repeat-x;
  background-size: 100% 100%, 360px 128px;
}

.presentation-header::before {
  background-position: center, right -24px top -14px;
}

.presentation-footer::before {
  background-position: center, left -38px bottom -44px;
}

.presentation-header > *,
.presentation-footer > * {
  position: relative;
  z-index: 1;
}

.presentation-header {
  display: grid;
  min-width: 0;
  padding: clamp(16px, 2.2vw, 28px) clamp(22px, 4vw, 54px) 14px;
  border-bottom: 1px solid rgba(198, 219, 255, 0.2);
}

.presentation-header__title {
  margin: 0;
  color: #f7fbff;
  font-size: clamp(2rem, 1.55rem + 1.6vw, 3.75rem);
  line-height: 1.05;
  overflow-wrap: anywhere;
}

.presentation-stage {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 360px), 680px));
  grid-auto-rows: max-content;
  gap: clamp(16px, 2vw, 28px);
  align-content: center;
  align-items: start;
  justify-content: center;
  min-height: 0;
  padding: clamp(18px, 3vw, 42px);
  overflow: auto;
  overscroll-behavior: contain;
}

.presentation-stage--single {
  grid-template-columns: minmax(0, min(100%, 980px));
}

.presentation-stage--slide-canvas {
  grid-template-columns: minmax(0, 1fr);
  grid-auto-rows: minmax(0, 1fr);
  align-content: center;
  align-items: center;
  justify-items: center;
  padding: clamp(12px, 2vw, 28px);
  overflow: hidden;
}

.presentation-stage--slide-canvas.presentation-stage--single {
  grid-template-columns: minmax(0, 1fr);
}

.presentation-stage--title-slide {
  grid-template-columns: minmax(0, 1fr);
  grid-auto-rows: minmax(0, 1fr);
  gap: 0;
  align-content: stretch;
  align-items: stretch;
  justify-content: stretch;
  justify-items: stretch;
  padding: 0;
  overflow: hidden;
}

.presentation-card,
.presentation-timer {
  display: grid;
  gap: 14px;
  min-width: 0;
  min-height: 0;
  max-height: min(100%, 68vh);
  max-height: min(100%, 68dvh);
  padding: clamp(18px, 2.4vw, 30px);
  border: 1px solid rgba(198, 219, 255, 0.18);
  border-radius: 8px;
  background: rgba(13, 25, 42, 0.84);
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.34);
  overflow: hidden;
}

.presentation-card--source {
  width: min(100%, 980px);
  max-height: min(72vh, 720px);
  max-height: min(72dvh, 720px);
  background: rgba(15, 29, 48, 0.92);
  justify-self: center;
  align-self: start;
}

.presentation-knowledge-host {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto auto;
  gap: 12px;
  min-width: 0;
  min-height: 0;
  padding: clamp(14px, 1.8vw, 20px);
  border: 1px solid rgba(113, 222, 192, 0.3);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(8, 24, 38, 0.96), rgba(8, 15, 29, 0.97)),
    rgba(8, 20, 34, 0.96);
  color: #edf7ff;
  box-shadow: 0 22px 62px rgba(0, 0, 0, 0.42);
  overflow: hidden;
  z-index: 10002;
}

.presentation-knowledge-host--right-dock {
  position: fixed;
  top: clamp(84px, 10vh, 132px);
  right: clamp(16px, 3vw, 40px);
  bottom: clamp(64px, 9vh, 96px);
  width: min(520px, 39vw);
}

.presentation-knowledge-host--overlay {
  position: fixed;
  top: clamp(76px, 9vh, 118px);
  right: clamp(18px, 4vw, 58px);
  bottom: clamp(66px, 9vh, 96px);
  left: clamp(18px, 4vw, 58px);
}

.presentation-knowledge-host--stage {
  position: relative;
  width: min(100%, 1120px);
  max-height: min(76vh, 820px);
  max-height: min(76dvh, 820px);
  justify-self: center;
  align-self: center;
}

.presentation-knowledge-host--full-width-overlay {
  position: fixed;
  inset: auto;
  width: 0;
  height: 0;
  min-width: 0;
  min-height: 0;
  padding: 0;
  border: 0;
  background: transparent;
  box-shadow: none;
  overflow: visible;
  pointer-events: none;
}

.presentation-knowledge-host--lesson-topic {
  width: min(100%, 760px);
}

.presentation-knowledge-host__header {
  display: grid;
  gap: 6px;
  min-width: 0;
}

.presentation-knowledge-host__heading {
  display: grid;
  gap: 5px;
  min-width: 0;
}

.presentation-knowledge-host__eyebrow,
.presentation-knowledge-host__meta,
.presentation-knowledge-host__fallback,
.presentation-lesson-net__empty {
  margin: 0;
  color: #aebfda;
  font-family: var(--font-ui);
  font-size: 0.82rem;
  line-height: 1.35;
  letter-spacing: 0;
}

.presentation-knowledge-host__eyebrow {
  color: #8fd8cc;
  font-weight: 900;
  text-transform: uppercase;
}

.presentation-knowledge-host__title {
  margin: 0;
  color: #ffffff;
  font-size: clamp(1.12rem, 0.98rem + 0.5vw, 1.65rem);
  line-height: 1.12;
  overflow-wrap: anywhere;
}

.presentation-knowledge-host__body,
.presentation-lesson-net__body {
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.presentation-knowledge-focus__trigger {
  display: grid;
  gap: 10px;
  align-content: start;
  min-width: 0;
}

.presentation-knowledge-focus__collapse {
  justify-self: start;
  margin-bottom: 8px;
}

.presentation-knowledge-host.is-presentation-knowledge-compact {
  grid-template-rows: auto auto auto;
}

.presentation-knowledge-net__viewer {
  height: 100%;
  min-height: 360px;
  border: 1px solid rgba(198, 219, 255, 0.14);
  border-radius: 8px;
  background: rgba(4, 10, 20, 0.72);
  overflow: hidden;
}

.presentation-knowledge-host--right-dock .presentation-knowledge-net__viewer {
  min-height: min(44vh, 420px);
  min-height: min(44dvh, 420px);
}

.presentation-knowledge-net__viewer .knowledge-net-page__tool,
.presentation-knowledge-net__viewer .knowledge-net-page__workspace,
.presentation-knowledge-net__viewer .knowledge-net-page__graph,
.presentation-knowledge-net__viewer .knowledge-net-viewer-stack {
  height: 100%;
  min-height: 0;
}

.presentation-knowledge-net__viewer .knowledge-net-page__relations {
  max-height: 34%;
  overflow: auto;
}

.presentation-knowledge-net__debug {
  display: block;
  max-height: 180px;
  min-width: 0;
  margin: 0;
  padding: 8px;
  border: 1px solid rgba(198, 219, 255, 0.18);
  border-radius: 6px;
  background: rgba(0, 0, 0, 0.38);
  color: #cfe4ff;
  font-size: 0.72rem;
  line-height: 1.35;
  overflow: auto;
  white-space: pre-wrap;
}

.presentation-knowledge-host__actions,
.presentation-lesson-net__concept-actions {
  display: flex;
  flex-wrap: wrap;
  gap: 8px;
  align-items: center;
}

.presentation-knowledge-host__actions {
  justify-content: flex-start;
}

.presentation-lesson-net__trigger {
  display: flex;
  flex-wrap: wrap;
  gap: 12px;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
}

.presentation-lesson-net__overlay[hidden] {
  display: none;
}

.presentation-lesson-net__overlay {
  position: fixed;
  z-index: 10008;
  inset: clamp(76px, 9vh, 112px) clamp(18px, 4vw, 58px) clamp(66px, 9vh, 96px);
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 12px;
  min-width: 0;
  min-height: 0;
  padding: clamp(14px, 1.8vw, 22px);
  border: 1px solid rgba(113, 222, 192, 0.34);
  border-radius: 8px;
  background: rgba(7, 15, 28, 0.97);
  box-shadow: 0 28px 80px rgba(0, 0, 0, 0.54);
  pointer-events: auto;
}

.presentation-lesson-net__overlay-header {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
  align-items: center;
  justify-content: space-between;
  min-width: 0;
}

.presentation-lesson-net__overlay-title {
  margin: 0;
  color: #ffffff;
  font-size: clamp(1rem, 0.92rem + 0.36vw, 1.32rem);
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.presentation-lesson-net__mount {
  min-width: 0;
  min-height: min(52vh, 560px);
  min-height: min(52dvh, 560px);
}

.presentation-lesson-net__mount .presentation-knowledge-net__viewer {
  height: 100%;
  min-height: min(46vh, 520px);
  min-height: min(46dvh, 520px);
}

.presentation-lesson-net__list {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 230px), 1fr));
  gap: 12px;
  min-width: 0;
  max-height: 100%;
  overflow: auto;
  padding-right: 4px;
}

.presentation-lesson-net__fallback {
  min-width: 0;
  min-height: 0;
  overflow: auto;
}

.presentation-lesson-net__concept {
  display: grid;
  gap: 10px;
  align-content: start;
  min-width: 0;
  padding: 14px;
  border: 1px solid rgba(198, 219, 255, 0.15);
  border-radius: 8px;
  background: rgba(12, 26, 43, 0.76);
}

.presentation-lesson-net__concept--core {
  border-color: rgba(113, 222, 192, 0.48);
  background:
    linear-gradient(180deg, rgba(17, 56, 57, 0.86), rgba(10, 25, 42, 0.82)),
    rgba(10, 25, 42, 0.82);
}

.presentation-lesson-net__concept--warning {
  border-color: rgba(255, 180, 92, 0.56);
  background:
    linear-gradient(180deg, rgba(72, 35, 20, 0.72), rgba(21, 28, 43, 0.82)),
    rgba(21, 28, 43, 0.82);
}

.presentation-lesson-net__concept--muted {
  opacity: 0.62;
}

.presentation-lesson-net__concept-title {
  margin: 0;
  color: #ffffff;
  font-size: clamp(1rem, 0.94rem + 0.18vw, 1.16rem);
  line-height: 1.18;
  overflow-wrap: anywhere;
}

.presentation-lesson-net__concept-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
  min-width: 0;
}

.presentation-lesson-net__role,
.presentation-lesson-net__range,
.presentation-lesson-net__slug {
  display: inline-flex;
  align-items: center;
  min-width: 0;
  padding: 4px 8px;
  border: 1px solid rgba(198, 219, 255, 0.18);
  border-radius: 8px;
  color: #d6e2f4;
  background: rgba(198, 219, 255, 0.07);
  font-family: var(--font-ui);
  font-size: 0.74rem;
  font-weight: 800;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.presentation-lesson-net__role--core {
  border-color: rgba(113, 222, 192, 0.46);
  color: #c6fff1;
  background: rgba(113, 222, 192, 0.12);
}

.presentation-lesson-net__role--warning {
  border-color: rgba(255, 180, 92, 0.52);
  color: #ffd8a6;
  background: rgba(255, 180, 92, 0.14);
}

.presentation-lesson-net__role--muted {
  border-color: rgba(198, 219, 255, 0.12);
  color: #9bacc6;
  background: rgba(198, 219, 255, 0.045);
}

.presentation-lesson-net__slug {
  border-color: rgba(113, 222, 192, 0.28);
  color: #bdf4ea;
  background: rgba(113, 222, 192, 0.08);
  font-family: var(--font-mono);
}

.knowledge-net-focus-section--lesson-info {
  border-color: rgba(113, 222, 192, 0.26);
}

.knowledge-net-lesson-info {
  display: grid;
  gap: 7px;
}

.knowledge-net-lesson-info__row,
.knowledge-net-lesson-info__definition,
.knowledge-net-lesson-info__related {
  margin: 0;
}

.knowledge-net-lesson-info__row strong {
  color: #c6fff1;
}

body.presentation-active .knowledge-net-inline-overlay--presentation-dock {
  position: fixed;
  z-index: 10012;
  top: var(--presentation-knowledge-preview-top, 88px);
  right: var(--presentation-knowledge-preview-right, 560px);
  left: var(--presentation-knowledge-preview-left, auto);
  width: var(--presentation-knowledge-preview-width, min(380px, calc(100vw - 24px)));
  max-height: var(--presentation-knowledge-preview-max-height, calc(100vh - 112px));
  margin: 0;
  overflow: auto;
}

body.presentation-active .knowledge-net-inline-overlay--presentation-dock .knowledge-net-inline-overlay__card {
  max-height: inherit;
  overflow: auto;
}

.presentation-card--task {
  border-color: rgba(113, 222, 192, 0.38);
  background: rgba(9, 35, 39, 0.93);
  width: min(100%, 920px);
  justify-self: center;
}

.presentation-card--note,
.presentation-card--moderation,
.presentation-card--moderation-track,
.presentation-card--pause,
.presentation-card--target-summary {
  max-width: 840px;
  justify-self: center;
}

.presentation-card--moderation-track {
  display: grid;
  gap: 14px;
  border-color: rgba(113, 222, 192, 0.32);
  background: rgba(10, 31, 38, 0.92);
}

.presentation-moderation-segment__meta {
  color: #bfe7df;
}

.presentation-moderation-segment__block {
  display: grid;
  gap: 5px;
}

.presentation-moderation-segment__block--pause {
  padding: 10px 12px;
  border: 1px solid rgba(252, 211, 77, 0.28);
  border-radius: 8px;
  background: rgba(63, 48, 14, 0.36);
}

.presentation-moderation-segment__label {
  margin: 0;
  color: #8fd8cc;
  font-family: var(--font-ui);
  font-size: 0.78rem;
  font-weight: 700;
  letter-spacing: 0;
  text-transform: uppercase;
}

.presentation-moderation-segment__concepts {
  display: grid;
  gap: 8px;
}

.presentation-moderation-segment__concept-list {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.presentation-moderation-segment__concept {
  display: inline-flex;
  align-items: center;
  max-width: 100%;
  padding: 5px 9px;
  border: 1px solid rgba(198, 219, 255, 0.18);
  border-radius: 999px;
  color: #e7f3ff;
  background: rgba(198, 219, 255, 0.08);
  font-family: var(--font-ui);
  font-size: 0.85rem;
  line-height: 1.2;
}

.presentation-moderation-segment__hint {
  color: #f0d48a;
}

.presentation-title-slide {
  position: relative;
  display: grid;
  isolation: isolate;
  align-items: end;
  justify-items: stretch;
  box-sizing: border-box;
  width: 100%;
  min-height: 100%;
  padding: 56px;
  background:
    radial-gradient(circle at 18% 18%, rgba(33, 180, 167, 0.2), transparent 34%),
    radial-gradient(circle at 82% 16%, rgba(93, 161, 255, 0.16), transparent 32%),
    linear-gradient(135deg, #081528 0%, #071222 42%, #030711 100%);
  color: #edf7ff;
  overflow: hidden;
}

.presentation-title-slide::before,
.presentation-title-slide::after {
  content: "";
  position: absolute;
  inset: 0;
  pointer-events: none;
}

.presentation-title-slide::before {
  z-index: -1;
  background:
    linear-gradient(180deg, rgba(2, 7, 16, 0.12) 0%, rgba(2, 7, 16, 0.3) 58%, rgba(2, 7, 16, 0.72) 100%),
    radial-gradient(circle at center, transparent 0%, rgba(2, 7, 16, 0.62) 100%);
}

.presentation-title-slide::after {
  z-index: 0;
  border: 1px solid rgba(198, 219, 255, 0.08);
  box-shadow: inset 0 0 120px rgba(0, 0, 0, 0.52);
}

.presentation-title-slide__background {
  position: absolute;
  inset: 0;
  z-index: -2;
  overflow: hidden;
}

.presentation-title-slide__network {
  display: block;
  width: 100%;
  height: 100%;
  opacity: 0.92;
}

.presentation-title-slide__edge {
  stroke: #c6dbff;
  stroke-linecap: round;
  vector-effect: non-scaling-stroke;
}

.presentation-title-slide__node {
  fill: #d7fff8;
  stroke: rgba(111, 232, 207, 0.72);
  stroke-width: 1.4;
  vector-effect: non-scaling-stroke;
}

.presentation-title-slide__panel {
  position: relative;
  z-index: 1;
  display: grid;
  gap: 18px;
  box-sizing: border-box;
  width: min(100%, 1120px);
  margin-inline: auto;
  padding: 34px 42px 32px;
  border: 1px solid rgba(198, 219, 255, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(7, 20, 38, 0.88), rgba(4, 11, 22, 0.78)),
    rgba(5, 13, 25, 0.78);
  box-shadow: 0 24px 72px rgba(0, 0, 0, 0.38);
  backdrop-filter: blur(12px);
}

.presentation-title-slide__panel--lower {
  align-self: end;
  margin-bottom: 20px;
}

.presentation-title-slide__panel--wide {
  max-width: 1180px;
}

.presentation-title-slide__panel--dark-blue {
  border-color: rgba(135, 196, 255, 0.2);
  background:
    linear-gradient(135deg, rgba(8, 24, 46, 0.91), rgba(4, 12, 25, 0.8)),
    rgba(5, 13, 25, 0.8);
}

.presentation-title-slide__title {
  margin: 0;
  max-width: 21ch;
  color: #ffffff;
  font-size: 4.55rem;
  line-height: 1.03;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.presentation-title-slide__divider {
  display: block;
  width: min(100%, 520px);
  height: 2px;
  border-radius: 999px;
  background: linear-gradient(90deg, #71dec0, rgba(198, 219, 255, 0.34), transparent);
}

.presentation-title-slide__kicker {
  margin: 0;
  color: #b6c8e4;
  font-family: var(--font-ui);
  font-size: 1.08rem;
  font-weight: 800;
  line-height: 1.35;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.presentation-shell.is-presentation-title-slide .presentation-footer {
  border-top-color: rgba(198, 219, 255, 0.12);
  background: rgba(3, 8, 16, 0.4);
  color: rgba(214, 226, 244, 0.78);
}

.presentation-shell.is-presentation-title-slide .presentation-footer::before {
  opacity: 0.38;
}

.presentation-card__title,
.presentation-timer__label {
  margin: 0;
  color: #ffffff;
  font-size: clamp(1.35rem, 1.15rem + 0.7vw, 2.05rem);
  line-height: 1.15;
}

.presentation-card__body,
.presentation-task__meta,
.presentation-task__prompt {
  margin: 0;
  color: #d6e2f4;
  font-size: clamp(1rem, 0.92rem + 0.25vw, 1.24rem);
  line-height: 1.55;
}

.presentation-card__meta,
.presentation-card__source {
  margin: 0;
  color: #aebfda;
  font-family: var(--font-ui);
  font-size: 0.95rem;
  line-height: 1.4;
}

.presentation-card__source {
  color: #d6e2f4;
}

.presentation-card__actions {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.presentation-surface {
  position: relative;
  isolation: isolate;
  --presentation-surface-scale: 1;
  --presentation-font-scale: 1;
  --presentation-gap-scale: 1;
  --presentation-gap-factor: 1;
  --presentation-content-scale: 1;
}

.presentation-surface[data-presentation-layout-overrides="true"] {
  scale: var(--presentation-surface-scale);
  transform-origin: center center;
}

.presentation-surface[data-presentation-layout-overrides="true"] [data-presentation-surface-content="true"] {
  transform: scale(var(--presentation-content-scale));
  transform-origin: center center;
}

.presentation-slide-canvas {
  position: relative;
  display: block;
  width: 100%;
  max-width: 100%;
  max-height: 100%;
  border: 1px solid rgba(198, 219, 255, 0.18);
  border-radius: 8px;
  background:
    linear-gradient(135deg, rgba(20, 38, 63, 0.9), rgba(9, 18, 32, 0.9)),
    rgba(13, 25, 42, 0.86);
  color: #eaf2ff;
  box-shadow: 0 18px 48px rgba(0, 0, 0, 0.34);
  container-type: inline-size;
  font-size: 16px;
  line-height: 1.26;
  letter-spacing: 0;
  overflow: hidden;
}

.presentation-slide-canvas--chrome-ppt-reference {
  aspect-ratio: 16 / 9;
  border-radius: 2px;
  background: #f7f8fb;
  color: #060b14;
}

.presentation-slide-canvas--chrome-ppt-reference::before {
  content: "";
  position: absolute;
  z-index: 2;
  top: 1.05cqi;
  left: 3.7cqi;
  right: 3.7cqi;
  height: 0.68cqi;
  min-height: 3px;
  background:
    linear-gradient(
      90deg,
      #183765 0 33%,
      transparent 33% 34%,
      #4a98bc 34% 66%,
      transparent 66% 67%,
      #9aa4ae 67% 100%
    );
}

.presentation-slide-canvas__content {
  position: relative;
  z-index: 1;
  display: grid;
  grid-template-rows: minmax(0, 1fr);
  gap: clamp(12px, 1.6cqi, 22px);
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  padding: clamp(18px, 2.6cqi, 34px);
  font-size: clamp(13px, 1.65cqi, 26px);
  overflow: hidden;
}

.presentation-slide-canvas__content--chrome-minimal {
  grid-template-rows: auto minmax(0, 1fr);
}

.presentation-slide-canvas__content--chrome-ppt-reference {
  grid-template-rows: auto minmax(0, 1fr);
  gap: 1.45cqi;
  padding: 2.65cqi 3.7cqi 1.45cqi;
  font-size: clamp(11px, 1.55cqi, 24px);
}

.presentation-slide-meta {
  display: flex;
  flex-wrap: wrap;
  gap: 0.55em 0.9em;
  min-width: 0;
  color: #aebfda;
  font-family: var(--font-ui);
  font-size: 0.62em;
  font-weight: 800;
  letter-spacing: 0;
  text-transform: uppercase;
}

.presentation-slide-titlebar {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 1.4cqi;
  align-items: center;
  min-height: 8.3cqi;
  padding: 1.6cqi 1.2cqi;
  background: #1d3a69;
  color: #ffffff;
  overflow: hidden;
}

.presentation-slide-titlebar__title {
  margin: 0;
  min-width: 0;
  font-family: var(--font-ui);
  font-size: 2.45em;
  font-weight: 500;
  line-height: 1.05;
  letter-spacing: 0;
  overflow-wrap: anywhere;
}

.presentation-slide-titlebar__section {
  margin: 0;
  color: rgba(255, 255, 255, 0.82);
  font-family: var(--font-ui);
  font-size: 0.78em;
  font-weight: 800;
  letter-spacing: 0;
  white-space: nowrap;
}

.presentation-slide-main {
  display: grid;
  grid-template-columns: minmax(0, 35%) minmax(0, 1fr);
  gap: clamp(18px, 4cqi, 54px);
  align-items: center;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.presentation-slide-canvas--chrome-ppt-reference .presentation-slide-main {
  grid-template-columns: minmax(0, 34%) minmax(0, 1fr);
  gap: 5cqi;
}

.presentation-slide-image {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 0.8em;
  align-self: stretch;
  min-width: 0;
  min-height: 0;
  height: 100%;
  margin: 0;
  overflow: hidden;
}

.presentation-slide-image img {
  align-self: end;
  justify-self: center;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  object-fit: contain;
  object-position: center bottom;
}

.presentation-slide-image__caption {
  display: grid;
  gap: 0.16em;
  min-width: 0;
  color: #aebfda;
  font-family: var(--font-ui);
  font-size: 0.5em;
  line-height: 1.22;
  overflow-wrap: anywhere;
}

.presentation-slide-canvas--chrome-ppt-reference .presentation-slide-image__caption {
  color: #111827;
  font-size: 0.43em;
}

.presentation-slide-image__caption strong,
.presentation-slide-image__caption span {
  display: block;
}

.presentation-slide-bullets {
  display: grid;
  gap: 0.44em;
  align-content: center;
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding-inline-start: 1.25em;
  color: #edf7ff;
  font-size: 1.02em;
  line-height: 1.32;
  overflow: hidden;
}

.presentation-slide-canvas--chrome-ppt-reference .presentation-slide-bullets {
  color: #060b14;
  font-size: 1.18em;
  line-height: 1.28;
}

.presentation-slide-bullet {
  min-width: 0;
  padding-left: 0.28em;
  overflow-wrap: anywhere;
}

.presentation-slide-bullet.is-presentation-slide-hidden {
  display: none;
}

.presentation-slide-bullet strong {
  color: #ffffff;
  font-weight: 800;
}

.presentation-slide-canvas--chrome-ppt-reference .presentation-slide-bullet strong {
  color: inherit;
}

.presentation-visual-text-slide {
  border-color: rgba(113, 222, 192, 0.22);
  background:
    linear-gradient(135deg, rgba(9, 28, 35, 0.94), rgba(7, 18, 34, 0.95)),
    rgba(7, 18, 34, 0.96);
}

.presentation-visual-text__content {
  padding: clamp(20px, 2.8cqi, 40px);
}

.presentation-visual-text__main {
  display: grid;
  grid-template-columns: minmax(0, 48%) minmax(0, 1fr);
  gap: clamp(22px, 4cqi, 58px);
  align-items: stretch;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.presentation-visual-text__visual {
  display: grid;
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 0.78em;
  align-self: stretch;
  min-width: 0;
  min-height: 0;
  height: 100%;
  margin: 0;
  overflow: hidden;
  opacity: 1;
  transform: none;
  transition: opacity 220ms ease, transform 220ms ease, visibility 220ms ease;
}

.presentation-visual-text__visual img {
  align-self: center;
  justify-self: center;
  width: 100%;
  height: 100%;
  min-width: 0;
  min-height: 0;
  object-fit: contain;
  object-position: center;
}

.presentation-visual-text__caption {
  display: grid;
  gap: 0.18em;
  min-width: 0;
  color: #aebfda;
  font-family: var(--font-ui);
  font-size: 0.5em;
  line-height: 1.24;
  overflow-wrap: anywhere;
}

.presentation-visual-text__caption strong,
.presentation-visual-text__caption span {
  display: block;
}

.presentation-visual-text__text {
  display: grid;
  grid-auto-rows: max-content;
  gap: 0.82em;
  align-content: center;
  min-width: 0;
  min-height: 0;
  color: #edf7ff;
  overflow: hidden;
}

.presentation-visual-text__block {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.68em;
  align-items: start;
  min-width: 0;
  opacity: 1;
  transform: none;
  transition: opacity 220ms ease, transform 220ms ease, visibility 220ms ease;
}

.presentation-visual-text__number {
  display: inline-grid;
  place-items: center;
  width: 1.9em;
  height: 1.9em;
  border: 1px solid rgba(113, 222, 192, 0.5);
  border-radius: 999px;
  background: rgba(113, 222, 192, 0.12);
  color: #9ff2dc;
  font-family: var(--font-ui);
  font-size: 0.7em;
  font-weight: 800;
  line-height: 1;
}

.presentation-visual-text__copy {
  display: grid;
  gap: 0.24em;
  min-width: 0;
}

.presentation-visual-text__heading,
.presentation-visual-text__body {
  margin: 0;
  min-width: 0;
  overflow-wrap: anywhere;
}

.presentation-visual-text__heading {
  color: #ffffff;
  font-size: 1.02em;
  line-height: 1.16;
}

.presentation-visual-text__body {
  color: #dce9f8;
  font-size: 1.02em;
  line-height: 1.36;
}

.presentation-visual-text__visual.is-presentation-visual-text-hidden,
.presentation-visual-text__block.is-presentation-text-block-hidden {
  visibility: hidden;
  opacity: 0;
  transform: translateY(0.24em);
}

.presentation-visual-text__block.is-presentation-text-block-revealed {
  opacity: 1;
  transform: none;
}

.presentation-task-slide {
  border-color: rgba(113, 222, 192, 0.22);
  background:
    linear-gradient(135deg, rgba(12, 32, 46, 0.96), rgba(7, 18, 34, 0.96)),
    rgba(7, 18, 34, 0.96);
}

.presentation-task-slide__content {
  grid-template-rows: minmax(0, 1fr);
  gap: clamp(14px, 2cqi, 28px);
  padding: clamp(20px, 3cqi, 42px);
}

.presentation-task-slide__layout {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(240px, 0.72fr);
  gap: clamp(16px, 2.8cqi, 42px);
  align-items: stretch;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.presentation-task-slide__tasks-card,
.presentation-task-slide__timer-panel {
  min-width: 0;
  min-height: 0;
  border: 1px solid rgba(198, 219, 255, 0.16);
  border-radius: 8px;
  overflow: hidden;
}

.presentation-task-slide__tasks-card {
  display: grid;
  align-content: center;
  padding: clamp(16px, 2.4cqi, 34px);
  background: rgba(9, 22, 37, 0.74);
}

.presentation-task-slide__tasks {
  display: grid;
  gap: clamp(10px, 1.25cqi, 18px);
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0;
  list-style: none;
  overflow: hidden;
}

.presentation-task-slide__task {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.85em;
  align-items: start;
  min-width: 0;
  padding: 0.92em 1em;
  border: 1px solid rgba(113, 222, 192, 0.18);
  border-radius: 8px;
  background: rgba(5, 15, 26, 0.48);
}

.presentation-task-slide__task-label {
  color: #8df0d7;
  font-family: var(--font-ui);
  font-size: 0.82em;
  font-weight: 900;
  line-height: 1.25;
}

.presentation-task-slide__task-text {
  margin: 0;
  min-width: 0;
  color: #e7f1ff;
  font-size: 1.08em;
  line-height: 1.34;
  overflow-wrap: anywhere;
}

.presentation-task-slide__timer-panel {
  display: grid;
  place-items: center;
  padding: clamp(16px, 2.2cqi, 30px);
  background: rgba(4, 12, 22, 0.62);
}

.presentation-task-slide__timer-slot {
  display: grid;
  place-items: center;
  width: 100%;
  min-width: 0;
  min-height: 0;
}

.presentation-task-slide__timer-slot .presentation-timer {
  width: 100%;
  max-width: min(100%, 440px);
  max-height: none;
  justify-items: center;
  padding: clamp(16px, 2.35cqi, 32px);
  border-color: rgba(113, 222, 192, 0.24);
  background: rgba(8, 20, 34, 0.82);
  text-align: center;
}

.presentation-task-slide__timer-slot .presentation-timer__value {
  font-size: clamp(3.4rem, 10.5cqi, 8rem);
}

.presentation-task-slide__timer-slot .presentation-timer__label {
  color: #bcd0e8;
  font-size: 0.88em;
}

.presentation-task-slide__timer-slot .presentation-timer__controls,
.presentation-task-slide__timer-slot .presentation-timer__adjust,
.presentation-task-slide__timer-slot .presentation-timer__presets {
  justify-content: center;
}

@container (max-width: 720px) {
  .presentation-visual-text__main {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 48%) minmax(0, 1fr);
    gap: 1.25em;
  }

  .presentation-visual-text__text {
    align-content: start;
  }

  .presentation-task-slide__layout {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) auto;
  }

  .presentation-task-slide__timer-slot .presentation-timer__value {
    font-size: clamp(2.5rem, 13cqi, 4.4rem);
  }
}

.presentation-code-walkthrough {
  border-color: rgba(113, 222, 192, 0.2);
  background:
    linear-gradient(135deg, rgba(9, 28, 35, 0.94), rgba(7, 18, 34, 0.95)),
    rgba(7, 18, 34, 0.96);
}

.presentation-code-walkthrough__content {
  grid-template-rows: minmax(0, 1fr) auto;
  gap: 0.8em;
  padding: 1.35em;
  font-size: 16px;
}

.presentation-code-walkthrough__body {
  display: grid;
  grid-template-columns: minmax(0, 1.14fr) minmax(15em, 0.86fr);
  gap: 0.9em;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.presentation-code-walkthrough--code-left-callouts-right .presentation-code-walkthrough__content {
  grid-template-rows: minmax(0, 1fr);
  gap: 0.7em;
}

.presentation-code-walkthrough--code-left-callouts-right .presentation-code-walkthrough__body {
  grid-template-columns: minmax(0, 1.18fr) minmax(14em, 0.82fr);
  gap: 0.82em;
}

.presentation-code-walkthrough__code-panel,
.presentation-code-walkthrough__callouts,
.presentation-code-walkthrough__console,
.presentation-code-walkthrough__flow,
.presentation-code-walkthrough__intro {
  min-width: 0;
  min-height: 0;
  border: 1px solid rgba(198, 219, 255, 0.13);
  border-radius: 8px;
  background: rgba(5, 13, 24, 0.56);
  overflow: hidden;
}

.presentation-code-walkthrough__code-panel {
  display: grid;
}

.presentation-code-walkthrough__code-block {
  min-width: 0;
  min-height: 0;
  margin: 0;
  padding: 0.85em 0.95em;
  color: #f7fbff;
  font-family: "Cascadia Code", "Consolas", "Courier New", monospace;
  font-size: 0.74em;
  line-height: 1.48;
  overflow: hidden;
}

.presentation-code-walkthrough--code-left-callouts-right .presentation-code-walkthrough__code-block {
  font-size: 0.82em;
  line-height: 1.44;
}

.presentation-code-walkthrough__code {
  display: grid;
  gap: 0.16em;
  min-width: 0;
}

.presentation-code-walkthrough__code-line {
  display: grid;
  grid-template-columns: 2.2em minmax(0, 1fr);
  gap: 0.75em;
  min-width: 0;
}

.presentation-code-walkthrough__line-number {
  color: rgba(174, 191, 218, 0.58);
  text-align: right;
  user-select: none;
}

.presentation-code-walkthrough__line-code {
  min-width: 0;
  white-space: pre;
}

.presentation-code-walkthrough__line-code .tok-keyword,
.presentation-code-walkthrough__line-code .code-editor__token--keyword {
  color: #7ec3ff;
  font-weight: 700;
}

.presentation-code-walkthrough__line-code .tok-type,
.presentation-code-walkthrough__line-code .code-editor__token--type {
  color: #75d5ff;
  font-weight: 700;
}

.presentation-code-walkthrough__line-code .tok-method,
.presentation-code-walkthrough__line-code .code-editor__token--method {
  color: #ffd38a;
}

.presentation-code-walkthrough__line-code .tok-string,
.presentation-code-walkthrough__line-code .code-editor__token--string {
  color: #b7e88d;
}

.presentation-code-walkthrough__line-code .tok-comment,
.presentation-code-walkthrough__line-code .code-editor__token--comment {
  color: #8fa4c7;
  font-style: italic;
}

.presentation-code-walkthrough__line-code .tok-number,
.presentation-code-walkthrough__line-code .code-editor__token--number,
.presentation-code-walkthrough__line-code .tok-literal,
.presentation-code-walkthrough__line-code .code-editor__token--literal {
  color: #ffc987;
}

.presentation-code-walkthrough__code-segment {
  border-radius: 0.22em;
  transition: background-color 180ms ease, box-shadow 180ms ease, color 180ms ease;
}

.presentation-code-walkthrough__code-segment.is-walkthrough-highlighted {
  color: #ffffff;
  background: rgba(113, 222, 192, 0.18);
  box-shadow: 0 0 0 0.16em rgba(113, 222, 192, 0.1);
}

.presentation-code-walkthrough__code-segment.is-walkthrough-highlighted .presentation-code-walkthrough__code-segment.is-walkthrough-highlighted {
  background: rgba(255, 214, 102, 0.22);
  box-shadow: 0 0 0 0.14em rgba(255, 214, 102, 0.1);
}

.presentation-code-walkthrough__code-segment.is-walkthrough-highlighted .code-editor__token,
.presentation-code-table-mapping .presentation-code-walkthrough__code-segment.is-code-table-mapping-highlighted .code-editor__token {
  color: inherit;
}

.presentation-code-walkthrough__callouts {
  display: grid;
  align-content: start;
  gap: 0.52em;
  padding: 0.62em;
  background: rgba(8, 22, 36, 0.5);
}

.presentation-code-walkthrough__callout {
  display: grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.58em;
  align-items: start;
  min-width: 0;
  padding: 0.58em;
  border: 1px solid rgba(198, 219, 255, 0.12);
  border-left: 0.25em solid rgba(113, 222, 192, 0.46);
  border-radius: 8px;
  background: rgba(9, 24, 38, 0.78);
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.presentation-code-walkthrough__callout--without-number {
  grid-template-columns: minmax(0, 1fr);
}

.presentation-code-walkthrough__callout.is-walkthrough-active,
.presentation-code-walkthrough__callout.is-walkthrough-visible {
  border-left-color: #71dec0;
}

.presentation-code-walkthrough__callout-number {
  display: inline-grid;
  place-items: center;
  width: 1.72em;
  height: 1.72em;
  border-radius: 999px;
  color: #061522;
  background: #71dec0;
  font-family: var(--font-ui);
  font-size: 0.72em;
  font-weight: 900;
  line-height: 1;
}

.presentation-code-walkthrough__callout-content {
  display: grid;
  gap: 0.24em;
  min-width: 0;
}

.presentation-code-walkthrough__callout-title {
  margin: 0;
  color: #f8fbff;
  font-family: var(--font-ui);
  font-size: 0.7em;
  font-weight: 900;
  line-height: 1.18;
  overflow-wrap: anywhere;
}

.presentation-code-walkthrough__callout-text,
.presentation-code-walkthrough__console-label,
.presentation-code-walkthrough__flow-text,
.presentation-code-walkthrough__intro-text {
  margin: 0;
  color: #d6e2f4;
  font-size: 0.66em;
  line-height: 1.34;
  overflow-wrap: anywhere;
}

.presentation-code-walkthrough--code-left-callouts-right .presentation-code-walkthrough__callout-text {
  font-size: 0.72em;
  line-height: 1.38;
}

.presentation-code-walkthrough--code-left-callouts-right .presentation-code-walkthrough__callout-title {
  font-size: 0.74em;
}

.presentation-code-walkthrough--code-left-callouts-right .presentation-code-walkthrough__callout-items {
  font-size: 0.62em;
  line-height: 1.26;
}

.presentation-code-walkthrough__callout-text strong {
  color: #f8fbff;
  font-weight: 900;
}

.presentation-code-walkthrough__callout-items {
  display: grid;
  gap: 0.16em;
  margin: 0;
  padding-left: 1.05em;
  color: #c7d6e8;
  font-size: 0.58em;
  line-height: 1.22;
  overflow-wrap: anywhere;
}

.presentation-code-walkthrough__callout-item {
  margin: 0;
}

.presentation-code-walkthrough__callout-item strong {
  color: #f8fbff;
  font-weight: 900;
}

.presentation-code-walkthrough__lower {
  display: grid;
  grid-template-columns: minmax(13em, 0.72fr) minmax(0, 1.28fr);
  grid-template-rows: auto auto;
  gap: 0.72em;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.presentation-code-walkthrough__console {
  display: grid;
  gap: 0.38em;
  align-content: start;
  grid-row: 1 / span 2;
  padding: 0.68em;
  border-color: rgba(113, 222, 192, 0.18);
  background: #030913;
}

.presentation-code-walkthrough__console-label {
  color: #8fa3c1;
  font-family: var(--font-ui);
  font-weight: 800;
}

.presentation-code-walkthrough__console-output {
  min-width: 0;
  margin: 0;
  padding: 0.62em 0.72em;
  border-radius: 6px;
  color: #d7fff8;
  background: rgba(113, 222, 192, 0.1);
  font-family: "Cascadia Code", "Consolas", "Courier New", monospace;
  font-size: 0.8em;
  line-height: 1.35;
  white-space: pre-wrap;
  overflow: hidden;
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
}

.presentation-code-walkthrough__flow {
  display: grid;
  grid-template-columns: repeat(5, minmax(0, 1fr));
  gap: 0.46em;
  padding: 0.58em;
  background: rgba(12, 28, 44, 0.62);
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
}

.presentation-code-walkthrough__flow-card {
  position: relative;
  display: grid;
  gap: 0.16em;
  min-width: 0;
  padding: 0.42em;
  border-radius: 7px;
  background: rgba(198, 219, 255, 0.08);
}

.presentation-code-walkthrough__flow-card + .presentation-code-walkthrough__flow-card::before {
  content: ">";
  position: absolute;
  top: 50%;
  left: -0.48em;
  color: #71dec0;
  font-family: var(--font-ui);
  font-size: 0.74em;
  font-weight: 900;
  transform: translateY(-50%);
}

.presentation-code-walkthrough__flow-title {
  margin: 0;
  color: #f7fbff;
  font-size: 0.58em;
  line-height: 1.16;
  overflow-wrap: anywhere;
}

.presentation-code-walkthrough__flow-text {
  color: #aebfda;
  font-size: 0.48em;
  line-height: 1.22;
}

.presentation-code-walkthrough__intro {
  padding: 0.58em 0.68em;
  border-color: rgba(255, 214, 102, 0.22);
  background: rgba(55, 42, 15, 0.38);
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
}

.presentation-code-walkthrough__intro-text {
  color: #fff1c9;
  font-size: 0.62em;
}

.presentation-code-walkthrough [data-walkthrough-reveal],
.presentation-code-walkthrough__code-panel {
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
}

.presentation-code-walkthrough .is-walkthrough-hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(0.35em);
}

.presentation-code-walkthrough .is-walkthrough-visible {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

.presentation-code-struktogramm {
  border-color: rgba(113, 222, 192, 0.22);
  background:
    linear-gradient(135deg, rgba(8, 28, 32, 0.94), rgba(10, 18, 31, 0.96)),
    rgba(7, 18, 34, 0.96);
}

.presentation-code-struktogramm__content {
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 0.72em;
  padding: 1.05em;
  font-size: 16px;
}

.presentation-code-struktogramm__header {
  min-width: 0;
}

.presentation-code-struktogramm__title {
  margin: 0;
  color: #f7fbff;
  font-size: 1.08em;
  line-height: 1.15;
  letter-spacing: 0;
}

.presentation-code-struktogramm__body {
  display: grid;
  grid-template-columns: minmax(0, 0.96fr) minmax(0, 1.04fr);
  gap: 0.82em;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.presentation-code-struktogramm__code-panel {
  min-width: 0;
  min-height: 0;
}

.presentation-code-struktogramm__code-panel .presentation-code-walkthrough__code-block {
  font-size: 0.66em;
  line-height: 1.34;
  overflow: auto;
}

.presentation-code-struktogramm__strukto-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  border: 1px solid rgba(198, 219, 255, 0.13);
  border-radius: 8px;
  background: rgba(5, 13, 24, 0.56);
  overflow: hidden;
}

.presentation-code-struktogramm__panel-title {
  margin: 0;
  padding: 0.58em 0.72em;
  border-bottom: 1px solid rgba(198, 219, 255, 0.12);
  color: rgba(223, 235, 255, 0.86);
  font-size: 0.66em;
  line-height: 1.2;
  letter-spacing: 0;
}

.presentation-code-struktogramm__strukto-canvas {
  min-width: 0;
  min-height: 0;
  height: 100%;
  padding: 0.7em;
  border: 0;
  background: rgba(4, 10, 20, 0.42);
}

.presentation-code-struktogramm .strukto-block__header {
  min-height: 2.18em;
  padding: 0.42em 0.56em;
}

.presentation-code-struktogramm .strukto-block__text {
  font-size: 0.76em;
  line-height: 1.28;
}

.presentation-code-struktogramm .strukto-branch__title {
  min-height: 2em;
  padding: 0.34em 0.46em;
  font-size: 0.64em;
  line-height: 1.2;
}

.presentation-code-struktogramm .strukto-block--placeholder,
.presentation-code-struktogramm .strukto-block--placeholder .strukto-block__header {
  min-height: 2.3em;
}

.presentation-code-struktogramm__status {
  margin: 0;
  padding: 0.75em;
  color: rgba(223, 235, 255, 0.78);
  font-size: 0.72em;
  line-height: 1.35;
}

.presentation-code-struktogramm__status--danger {
  color: #ffd5d5;
}

.presentation-code-struktogramm__text-blocks {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 0.52em;
  min-width: 0;
}

.presentation-code-struktogramm__text-block {
  min-width: 0;
  border: 1px solid rgba(198, 219, 255, 0.13);
  border-radius: 8px;
  background: rgba(5, 13, 24, 0.56);
  padding: 0.52em 0.62em;
}

.presentation-code-struktogramm__text-block.is-code-struktogramm-revealed {
  border-color: rgba(113, 222, 192, 0.34);
  box-shadow: 0 0.58em 1.6em rgba(7, 18, 34, 0.18);
}

.presentation-code-struktogramm__text-heading,
.presentation-code-struktogramm__text-body {
  margin: 0;
  letter-spacing: 0;
}

.presentation-code-struktogramm__text-heading {
  color: #f7fbff;
  font-size: 0.62em;
  line-height: 1.16;
}

.presentation-code-struktogramm__text-body {
  color: rgba(223, 235, 255, 0.82);
  font-size: 0.58em;
  line-height: 1.28;
}

.presentation-code-struktogramm__text-heading + .presentation-code-struktogramm__text-body {
  margin-top: 0.28em;
}

.presentation-code-struktogramm .is-code-struktogramm-hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(0.24em);
}

.presentation-code-struktogramm .is-code-struktogramm-visible {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

.presentation-code-table-mapping {
  border-color: rgba(255, 121, 121, 0.2);
  background:
    linear-gradient(135deg, rgba(12, 28, 42, 0.96), rgba(7, 17, 31, 0.97)),
    rgba(7, 18, 34, 0.96);
}

.presentation-code-table-mapping__content {
  z-index: 2;
  grid-template-rows: minmax(0, 1fr);
  gap: 0.72em;
  padding: 1.08em;
  font-size: 16px;
}

.presentation-code-table-mapping__body {
  display: grid;
  grid-template-columns: minmax(0, 1.08fr) minmax(15em, 0.92fr);
  gap: 0.78em;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.presentation-code-table-mapping__code-panel,
.presentation-code-table-mapping__right,
.presentation-code-table-mapping__table-card,
.presentation-code-table-mapping__text-block {
  min-width: 0;
  min-height: 0;
  border: 1px solid rgba(198, 219, 255, 0.13);
  border-radius: 8px;
  background: rgba(5, 13, 24, 0.58);
  overflow: hidden;
}

.presentation-code-table-mapping__code-panel {
  display: grid;
}

.presentation-code-table-mapping__code-block {
  padding: 0.78em 0.9em;
  font-size: 0.72em;
  line-height: 1.42;
}

.presentation-code-table-mapping .presentation-code-walkthrough__code {
  gap: 0.12em;
}

.presentation-code-table-mapping .presentation-code-walkthrough__code-line {
  grid-template-columns: 2em minmax(0, 1fr);
  gap: 0.58em;
}

.presentation-code-table-mapping .presentation-code-walkthrough__line-code {
  overflow: hidden;
}

.presentation-code-table-mapping__right {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 0.38em;
  padding: 0.52em;
  background: rgba(8, 22, 36, 0.5);
}

.presentation-code-table-mapping__text-blocks {
  display: grid;
  gap: 0.36em;
  align-content: start;
  min-width: 0;
  min-height: 0;
}

.presentation-code-table-mapping__text-block {
  display: grid;
  gap: 0.16em;
  padding: 0.48em 0.54em;
  border-left: 0.22em solid rgba(255, 214, 102, 0.5);
  background: rgba(14, 27, 42, 0.76);
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.presentation-code-table-mapping__text-block.is-code-table-mapping-revealed {
  border-left-color: #ffd666;
  background: rgba(35, 31, 19, 0.58);
}

.presentation-code-table-mapping__text-heading {
  margin: 0;
  color: #ffe9ad;
  font-size: 0.66em;
  font-weight: 900;
  line-height: 1.2;
  overflow-wrap: anywhere;
}

.presentation-code-table-mapping__text-body {
  margin: 0;
  color: #d6e2f4;
  font-size: 0.58em;
  line-height: 1.28;
  overflow-wrap: anywhere;
}

.presentation-code-table-mapping__text-body strong {
  color: #f8fbff;
  font-weight: 900;
}

.presentation-code-table-mapping__table-card {
  display: grid;
  align-content: start;
  padding: 0.28em;
  border-color: rgba(255, 121, 121, 0.18);
  background: rgba(5, 13, 24, 0.64);
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
}

.presentation-code-table-mapping__table {
  width: 100%;
  height: auto;
  min-width: 0;
  border-collapse: collapse;
  table-layout: fixed;
  color: #eaf2ff;
  font-size: 0.56em;
  line-height: 1.1;
}

.presentation-code-table-mapping__table th,
.presentation-code-table-mapping__table td {
  min-width: 0;
  padding: 0.24em 0.34em;
  border: 1px solid rgba(198, 219, 255, 0.13);
  overflow-wrap: anywhere;
  vertical-align: top;
}

.presentation-code-table-mapping__table th {
  color: #c6fff1;
  background: rgba(113, 222, 192, 0.1);
  font-weight: 900;
  text-align: left;
}

.presentation-code-table-mapping__table td {
  background: rgba(198, 219, 255, 0.045);
}

.presentation-code-table-mapping__table-row.is-code-table-mapping-highlighted td {
  color: #fff9ed;
  border-color: rgba(255, 121, 121, 0.44);
  background: rgba(255, 121, 121, 0.16);
  box-shadow: inset 0.18em 0 0 rgba(255, 121, 121, 0.65);
}

.presentation-code-table-mapping .presentation-code-walkthrough__code-segment.is-code-table-mapping-highlighted {
  color: #ffffff;
  background: rgba(255, 121, 121, 0.2);
  box-shadow: 0 0 0 0.16em rgba(255, 121, 121, 0.11);
}

.presentation-code-table-mapping__mapping-layer {
  position: absolute;
  inset: 0;
  z-index: 4;
  width: 100%;
  height: 100%;
  pointer-events: none;
  overflow: visible;
  transition: opacity 180ms ease, visibility 180ms ease;
}

.presentation-code-table-mapping__mapping-line {
  fill: none;
  stroke: rgba(255, 121, 121, 0.76);
  stroke-width: 2.4;
  stroke-linecap: round;
  stroke-linejoin: round;
  vector-effect: non-scaling-stroke;
}

.presentation-code-table-mapping__mapping-dot {
  fill: rgba(255, 121, 121, 0.86);
  stroke: rgba(8, 17, 31, 0.86);
  stroke-width: 1.2;
  vector-effect: non-scaling-stroke;
}

.presentation-code-table-mapping .is-code-table-mapping-hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(0.24em);
}

.presentation-code-table-mapping .is-code-table-mapping-visible {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

.presentation-code-table-mapping__mapping-layer.is-code-table-mapping-hidden,
.presentation-code-table-mapping__mapping-layer.is-code-table-mapping-visible {
  transform: none;
}

.presentation-table-text-code {
  border-color: rgba(113, 222, 192, 0.22);
  background:
    linear-gradient(135deg, rgba(9, 28, 35, 0.96), rgba(8, 17, 31, 0.97)),
    rgba(7, 18, 34, 0.96);
}

.presentation-table-text-code__content {
  z-index: 2;
  grid-template-rows: minmax(0, 1fr);
  gap: 0.72em;
  padding: 1.06em;
  font-size: 16px;
}

.presentation-table-text-code__layout {
  display: grid;
  grid-template-columns: minmax(18em, 1.14fr) minmax(14em, 0.86fr);
  gap: 0.82em;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.presentation-table-text-code__table-panel,
.presentation-table-text-code__right,
.presentation-table-text-code__code-panel {
  min-width: 0;
  min-height: 0;
  border: 1px solid rgba(198, 219, 255, 0.13);
  border-radius: 8px;
  background: rgba(5, 13, 24, 0.58);
  overflow: hidden;
}

.presentation-table-text-code__table-panel {
  display: grid;
  align-content: stretch;
  padding: 0.5em;
  border-color: rgba(113, 222, 192, 0.2);
  background:
    linear-gradient(180deg, rgba(15, 36, 44, 0.72), rgba(5, 13, 24, 0.7)),
    rgba(5, 13, 24, 0.64);
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
}

.presentation-table-text-code__table {
  width: 100%;
  height: 100%;
  min-width: 0;
  border-collapse: collapse;
  table-layout: fixed;
  color: #eaf2ff;
  font-size: 0.68em;
  line-height: 1.24;
}

.presentation-table-text-code__table th,
.presentation-table-text-code__table td {
  min-width: 0;
  padding: 0.52em 0.58em;
  border: 1px solid rgba(198, 219, 255, 0.13);
  overflow-wrap: anywhere;
  vertical-align: top;
}

.presentation-table-text-code__table th {
  color: #c6fff1;
  background: rgba(113, 222, 192, 0.1);
  font-weight: 900;
  text-align: left;
}

.presentation-table-text-code__table td {
  background: rgba(198, 219, 255, 0.045);
}

.presentation-table-text-code__right {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 0.56em;
  padding: 0.58em;
  background: rgba(8, 22, 36, 0.5);
}

.presentation-table-text-code__text-blocks {
  display: grid;
  gap: 0.48em;
  align-content: start;
  min-width: 0;
  min-height: 0;
}

.presentation-table-text-code__text-block {
  display: grid;
  gap: 0.18em;
  min-width: 0;
  padding: 0.52em 0.56em 0.52em 0.72em;
  border-left: 0.24em solid rgba(255, 214, 102, 0.48);
  background: rgba(14, 27, 42, 0.68);
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.presentation-table-text-code__text-block.is-table-text-code-revealed {
  border-left-color: #ffd666;
  background: rgba(35, 31, 19, 0.52);
}

.presentation-table-text-code__text-heading {
  margin: 0;
  color: #ffe9ad;
  font-size: 0.7em;
  font-weight: 900;
  line-height: 1.22;
  overflow-wrap: anywhere;
}

.presentation-table-text-code__text-body {
  margin: 0;
  color: #dce8f7;
  font-size: 0.68em;
  line-height: 1.35;
  overflow-wrap: anywhere;
}

.presentation-table-text-code__text-body strong {
  color: #f8fbff;
  font-weight: 900;
}

.presentation-table-text-code__code-panel {
  display: grid;
  border-color: rgba(255, 214, 102, 0.18);
  background:
    linear-gradient(180deg, rgba(18, 25, 39, 0.72), rgba(5, 13, 24, 0.74)),
    rgba(5, 13, 24, 0.66);
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease;
}

.presentation-table-text-code__code-block {
  padding: 0.66em 0.74em;
  font-size: 0.58em;
  line-height: 1.22;
}

.presentation-table-text-code .presentation-code-walkthrough__code {
  gap: 0.1em;
}

.presentation-table-text-code .presentation-code-walkthrough__code-line {
  grid-template-columns: 2em minmax(0, 1fr);
  gap: 0.54em;
}

.presentation-table-text-code .presentation-code-walkthrough__line-code {
  overflow: hidden;
}

.presentation-table-text-code .is-table-text-code-hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(0.24em);
}

.presentation-table-text-code .is-table-text-code-visible {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

.presentation-solution-code-slide {
  border-color: rgba(113, 222, 192, 0.22);
  background:
    linear-gradient(135deg, rgba(8, 24, 34, 0.96), rgba(8, 17, 31, 0.97)),
    rgba(7, 18, 34, 0.96);
}

.presentation-solution-code__content {
  grid-template-rows: minmax(0, 1fr);
  gap: 0.38em;
  padding: 0.66em 0.78em 0.62em;
  font-size: 16px;
}

.presentation-solution-code__workspace {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  gap: 0.34em;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.presentation-solution-code__callouts {
  grid-template-columns: repeat(4, minmax(0, 1fr));
  gap: 0.3em;
  padding: 0;
  border: 0;
  background: transparent;
}

.presentation-solution-code__callout {
  gap: 0.42em;
  min-height: 2.9em;
  padding: 0.32em 0.38em;
  border-left-width: 0.22em;
  background: rgba(9, 24, 38, 0.82);
}

.presentation-solution-code__callout .presentation-code-walkthrough__callout-number {
  width: 1.62em;
  height: 1.62em;
  font-size: 0.82em;
  box-shadow: 0 0 0 1px rgba(255, 255, 255, 0.16);
}

.presentation-solution-code__callout .presentation-code-walkthrough__callout-text {
  color: #e8f2ff;
  font-size: 0.68em;
  line-height: 1.16;
}

.presentation-solution-code__callout .presentation-code-walkthrough__callout-title {
  font-size: 0.68em;
  line-height: 1.12;
}

.presentation-solution-code__callout .presentation-code-walkthrough__callout-items {
  font-size: 0.56em;
  line-height: 1.14;
}

.presentation-solution-code__panels {
  display: grid;
  grid-template-columns: minmax(0, 0.76fr) minmax(0, 1.24fr);
  gap: 0.44em;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.presentation-solution-code__panel {
  grid-template-rows: auto minmax(0, 1fr);
  --solution-code-font-size: clamp(0.72em, 0.9cqi, 0.88em);
  --solution-code-line-height: 1.18;
  border-color: rgba(198, 219, 255, 0.16);
  background: rgba(3, 9, 19, 0.72);
  transition: opacity 180ms ease, transform 180ms ease, visibility 180ms ease, border-color 180ms ease, background-color 180ms ease;
}

.presentation-solution-code__panel[data-code-panel-index="1"] {
  --solution-code-font-size: clamp(0.86em, 1.08cqi, 1.06em);
  --solution-code-line-height: 1.22;
}

.presentation-solution-code__panel[data-code-panel-index="2"] {
  --solution-code-font-size: clamp(0.72em, 0.86cqi, 0.86em);
  --solution-code-line-height: 1.17;
  border-color: rgba(113, 222, 192, 0.24);
  background: rgba(5, 18, 25, 0.8);
}

.presentation-solution-code__panel-title {
  margin: 0;
  padding: 0.34em 0.55em 0.24em;
  color: #c6fff1;
  font-family: var(--font-ui);
  font-size: 0.52em;
  font-weight: 900;
  line-height: 1.2;
  letter-spacing: 0;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.presentation-solution-code__code-block {
  align-content: start;
  padding: 0.48em 0.56em 0.52em;
  font-size: var(--solution-code-font-size);
  line-height: var(--solution-code-line-height);
}

.presentation-solution-code__panel[data-code-panel-index="1"] .presentation-solution-code__code-block {
  padding-inline: 0.62em;
}

.presentation-solution-code__panel[data-code-panel-index="2"] .presentation-solution-code__code-block {
  padding-inline: 0.52em;
}

.presentation-solution-code__code {
  gap: 0.06em;
}

.presentation-solution-code-slide .presentation-code-walkthrough__code-line {
  grid-template-columns: 1.7em minmax(0, 1fr);
  gap: 0.42em;
}

.presentation-solution-code-slide .presentation-code-walkthrough__line-code {
  overflow: hidden;
  text-overflow: clip;
}

.presentation-solution-code-slide .presentation-code-walkthrough__code-segment.is-walkthrough-highlighted {
  background: rgba(113, 222, 192, 0.2);
  box-shadow: 0 0 0 0.14em rgba(113, 222, 192, 0.11);
}

.presentation-solution-code-slide .is-walkthrough-hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(0.28em);
}

.presentation-solution-code-slide .is-walkthrough-visible {
  visibility: visible;
  opacity: 1;
  transform: translateY(0);
}

.dbook-content-slide {
  --dbook-slide-font-scale: 1;
  --dbook-slide-code-font-scale: 1;
  --dbook-element-font-scale: 1;
  --dbook-element-code-font-scale: 1;
  --dbook-builder-font-scale: 1;
  --dbook-builder-code-font-scale: 1;
  --dbook-builder-live-scale: 1;
  --dbook-builder-hairline: max(1px, calc(1px * var(--dbook-builder-live-scale)));
  --dbook-builder-radius-xs: calc(6px * var(--dbook-builder-live-scale));
  --dbook-builder-radius-sm: calc(8px * var(--dbook-builder-live-scale));
  aspect-ratio: 16 / 9;
  border-color: rgba(113, 222, 192, 0.22);
  background:
    linear-gradient(135deg, rgba(9, 26, 35, 0.96), rgba(7, 16, 31, 0.98)),
    rgba(7, 18, 34, 0.96);
}

.presentation-slide-canvas.dbook-content-slide {
  box-sizing: border-box;
  flex: 0 0 auto;
  justify-self: center;
  align-self: center;
  width: 960px;
  height: 540px;
  max-width: none;
  max-height: none;
  border-width: var(--dbook-builder-hairline);
  border-radius: var(--dbook-builder-radius-sm);
  transform-origin: center center;
  will-change: transform;
}

.presentation-slide-canvas.dbook-content-slide.presentation-reveal-item {
  transition-property: opacity, visibility;
}

.dbook-content-slide__projection-debug {
  position: absolute;
  z-index: 30;
  left: 8px;
  bottom: 8px;
  max-width: min(52%, 430px);
  max-height: 45%;
  overflow: auto;
  margin: 0;
  border: 1px solid rgba(113, 222, 192, 0.36);
  border-radius: 6px;
  background: rgba(2, 8, 16, 0.84);
  color: #d9fff5;
  padding: 7px 8px;
  font: 10px/1.35 Consolas, Monaco, monospace;
  pointer-events: none;
}

.dbook-content-slide__stage {
  display: grid;
  min-width: 0;
  min-height: 0;
  width: 100%;
  height: 100%;
  padding: clamp(0.72em, 1.42cqi, 1.24em);
  font-size: calc(16px * var(--dbook-slide-font-scale) * var(--dbook-builder-live-scale));
}

.dbook-content-slide[data-dbook-slide-safe-area="compact"] .dbook-content-slide__stage {
  padding: clamp(0.48em, 1cqi, 0.84em);
}

.dbook-content-slide[data-dbook-slide-safe-area="spacious"] .dbook-content-slide__stage {
  padding: clamp(0.96em, 1.9cqi, 1.62em);
}

.dbook-content-slide__grid {
  display: grid;
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 0.82em;
  min-width: 0;
  min-height: 0;
  padding: 0.82em;
  border: var(--dbook-builder-hairline) solid rgba(198, 219, 255, 0.1);
  border-radius: var(--dbook-builder-radius-sm);
  background: rgba(3, 9, 19, 0.32);
  overflow: hidden;
}

.dbook-content-slide__grid[data-slide-columns="1"] {
  grid-template-columns: minmax(0, 1fr);
}

.dbook-content-slide__grid[data-slide-columns="2"] {
  grid-template-columns: minmax(0, 1fr) minmax(0, 1fr);
}

.dbook-content-slide__grid[data-slide-columns="3"] {
  grid-template-columns: repeat(3, minmax(0, 1fr));
}

.dbook-content-slide__grid[data-slide-columns="40-60"] {
  grid-template-columns: minmax(0, 0.4fr) minmax(0, 0.6fr);
}

.dbook-content-slide__grid[data-slide-columns="45-55"] {
  grid-template-columns: minmax(0, 0.45fr) minmax(0, 0.55fr);
}

.dbook-content-slide__grid[data-slide-columns="48-52"] {
  grid-template-columns: minmax(0, 0.48fr) minmax(0, 0.52fr);
}

.dbook-content-slide__grid[data-slide-columns="55-45"] {
  grid-template-columns: minmax(0, 0.55fr) minmax(0, 0.45fr);
}

.dbook-content-slide__grid[data-slide-columns="60-40"] {
  grid-template-columns: minmax(0, 0.6fr) minmax(0, 0.4fr);
}

.dbook-content-slide__grid[data-slide-gap="compact"] {
  gap: 0.48em;
}

.dbook-content-slide__grid[data-slide-gap="spacious"] {
  gap: 1.12em;
}

.dbook-content-slide__grid[data-slide-content-padding="compact"] {
  padding: 0.54em;
}

.dbook-content-slide__grid[data-slide-content-padding="spacious"] {
  padding: 1.12em;
}

.dbook-content-slide__grid[data-slide-align="start"] {
  align-items: start;
}

.dbook-content-slide__grid[data-slide-align="center"] {
  align-items: center;
}

.dbook-content-slide__grid[data-slide-align="stretch"] {
  align-items: stretch;
}

.dbook-content-slide__zone {
  display: flex;
  flex-direction: column;
  gap: 0.56em;
  min-width: 0;
  min-height: 0;
  overflow: hidden;
}

.dbook-content-slide__zone:empty {
  display: none;
}

.dbook-content-slide__zone--header {
  grid-column: 1 / -1;
  grid-row: 1;
}

.dbook-content-slide__zone--left {
  grid-column: 1;
  grid-row: 2;
}

.dbook-content-slide__zone--right {
  grid-column: 2;
  grid-row: 2;
}

.dbook-content-slide__zone--main,
.dbook-content-slide__zone--center {
  grid-column: 1 / -1;
  grid-row: 2;
}

.dbook-content-slide__zone--center {
  align-items: center;
  justify-content: center;
  text-align: center;
}

.dbook-content-slide__zone--footer {
  grid-column: 1 / -1;
  grid-row: 3;
}

.dbook-content-slide__zone--overlay {
  grid-column: 1 / -1;
  grid-row: 1 / -1;
  pointer-events: none;
}

.dbook-content-slide__element {
  --dbook-element-font-scale: 1;
  --dbook-element-code-font-scale: 1;
  --dbook-builder-font-scale: var(--dbook-element-font-scale, 1);
  --dbook-builder-code-font-scale: var(--dbook-element-code-font-scale, 1);
  position: relative;
  min-width: 0;
  min-height: 0;
  font-size: calc(1em * var(--dbook-builder-font-scale));
  line-height: 1.24;
  letter-spacing: 0;
  overflow: hidden;
}

.dbook-content-slide__element[data-slide-variant="card"],
.dbook-content-slide__element[data-slide-variant="outline"] {
  padding: 0.72em 0.82em;
  border: var(--dbook-builder-hairline) solid rgba(198, 219, 255, 0.14);
  border-radius: var(--dbook-builder-radius-sm);
  background: rgba(5, 13, 24, 0.54);
}

.dbook-content-slide__element[data-slide-variant="outline"] {
  background: transparent;
}

.dbook-content-slide__element[data-slide-variant="minimal"] {
  padding: 0;
  border: 0;
  background: transparent;
}

.dbook-content-slide__element[data-slide-density="compact"] {
  line-height: 1.16;
}

.dbook-content-slide__element[data-slide-density="spacious"] {
  line-height: 1.34;
}

.dbook-content-slide__element[data-slide-width="narrow"] {
  max-width: 24em;
}

.dbook-content-slide__element[data-slide-width="medium"] {
  max-width: 34em;
}

.dbook-content-slide__element[data-slide-width="wide"] {
  max-width: 48em;
}

.dbook-content-slide__element[data-slide-width="full"],
.dbook-content-slide__element[data-slide-height="fill"] {
  width: 100%;
}

.dbook-content-slide__element[data-slide-height="short"] {
  flex: 0 1 7em;
  min-height: min(100%, 7em);
  max-height: 7em;
}

.dbook-content-slide__element[data-slide-height="medium"] {
  flex: 0 1 14em;
  min-height: min(100%, 10em);
  max-height: 14em;
}

.dbook-content-slide__element[data-slide-height="tall"] {
  flex: 0 1 22em;
  min-height: min(100%, 14em);
  max-height: 22em;
}

.dbook-content-slide__element[data-slide-height="fill"] {
  flex: 1 1 auto;
}

.dbook-content-slide__element[data-slide-fit="contain"] {
  overflow: hidden;
}

.dbook-content-slide__element[data-slide-fit="contain"] > * {
  max-width: 100%;
  max-height: 100%;
}

.dbook-content-slide__element[data-slide-fit="scroll"] {
  overflow: auto;
}

.dbook-content-slide__element[data-slide-fit="shrink"] {
  font-size: calc(0.9em * var(--dbook-builder-font-scale));
}

.dbook-content-slide__element.is-build-hidden {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
}

.dbook-content-slide__element.is-build-collapsed {
  display: none;
}

.dbook-content-slide__element.is-build-visible {
  visibility: visible;
  opacity: 1;
}

.dbook-content-slide__element[data-slide-emphasis="strong"],
.dbook-content-slide__element.is-dbook-content-emphasized {
  border-color: rgba(113, 222, 192, 0.34);
  color: #f7fbff;
}

.dbook-content-slide__element.is-dbook-content-emphasized,
.dbook-content-slide__element.is-build-emphasized {
  background: rgba(113, 222, 192, 0.1);
  box-shadow: inset 0 0 0 var(--dbook-builder-hairline) rgba(113, 222, 192, 0.14);
}

.dbook-content-slide__element.is-build-active {
  outline: max(2px, calc(2px * var(--dbook-builder-live-scale))) solid rgba(255, 199, 102, 0.82);
  outline-offset: max(2px, calc(2px * var(--dbook-builder-live-scale)));
  box-shadow:
    inset 0 0 0 var(--dbook-builder-hairline) rgba(255, 199, 102, 0.18),
    0 0 0 max(4px, calc(4px * var(--dbook-builder-live-scale))) rgba(255, 199, 102, 0.08);
}

.dbook-content-slide__element.is-build-inactive {
  opacity: 0.72;
}

.dbook-content-slide__element[data-slide-emphasis="muted"] {
  color: #aab9c9;
}

.dbook-content-slide__element[data-slide-emphasis="warning"] {
  border-color: rgba(255, 199, 102, 0.36);
  color: #ffe0a6;
}

.dbook-content-slide__element[data-slide-emphasis="success"] {
  border-color: rgba(113, 222, 192, 0.36);
  color: #c6fff1;
}

.dbook-content-slide__kicker {
  margin: 0;
  color: #71dec0;
  font-family: var(--font-ui);
  font-size: 0.72em;
  font-weight: 900;
  line-height: 1.1;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.dbook-content-slide__heading {
  margin: 0;
  max-width: 18em;
  color: #f7fbff;
  font-family: var(--font-display);
  font-size: 1.72em;
  font-weight: 900;
  line-height: 1.02;
  overflow-wrap: anywhere;
}

.dbook-content-slide__subheading {
  margin: 0;
  max-width: 44em;
  color: #cbd8e8;
  font-size: 0.92em;
  line-height: 1.24;
}

.dbook-content-slide__element-title {
  margin: 0 0 0.42em;
  color: #c6fff1;
  font-family: var(--font-ui);
  font-size: 0.72em;
  font-weight: 900;
  line-height: 1.15;
  text-transform: uppercase;
  overflow-wrap: anywhere;
}

.dbook-content-slide__text,
.dbook-content-slide__callout-text,
.dbook-content-slide__placeholder-text,
.dbook-content-slide__bullet-text,
.dbook-content-slide__embed-text,
.dbook-content-slide__visual-alt {
  margin: 0;
  color: #e8f2ff;
  font-size: 0.88em;
  overflow-wrap: anywhere;
}

.dbook-content-slide__text + .dbook-content-slide__text {
  margin-top: 0.42em;
}

.dbook-content-slide__callout-list {
  display: grid;
  gap: 0.44em;
}

.dbook-content-slide__callout {
  min-width: 0;
  padding: 0.52em 0.62em;
  border-left: 0.24em solid rgba(113, 222, 192, 0.6);
  border-radius: var(--dbook-builder-radius-xs);
  background: rgba(5, 13, 24, 0.62);
}

.dbook-content-slide__callout-title {
  margin: 0 0 0.24em;
  color: #f7fbff;
  font-size: 0.76em;
  font-weight: 900;
  line-height: 1.15;
  overflow-wrap: anywhere;
}

.dbook-content-slide__bullet-list {
  display: grid;
  gap: 0.38em;
  margin: 0;
  padding-left: 1.2em;
  list-style: disc;
}

.dbook-content-slide__bullet {
  padding-left: 0.12em;
  color: #71dec0;
  font-size: 0.9em;
}

.dbook-content-slide__bullet-title {
  display: block;
  margin-bottom: 0.08em;
  color: #f7fbff;
  font-size: 0.86em;
  font-weight: 900;
}

.dbook-content-slide__bullet-text {
  display: block;
  color: #e8f2ff;
}

.dbook-content-slide__code-panels {
  display: grid;
  grid-template-columns: repeat(auto-fit, minmax(min(100%, 14em), 1fr));
  gap: 0.48em;
  min-width: 0;
  min-height: 0;
  height: 100%;
  font-size: calc(1em * var(--dbook-slide-code-font-scale));
}

.dbook-content-slide__code-panel {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr);
  min-width: 0;
  min-height: 0;
  border: var(--dbook-builder-hairline) solid rgba(198, 219, 255, 0.14);
  border-radius: var(--dbook-builder-radius-sm);
  background: rgba(2, 8, 18, 0.74);
  overflow: hidden;
}

.dbook-content-slide__code-title {
  padding: 0.42em 0.62em 0;
}

.dbook-content-slide__code-block {
  margin: 0;
  padding: 0.54em 0.62em 0.62em;
  font-size: calc(0.76em * var(--dbook-builder-code-font-scale));
  line-height: 1.24;
  overflow: auto;
}

.dbook-content-slide__code {
  gap: 0.08em;
  font-size: inherit;
}

.dbook-content-slide .presentation-code-walkthrough__code-line {
  grid-template-columns: 1.7em minmax(0, 1fr);
  gap: 0.38em;
}

.dbook-content-slide .presentation-code-walkthrough__line-code {
  min-width: 0;
  overflow-wrap: anywhere;
}

.dbook-content-slide .presentation-code-walkthrough__code-line.is-code-table-mapping-highlighted {
  color: #ffffff;
}

.dbook-content-slide .presentation-code-walkthrough__line-code.is-code-table-mapping-highlighted {
  background: rgba(255, 121, 121, 0.2);
  box-shadow: 0 0 0 0.16em rgba(255, 121, 121, 0.11);
}

.dbook-content-slide__task-list {
  display: grid;
  gap: 0.46em;
  margin: 0;
  padding-left: 1.22em;
}

.dbook-content-slide__task {
  color: #e8f2ff;
  font-size: 0.88em;
}

.dbook-content-slide__task-label {
  display: inline-block;
  margin-right: 0.32em;
  color: #71dec0;
}

.dbook-content-slide__table-wrap {
  display: grid;
  min-width: 0;
  min-height: 0;
}

.dbook-content-slide__table-scroller {
  min-width: 0;
  overflow: auto;
  border: var(--dbook-builder-hairline) solid rgba(198, 219, 255, 0.16);
  border-radius: var(--dbook-builder-radius-sm);
}

.dbook-content-slide__table {
  width: 100%;
  min-width: 18em;
  border-collapse: collapse;
  color: #e8f2ff;
  font-size: 0.78em;
}

.dbook-content-slide__table th,
.dbook-content-slide__table td {
  padding: 0.48em 0.58em;
  border-bottom: var(--dbook-builder-hairline) solid rgba(198, 219, 255, 0.12);
  text-align: left;
  vertical-align: top;
  overflow-wrap: anywhere;
}

.dbook-content-slide__table th {
  background: rgba(113, 222, 192, 0.1);
  color: #c6fff1;
  font-family: var(--font-ui);
  font-size: 0.88em;
  font-weight: 900;
  text-transform: uppercase;
}

.dbook-content-slide__table tr:last-child td {
  border-bottom: 0;
}

.dbook-content-slide__table tr.is-code-table-mapping-highlighted td,
.dbook-content-slide__table td.is-code-table-mapping-highlighted,
.dbook-content-slide__table th.is-code-table-mapping-highlighted {
  color: #fff9ed;
  border-color: rgba(255, 121, 121, 0.44);
  background: rgba(255, 121, 121, 0.16);
  box-shadow: inset 0.18em 0 0 rgba(255, 121, 121, 0.65);
}

.dbook-content-slide__mapping-overlay {
  display: grid;
  gap: 0.34em;
  min-width: 0;
  padding: 0.44em 0.54em;
  border: var(--dbook-builder-hairline) solid rgba(255, 121, 121, 0.22);
  border-radius: var(--dbook-builder-radius-sm);
  background: rgba(5, 13, 24, 0.68);
}

.dbook-content-slide__mapping-list {
  display: flex;
  flex-wrap: wrap;
  gap: 0.3em;
  min-width: 0;
}

.dbook-content-slide__mapping-item {
  display: inline-grid;
  grid-template-columns: auto minmax(0, 1fr);
  gap: 0.32em;
  align-items: baseline;
  max-width: 100%;
  padding: 0.24em 0.38em;
  border: var(--dbook-builder-hairline) solid rgba(198, 219, 255, 0.14);
  border-radius: var(--dbook-builder-radius-xs);
  color: rgba(232, 242, 255, 0.68);
  background: rgba(198, 219, 255, 0.055);
  font-size: 0.68em;
}

.dbook-content-slide__mapping-item.is-code-table-mapping-highlighted {
  color: #fff9ed;
  border-color: rgba(255, 121, 121, 0.48);
  background: rgba(255, 121, 121, 0.16);
}

.dbook-content-slide__mapping-label,
.dbook-content-slide__mapping-endpoints {
  min-width: 0;
  overflow-wrap: anywhere;
}

.dbook-content-slide__mapping-label {
  color: inherit;
  font-weight: 900;
}

.dbook-content-slide__mapping-endpoints {
  color: inherit;
  opacity: 0.86;
}

.dbook-content-slide__visual {
  display: grid;
  gap: 0.42em;
  min-width: 0;
  min-height: 0;
  margin: 0;
}

.dbook-content-slide__visual-image {
  display: block;
  width: 100%;
  max-height: 100%;
  border: var(--dbook-builder-hairline) solid rgba(198, 219, 255, 0.14);
  border-radius: var(--dbook-builder-radius-sm);
  object-fit: contain;
  background: rgba(2, 8, 18, 0.74);
}

.dbook-content-slide__element[data-slide-fit="cover"] .dbook-content-slide__visual-image {
  object-fit: cover;
}

.dbook-content-slide__visual-placeholder,
.dbook-content-slide__embed-placeholder,
.dbook-content-slide__timer {
  min-width: 0;
  padding: 0.72em;
  border: var(--dbook-builder-hairline) dashed rgba(113, 222, 192, 0.28);
  border-radius: var(--dbook-builder-radius-sm);
  background: rgba(113, 222, 192, 0.08);
}

.dbook-content-slide__visual-label {
  display: inline-flex;
  margin-bottom: 0.38em;
  color: #71dec0;
  font-family: var(--font-ui);
  font-size: 0.68em;
  font-weight: 900;
  text-transform: uppercase;
}

.dbook-content-slide__visual-caption {
  display: grid;
  gap: 0.12em;
  color: #cbd8e8;
  font-size: 0.72em;
  line-height: 1.2;
}

.dbook-content-slide__visual-caption strong {
  color: #f7fbff;
}

.dbook-content-slide__visual-warning {
  margin: 0.35em 0 0;
  color: #ffd98a;
  font-size: 0.72em;
  line-height: 1.25;
}

.dbook-content-slide__embed-placeholder {
  display: grid;
  align-content: center;
  min-height: 5.4em;
}

.dbook-content-slide__embed-placeholder--strukto {
  border-color: rgba(255, 199, 102, 0.34);
  background: rgba(255, 199, 102, 0.08);
}

.dbook-content-slide__embed-placeholder--knowledge {
  border-color: rgba(133, 174, 255, 0.34);
  background: rgba(133, 174, 255, 0.08);
}

.dbook-content-slide__strukto-embed {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 0.42em;
  min-width: 0;
  min-height: 0;
  height: 100%;
}

.dbook-content-slide__strukto-canvas {
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: auto;
  box-sizing: border-box;
}

.dbook-content-slide__strukto-caption {
  margin: 0;
  font-size: 0.68em;
  line-height: 1.32;
}

.dbook-content-slide__knowledge-net-embed {
  display: grid;
  grid-template-rows: auto minmax(0, 1fr) auto;
  gap: 0.42em;
  min-width: 0;
  min-height: 0;
  height: 100%;
}

.dbook-content-slide__knowledge-title {
  margin: 0;
  color: #f7fbff;
  font-family: var(--font-ui);
  font-size: calc(0.98em * var(--dbook-builder-font-scale));
  font-weight: 900;
}

.dbook-content-slide__knowledge-net-host {
  position: relative;
  min-width: 0;
  min-height: 0;
  height: 100%;
  overflow: hidden;
}

.dbook-content-slide__knowledge-net-embed--host-right-dock {
  align-self: stretch;
}

.dbook-content-slide__knowledge-net-embed--host-full-width-overlay,
.dbook-content-slide__knowledge-net-embed--host-overlay {
  grid-template-rows: auto minmax(0, 1fr) auto;
  width: 100%;
  height: 100%;
}

.dbook-content-slide__knowledge-net-embed--host-full-width-overlay .dbook-content-slide__knowledge-net-host,
.dbook-content-slide__knowledge-net-embed--host-overlay .dbook-content-slide__knowledge-net-host {
  min-height: 18em;
}

.dbook-content-slide__knowledge-net-host .presentation-knowledge-net__viewer {
  width: 100%;
  height: 100%;
  min-height: 0;
  box-sizing: border-box;
}

.dbook-content-slide__knowledge-net-host .knowledge-net-page__tool,
.dbook-content-slide__knowledge-net-host .knowledge-net-page__workspace,
.dbook-content-slide__knowledge-net-host .knowledge-net-page__graph,
.dbook-content-slide__knowledge-net-host .knowledge-net-viewer-stack {
  min-height: 0;
  height: 100%;
}

.dbook-content-slide__knowledge-net-host .knowledge-net-page__relations {
  max-height: 32%;
  overflow: auto;
}

.dbook-content-slide__knowledge-net-host[data-knowledge-net-adapter-status="ready"] > .dbook-content-slide__embed-text {
  display: none;
}

.dbook-content-slide__knowledge-caption {
  margin: 0;
  color: #cbd8e8;
  font-size: 0.68em;
  line-height: 1.32;
}

.dbook-content-slide__timer {
  display: grid;
  gap: 0.4em;
  align-items: center;
  border-style: solid;
}

.dbook-content-slide__timer--placeholder {
  grid-template-columns: minmax(0, 1fr) auto;
  gap: 0.16em 0.6em;
}

.dbook-content-slide__timer--functional {
  justify-items: center;
  padding: 0;
  border: 0;
  background: transparent;
  overflow: visible;
}

.dbook-content-slide__timer--functional .presentation-timer {
  width: 100%;
  max-width: min(100%, 28em);
  max-height: 100%;
  padding: 0.72em 0.82em;
  border-width: var(--dbook-builder-hairline);
  border-color: rgba(113, 222, 192, 0.24);
  border-radius: var(--dbook-builder-radius-sm);
  background: rgba(8, 20, 34, 0.84);
  text-align: center;
  overflow: hidden;
}

.dbook-content-slide__timer--functional .presentation-timer__label {
  font-size: calc(1.7em * var(--dbook-builder-font-scale));
}

.dbook-content-slide__timer--functional .presentation-timer__value {
  font-size: calc(4.8em * var(--dbook-builder-font-scale));
}

.dbook-content-slide__element[data-slide-element-type="timer"][data-slide-height="short"] .presentation-timer__value {
  font-size: calc(2.8em * var(--dbook-builder-font-scale));
}

.dbook-content-slide__element[data-slide-element-type="timer"][data-slide-height="medium"] .presentation-timer__value {
  font-size: calc(3.8em * var(--dbook-builder-font-scale));
}

.dbook-content-slide__element[data-slide-element-type="timer"][data-slide-height="tall"] .presentation-timer__value,
.dbook-content-slide__element[data-slide-element-type="timer"][data-slide-height="fill"] .presentation-timer__value {
  font-size: calc(4.4em * var(--dbook-builder-font-scale));
}

.dbook-content-slide__element[data-slide-element-type="timer"][data-slide-fit="scroll"] .dbook-content-slide__timer--functional {
  overflow: auto;
}

.dbook-content-slide__timer--functional .presentation-timer__controls,
.dbook-content-slide__timer--functional .presentation-timer__adjust,
.dbook-content-slide__timer--functional .presentation-timer__presets {
  justify-content: center;
  gap: 0.48em;
}

.dbook-content-slide__timer--functional .presentation-control--small,
.dbook-content-slide__timer--functional .presentation-timer__preset {
  min-height: 2.25em;
  padding: 0.5em 0.72em;
  border-radius: var(--dbook-builder-radius-xs);
  font-size: 0.82em;
}

.dbook-content-slide__timer-label,
.dbook-content-slide__timer-note,
.dbook-content-slide__timer-caption {
  color: #cbd8e8;
  font-family: var(--font-ui);
  font-size: 0.68em;
  font-weight: 800;
  text-transform: uppercase;
}

.dbook-content-slide__timer--placeholder .dbook-content-slide__timer-value {
  grid-row: span 2;
  color: #f7fbff;
  font-family: var(--font-display);
  font-size: 1.34em;
  line-height: 1;
}

.dbook-content-slide__timer-note,
.dbook-content-slide__timer-caption {
  color: #92a7bb;
  font-size: 0.58em;
}

.dbook-content-slide__timer-caption {
  margin: -0.18em 0 0;
  text-align: center;
}

.dbook-content-slide__button-bar {
  display: flex;
  flex-wrap: wrap;
  gap: 0.42em;
  justify-content: flex-end;
}

.dbook-content-slide__button {
  min-height: 2.2em;
  padding: 0.42em 0.72em;
  border: var(--dbook-builder-hairline) solid rgba(113, 222, 192, 0.34);
  border-radius: var(--dbook-builder-radius-xs);
  background: rgba(113, 222, 192, 0.12);
  color: #eaf2ff;
  font-family: var(--font-ui);
  font-size: 0.72em;
  font-weight: 800;
}

.dbook-content-slide__button.is-build-button-active,
.dbook-content-slide__button[aria-current="step"] {
  border-color: rgba(255, 199, 102, 0.62);
  background: rgba(255, 199, 102, 0.18);
  color: #fff7df;
}

.dbook-content-slide__button:disabled,
.dbook-content-slide__button[aria-disabled="true"] {
  cursor: not-allowed;
  opacity: 0.42;
}

.dbook-content-slide__placeholder {
  min-height: 5.4em;
  padding: 0.72em;
  border: var(--dbook-builder-hairline) dashed rgba(198, 219, 255, 0.22);
  border-radius: var(--dbook-builder-radius-sm);
  background: rgba(255, 255, 255, 0.04);
}

.presentation-surface[data-presentation-layout-overrides="true"] .presentation-slide-canvas__content {
  gap: clamp(
    var(--presentation-gap-slide-content-min),
    var(--presentation-gap-slide-content-fluid),
    var(--presentation-gap-slide-content-max)
  );
}

.presentation-surface[data-presentation-layout-overrides="true"] .presentation-slide-main {
  gap: clamp(
    var(--presentation-gap-slide-main-min),
    var(--presentation-gap-slide-main-fluid),
    var(--presentation-gap-slide-main-max)
  );
}

.presentation-surface[data-presentation-layout-overrides="true"] .presentation-visual-text__main {
  gap: clamp(
    var(--presentation-gap-visual-main-min),
    var(--presentation-gap-visual-main-fluid),
    var(--presentation-gap-visual-main-max)
  );
}

.presentation-surface[data-presentation-layout-overrides="true"] .presentation-task-slide__content {
  gap: clamp(
    var(--presentation-gap-task-content-min),
    var(--presentation-gap-task-content-fluid),
    var(--presentation-gap-task-content-max)
  );
}

.presentation-surface[data-presentation-layout-overrides="true"] .presentation-task-slide__layout {
  gap: clamp(
    var(--presentation-gap-task-layout-min),
    var(--presentation-gap-task-layout-fluid),
    var(--presentation-gap-task-layout-max)
  );
}

.presentation-surface[data-presentation-layout-overrides="true"] .presentation-code-walkthrough__content,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-code-struktogramm__content,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-code-table-mapping__content,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-table-text-code__content,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-solution-code__content {
  gap: var(--presentation-gap-code-content);
}

.presentation-surface[data-presentation-layout-overrides="true"] .presentation-code-walkthrough__body,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-code-struktogramm__body,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-code-table-mapping__body,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-table-text-code__layout,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-solution-code__workspace,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-solution-code__panels {
  gap: var(--presentation-gap-code-layout);
}

.presentation-surface[data-presentation-layout-overrides="true"] .presentation-visual-text__text,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-task-slide__tasks,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-code-walkthrough__callouts,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-code-table-mapping__right,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-table-text-code__right,
.presentation-surface[data-presentation-layout-overrides="true"] .presentation-solution-code__callouts {
  gap: var(--presentation-gap-code-stack);
}

.presentation-source-clone {
  display: grid;
  gap: 12px;
  min-height: 0;
  max-height: min(48vh, 560px);
  max-height: min(48dvh, 560px);
  overflow: auto;
  padding-right: 4px;
  color: #eaf2ff;
}

.presentation-card--source .presentation-source-clone {
  min-height: min(10rem, 34dvh);
}

.presentation-source-clone summary {
  color: #ffffff;
}

.presentation-source-clone table {
  width: 100%;
  border-collapse: collapse;
}

.presentation-source-clone th,
.presentation-source-clone td {
  border: 1px solid rgba(198, 219, 255, 0.16);
  padding: 8px 10px;
  vertical-align: top;
}

.presentation-source-clone pre {
  max-width: 100%;
  overflow: auto;
}

.presentation-inline-mark {
  border: 2px solid rgba(220, 38, 38, 0.72);
  border-radius: 4px;
  background: rgba(239, 68, 68, 0.26);
  color: #fff7f7;
  box-shadow: inset 0 -0.22em 0 rgba(248, 113, 113, 0.45);
}

.is-presentation-attention-box,
.is-presentation-attention-outline {
  border-radius: 6px;
  outline: 4px solid rgba(239, 68, 68, 0.95);
  outline-offset: 4px;
  box-shadow:
    0 0 0 8px rgba(239, 68, 68, 0.18),
    0 0 28px rgba(239, 68, 68, 0.24);
}

.is-presentation-attention-outline {
  background: transparent;
}

.presentation-surface--highlight-host {
  overflow: hidden;
}

.presentation-attention-region {
  position: absolute;
  z-index: 4;
  pointer-events: none;
  border: 4px solid rgba(239, 68, 68, 0.96);
  border-radius: 7px;
  background: rgba(239, 68, 68, 0.14);
  box-shadow:
    0 0 0 7px rgba(239, 68, 68, 0.18),
    0 0 30px rgba(239, 68, 68, 0.28);
}

.presentation-attention-style--marker {
  background: rgba(239, 68, 68, 0.26);
}

.presentation-attention-style--outline {
  background: transparent;
}

.presentation-task__details {
  display: grid;
  gap: 16px;
  min-height: 0;
}

.presentation-task__button {
  width: fit-content;
  min-height: 48px;
  padding-inline: 18px;
}

.presentation-timer {
  width: min(100%, 460px);
  background: rgba(11, 21, 36, 0.9);
  overflow: visible;
}

.presentation-card--task .presentation-timer {
  max-height: none;
}

.presentation-timer--compact {
  grid-template-columns: minmax(0, auto) auto;
  align-items: center;
  justify-self: start;
  width: fit-content;
  max-width: 100%;
  padding: 10px 12px;
  gap: 10px 12px;
  background: rgba(10, 20, 34, 0.72);
  box-shadow: none;
}

.presentation-timer__compact-body {
  display: flex;
  align-items: baseline;
  gap: 9px;
  min-width: 0;
}

.presentation-timer__value {
  color: #ffffff;
  font-family: var(--font-mono);
  font-size: clamp(2.4rem, 1.8rem + 2.2vw, 4.6rem);
  font-weight: 800;
  line-height: 1;
}

.presentation-timer--compact .presentation-timer__label {
  color: #aebfda;
  font-size: 0.78rem;
  text-transform: uppercase;
}

.presentation-timer--compact .presentation-timer__value {
  font-size: 1.18rem;
}

.presentation-timer--compact .presentation-timer__controls {
  gap: 6px;
}

.presentation-timer--compact .presentation-control--small {
  min-height: 30px;
  padding: 6px 8px;
  font-size: 0.76rem;
}

.presentation-timer__controls,
.presentation-footer__controls {
  display: flex;
  flex-wrap: wrap;
  gap: 10px;
}

.presentation-timer__controls {
  transition: opacity 160ms ease, transform 160ms ease, visibility 160ms ease;
}

.presentation-timer--running:not(.presentation-timer--menu-visible) .presentation-timer__controls {
  visibility: hidden;
  opacity: 0;
  pointer-events: none;
  transform: translateY(-4px);
}

.presentation-timer--running.presentation-timer--menu-visible .presentation-timer__controls {
  visibility: visible;
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.presentation-timer--started .presentation-timer__presets {
  display: none;
}

.presentation-timer__adjust,
.presentation-timer__presets {
  display: flex;
  flex-wrap: wrap;
  gap: 7px;
}

.presentation-timer__adjust {
  align-items: center;
}

.presentation-timer__presets {
  padding-left: 2px;
}

.presentation-timer__preset {
  min-width: 64px;
  color: #dce8ff;
}

.presentation-control--small {
  min-height: 36px;
  padding: 8px 11px;
  font-size: 0.82rem;
}

.presentation-control:disabled {
  cursor: not-allowed;
  opacity: 0.45;
}

.presentation-footer {
  display: grid;
  grid-template-columns: minmax(0, 1fr) auto;
  justify-self: stretch;
  box-sizing: border-box;
  width: 100%;
  max-width: none;
  margin: 0;
  gap: clamp(12px, 2vw, 26px);
  align-items: center;
  min-height: 44px;
  padding: 6px clamp(22px, 4vw, 54px);
  border-top: 1px solid rgba(198, 219, 255, 0.2);
  background: rgba(5, 11, 20, 0.46);
  color: #aebfda;
  font-family: var(--font-ui);
  font-size: clamp(0.8rem, 0.76rem + 0.14vw, 0.95rem);
  line-height: 1.2;
  text-align: left;
}

.presentation-footer__content {
  display: flex;
  flex-wrap: nowrap;
  gap: 0;
  align-items: center;
  min-width: 0;
  overflow: hidden;
}

.presentation-footer__controls {
  flex-wrap: nowrap;
  justify-content: flex-end;
  align-items: center;
  gap: 6px;
  min-width: max-content;
  transition: opacity 180ms ease, transform 180ms ease;
}

.presentation-footer .presentation-control {
  min-height: 32px;
  padding: 6px 10px;
  font-size: 0.8rem;
}

.presentation-footer__line {
  display: flex;
  flex-wrap: nowrap;
  align-items: center;
  flex: 1 1 auto;
  min-width: 0;
  overflow: hidden;
  white-space: nowrap;
}

.presentation-footer__line span {
  min-width: 0;
  overflow: hidden;
  text-overflow: ellipsis;
  white-space: nowrap;
}

.presentation-footer__line span + span::before {
  content: "\00b7";
  margin: 0 10px;
  color: rgba(198, 219, 255, 0.46);
}

.presentation-footer__brand {
  flex: 0 0 auto;
  color: #d5e3f7;
  font-weight: 800;
  white-space: nowrap;
}

.presentation-footer__line + .presentation-footer__brand::before {
  content: "\00b7";
  margin: 0 10px;
  color: rgba(198, 219, 255, 0.46);
  font-weight: 400;
}

.is-presentation-highlighted {
  outline: 3px solid rgba(239, 68, 68, 0.92);
  outline-offset: 4px;
  transition: outline-color 180ms ease, box-shadow 180ms ease;
  box-shadow: 0 0 0 6px rgba(239, 68, 68, 0.18);
}

.presentation-reveal-item {
  opacity: 0;
  transform: translateY(8px);
  transition: opacity 180ms ease, transform 180ms ease;
  will-change: opacity, transform;
}

.presentation-reveal-item.is-presentation-revealed {
  opacity: 1;
  transform: translateY(0);
}

.presentation-reveal-item--stable {
  transition: none;
  will-change: auto;
}

@media (prefers-reduced-motion: reduce) {
  .presentation-reveal-item {
    transition: none;
    transform: none;
  }
}

.presentation-shell.is-presentation-fullscreen .presentation-footer__controls,
.presentation-shell:fullscreen .presentation-footer__controls {
  opacity: 0;
  pointer-events: none;
  transform: translateY(5px);
}

.presentation-shell.is-presentation-fullscreen.is-presentation-controls-visible .presentation-footer__controls,
.presentation-shell.is-presentation-fullscreen.is-presentation-footer-hovered .presentation-footer__controls,
.presentation-shell.is-presentation-fullscreen .presentation-footer:focus-within .presentation-footer__controls,
.presentation-shell:fullscreen.is-presentation-controls-visible .presentation-footer__controls,
.presentation-shell:fullscreen.is-presentation-footer-hovered .presentation-footer__controls,
.presentation-shell:fullscreen .presentation-footer:focus-within .presentation-footer__controls {
  opacity: 1;
  pointer-events: auto;
  transform: translateY(0);
}

.presentation-shell.is-presentation-fullscreen .presentation-footer,
.presentation-shell:fullscreen .presentation-footer {
  opacity: 0.74;
}

.presentation-shell.is-presentation-blackout .presentation-stage {
  background: #02040a;
}

.presentation-shell.is-presentation-blackout .presentation-stage > * {
  visibility: hidden;
}

.presentation-shell.is-presentation-blackout .presentation-stage::after {
  content: "Pause";
  place-self: center;
  color: rgba(237, 247, 255, 0.58);
  font-size: clamp(2rem, 1.4rem + 2vw, 4rem);
  font-weight: 800;
}

@media (max-width: 760px) {
  .teacher-presentation-card__header {
    grid-template-columns: 1fr;
  }

  .teacher-presentation-card__actions {
    justify-content: flex-start;
  }

  .presentation-shell {
    grid-template-rows: auto minmax(0, 1fr) auto;
  }

  .presentation-stage {
    align-content: start;
  }

  .presentation-stage--title-slide {
    align-content: stretch;
    padding: 0;
  }

  .presentation-title-slide {
    padding: 24px;
  }

  .presentation-title-slide__panel {
    gap: 14px;
    padding: 24px;
  }

  .presentation-title-slide__title {
    font-size: 2.6rem;
  }

  .presentation-knowledge-host--right-dock,
  .presentation-knowledge-host--overlay,
  .presentation-lesson-net__overlay {
    top: 82px;
    right: 12px;
    bottom: 78px;
    left: 12px;
    width: auto;
  }

  .presentation-knowledge-net__viewer {
    min-height: 300px;
  }

  .presentation-lesson-net__list {
    grid-template-columns: minmax(0, 1fr);
  }

  .presentation-code-walkthrough__content {
    gap: 0.55em;
    padding: 0.85em;
  }

  .presentation-code-walkthrough__header {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.35em;
  }

  .presentation-code-walkthrough__language {
    justify-self: start;
  }

  .presentation-code-walkthrough__body {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.55em;
  }

  .presentation-code-walkthrough__callouts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.38em;
    padding: 0.44em;
  }

  .presentation-code-walkthrough__callout {
    gap: 0.42em;
    padding: 0.42em;
  }

  .presentation-code-walkthrough__lower {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: auto auto auto;
    gap: 0.48em;
  }

  .presentation-code-walkthrough__console {
    grid-row: auto;
  }

  .presentation-code-walkthrough__flow {
    grid-template-columns: repeat(5, minmax(0, 1fr));
    gap: 0.32em;
  }

  .presentation-code-struktogramm__content {
    gap: 0.5em;
    padding: 0.72em;
  }

  .presentation-code-struktogramm__title {
    font-size: 0.86em;
  }

  .presentation-code-struktogramm__body {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 0.98fr) minmax(0, 1.02fr);
    gap: 0.5em;
  }

  .presentation-code-struktogramm__code-panel .presentation-code-walkthrough__code-block {
    font-size: 0.58em;
    line-height: 1.24;
  }

  .presentation-code-struktogramm__panel-title {
    padding: 0.42em 0.52em;
    font-size: 0.58em;
  }

  .presentation-code-struktogramm__strukto-canvas {
    padding: 0.48em;
  }

  .presentation-code-struktogramm .strukto-block__header {
    min-height: 1.9em;
    padding: 0.34em 0.42em;
  }

  .presentation-code-struktogramm .strukto-block__text {
    font-size: 0.62em;
    line-height: 1.18;
  }

  .presentation-code-struktogramm .strukto-branch__title {
    min-height: 1.7em;
    padding: 0.28em 0.36em;
    font-size: 0.54em;
  }

  .presentation-code-struktogramm__text-blocks {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.38em;
  }

  .presentation-code-struktogramm__text-block {
    padding: 0.38em 0.42em;
  }

  .presentation-code-struktogramm__text-heading {
    font-size: 0.56em;
  }

  .presentation-code-struktogramm__text-body {
    font-size: 0.5em;
    line-height: 1.2;
  }

  .presentation-code-table-mapping__content {
    gap: 0.5em;
    padding: 0.72em;
  }

  .presentation-code-table-mapping__body {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 0.96fr) minmax(0, 1.04fr);
    gap: 0.5em;
  }

  .presentation-code-table-mapping__right {
    gap: 0.38em;
    padding: 0.42em;
  }

  .presentation-code-table-mapping__code-block {
    font-size: 0.62em;
    line-height: 1.28;
  }

  .presentation-code-table-mapping__text-block {
    padding: 0.38em 0.42em;
  }

  .presentation-code-table-mapping__text-body {
    font-size: 0.52em;
    line-height: 1.2;
  }

  .presentation-code-table-mapping__table {
    font-size: 0.5em;
    line-height: 1.15;
  }

  .presentation-table-text-code__content {
    gap: 0.5em;
    padding: 0.72em;
  }

  .presentation-table-text-code__layout {
    grid-template-columns: minmax(0, 1fr);
    grid-template-rows: minmax(0, 1fr) minmax(0, 0.98fr);
    gap: 0.52em;
  }

  .presentation-table-text-code__right {
    gap: 0.4em;
    padding: 0.44em;
  }

  .presentation-table-text-code__text-block {
    padding: 0.4em 0.44em 0.4em 0.58em;
  }

  .presentation-table-text-code__text-body,
  .presentation-table-text-code__table {
    font-size: 0.56em;
    line-height: 1.2;
  }

  .presentation-table-text-code__code-block {
    font-size: 0.5em;
    line-height: 1.16;
  }

  .presentation-solution-code__content {
    gap: 0.38em;
    padding: 0.62em;
  }

  .presentation-solution-code__title {
    font-size: 1.05em;
  }

  .presentation-solution-code__callouts {
    grid-template-columns: repeat(2, minmax(0, 1fr));
    gap: 0.3em;
  }

  .presentation-solution-code__callout {
    min-height: 2.85em;
    padding: 0.32em;
  }

  .presentation-solution-code__panels {
    grid-template-columns: minmax(0, 1fr);
    gap: 0.48em;
  }

  .presentation-solution-code__code-block,
  .presentation-solution-code__panel[data-code-panel-index="1"] .presentation-solution-code__code-block,
  .presentation-solution-code__panel[data-code-panel-index="2"] .presentation-solution-code__code-block {
    font-size: clamp(0.6em, 1.05cqi, 0.78em);
    line-height: 1.16;
  }

  .presentation-timer--compact {
    grid-template-columns: 1fr;
  }

}

@media (max-width: 620px) {
  .presentation-footer {
    grid-template-columns: 1fr;
    gap: 6px;
    padding: 7px clamp(14px, 5vw, 24px);
  }

  .presentation-footer__content {
    flex-wrap: wrap;
    row-gap: 2px;
  }

  .presentation-footer__line {
    flex-basis: 100%;
  }

  .presentation-footer__controls {
    justify-content: flex-start;
    flex-wrap: wrap;
    min-width: 0;
  }

  .presentation-footer__brand {
    white-space: nowrap;
  }

  .presentation-code-walkthrough__flow-text {
    display: none;
  }
}