/* IF Digital shared content experience: design system #659, placement #530.
   All types of canonical cards inherit the same dark/light reading and media UI. */
[data-md-color-scheme="slate"] .md-typeset .ifd-question-shell .ifd-question-body {
  --ifd-ink: #eff5ff;
  --ifd-muted: #bfcede;
  --ifd-line: rgba(222, 238, 255, .22);
  --ifd-soft: #14283f;
}
[data-md-color-scheme="slate"] .md-typeset .ifd-question-shell .ifd-question-body > h1,
[data-md-color-scheme="slate"] .md-typeset .ifd-question-shell .ifd-question-body > h2,
[data-md-color-scheme="slate"] .md-typeset .ifd-question-shell .ifd-question-body > h3,
[data-md-color-scheme="slate"] .md-typeset .ifd-question-shell .ifd-foundation > h1,
[data-md-color-scheme="slate"] .md-typeset .ifd-question-shell .ifd-foundation > h2,
[data-md-color-scheme="slate"] .md-typeset .ifd-question-shell .ifd-foundation > h3 {
  color: #eff5ff;
}

/* Real-interface launch card. Entire surface is one keyboard- and touch-accessible link. */
.md-typeset a.ifd-asset-preview {
  display: grid;
  grid-template-columns: minmax(0, 1.05fr) minmax(0, 1fr);
  gap: 0;
  width: 100%;
  min-height: 14rem;
  margin: 1.5rem 0 1.75rem;
  overflow: hidden;
  border: 1px solid #c5d7e6;
  border-radius: 20px;
  background: #f4f8fc;
  color: #15283c;
  box-shadow: 0 12px 32px rgba(12, 44, 76, .10);
  text-decoration: none;
  font-family: var(--ifd-font-ui);
  transition: border-color .16s ease, box-shadow .16s ease, transform .16s ease;
}
.md-typeset a.ifd-asset-preview:hover {
  border-color: #208ec2;
  box-shadow: 0 18px 40px rgba(9, 48, 81, .18);
  transform: translateY(-2px);
}
.md-typeset a.ifd-asset-preview:focus-visible {
  outline: 3px solid var(--ifd-cyan, #13b8d1);
  outline-offset: 3px;
}
.md-typeset a.ifd-asset-preview .ifd-asset-preview__image {
  position: relative;
  display: block;
  min-height: 14rem;
  overflow: hidden;
  background: #101e30;
}
.md-typeset a.ifd-asset-preview img {
  display: block;
  width: 100%;
  height: 100%;
  min-height: 14rem;
  object-fit: cover;
  object-position: top left;
  margin: 0;
  border-radius: 0;
}
.md-typeset a.ifd-asset-preview .ifd-asset-preview__type {
  position: absolute;
  left: .72rem;
  top: .72rem;
  max-width: calc(100% - 1.5rem);
  padding: .3rem .66rem;
  border-radius: .4rem;
  background: rgba(7, 20, 38, .92);
  color: #f0f6ff;
  font: 700 .67rem/1.3 var(--ifd-font-ui);
  text-transform: uppercase;
  letter-spacing: .06em;
}
.md-typeset a.ifd-asset-preview .ifd-asset-preview__body {
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: center;
  gap: .65rem;
  min-width: 0;
  padding: 1.4rem 1.5rem;
}
.md-typeset a.ifd-asset-preview .ifd-asset-preview__eyebrow {
  display: block;
  color: #315b81;
  font: 760 .71rem/1.35 var(--ifd-font-ui);
  text-transform: uppercase;
  letter-spacing: .08em;
}
.md-typeset a.ifd-asset-preview .ifd-asset-preview__title {
  display: block;
  color: #12263a;
  font: 760 clamp(1.17rem, 2vw, 1.56rem)/1.22 var(--ifd-font-ui);
  letter-spacing: -.025em;
}
.md-typeset a.ifd-asset-preview .ifd-asset-preview__description {
  display: block;
  color: #3c546d;
  font: 450 .84rem/1.55 var(--ifd-font-ui);
}
.md-typeset a.ifd-asset-preview .ifd-asset-preview__action {
  display: inline-flex;
  align-items: center;
  gap: .5rem;
  margin-top: .35rem;
  padding: .63rem .95rem;
  border-radius: .55rem;
  background: #185fa5;
  color: #fff;
  font: 750 .76rem/1.35 var(--ifd-font-ui);
}
.md-typeset a.ifd-asset-preview:hover .ifd-asset-preview__action {
  background: #114f8b;
}
[data-md-color-scheme="slate"] .md-typeset a.ifd-asset-preview {
  background: #13283f;
  border-color: #395772;
  box-shadow: 0 14px 32px rgba(0, 0, 0, .26);
}
[data-md-color-scheme="slate"] .md-typeset a.ifd-asset-preview .ifd-asset-preview__eyebrow { color: #93dbee; }
[data-md-color-scheme="slate"] .md-typeset a.ifd-asset-preview .ifd-asset-preview__title { color: #f2f8ff; }
[data-md-color-scheme="slate"] .md-typeset a.ifd-asset-preview .ifd-asset-preview__description { color: #c9d9e9; }
[data-md-color-scheme="slate"] .md-typeset a.ifd-asset-preview .ifd-asset-preview__action {
  background: #2498d1;
  color: #071625;
}
[data-md-color-scheme="slate"] .md-typeset a.ifd-asset-preview:hover { border-color: #77cae9; }
@media (max-width: 56rem) {
  .md-typeset a.ifd-asset-preview { grid-template-columns: 1fr; min-height: 0; }
  .md-typeset a.ifd-asset-preview .ifd-asset-preview__image,
  .md-typeset a.ifd-asset-preview img {
    height: auto;
    min-height: 0;
    aspect-ratio: 16 / 9;
  }
  .md-typeset a.ifd-asset-preview .ifd-asset-preview__body { padding: 1.1rem 1.2rem 1.3rem; }
}
@media (prefers-reduced-motion: reduce) {
  .md-typeset a.ifd-asset-preview { transition: none; }
  .md-typeset a.ifd-asset-preview:hover { transform: none; }
}

/* Light-canvas practicals must not inherit the outer slate reading colour.
   These selectors are deliberately panel-specific: simulated dark terminals
   retain their own native colours and remain legible. */
[data-md-color-scheme="slate"] #ifd-provider-return .pr-task-panel p,
[data-md-color-scheme="slate"] #ifd-email-lab .task-panel p,
[data-md-color-scheme="slate"] #ifd-iphone-mac-lab .iphone-task-panel p,
[data-md-color-scheme="slate"] #ifd-phishing-website .ph-material-body p,
[data-md-color-scheme="slate"] #ifd-phishing-website .ph-content details > summary,
[data-md-color-scheme="slate"] #ifd-suspicious-login details > summary,
[data-md-color-scheme="slate"] #ifd-linux-web-server details.lw-reference > summary {
  color: #1b232e;
}
[data-md-color-scheme="slate"] #ifd-linux-web-server details.lw-reference {
  background: #fff;
  color: #1b232e;
}
[data-md-color-scheme="slate"] #ifd-linux-web-server details.lw-reference > summary {
  background: #edf3f7;
}


/* Shared document-form teaching object for operational explainers (#794).
   Distinct form fields and rationale; colour is never the only contrast cue. */
.md-typeset .ifd-form-comparison {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .85rem;
  margin: 1rem 0 1.6rem;
}
.md-typeset .ifd-form-comparison__item {
  min-width: 0;
  padding: 1.1rem 1.15rem;
  border: 1px solid #c6d8e6;
  border-top: 4px solid #55718c;
  border-radius: .8rem;
  color: #1b3044;
  background: #f3f7fa;
}
.md-typeset .ifd-form-comparison__item--focused {
  border-top-color: #087f9a;
  background: #edf8fb;
}
.md-typeset .ifd-form-comparison__label,
.md-typeset .ifd-form-example__number,
.md-typeset .ifd-form-example__eyebrow {
  display: block;
  font: 750 .73rem/1.4 var(--ifd-font-ui);
  letter-spacing: .045em;
  text-transform: uppercase;
}
.md-typeset .ifd-form-comparison__label { color: #164669; }
.md-typeset .ifd-form-comparison__quote {
  margin: .65rem 0;
  color: #142d45;
  font: 650 .95rem/1.5 var(--ifd-font-ui);
  overflow-wrap: anywhere;
}
.md-typeset .ifd-form-comparison__reason {
  margin: .5rem 0 0;
  font: 450 .81rem/1.6 var(--ifd-font-reading);
  color: #344d63;
}
.md-typeset .ifd-form-example {
  margin: 1.1rem 0 1.65rem;
  border: 1px solid #c5d8e7;
  border-radius: 1rem;
  overflow: hidden;
  box-shadow: 0 13px 30px rgba(16, 43, 68, .09);
  background: #f3f8fc;
}
.md-typeset .ifd-form-example__head {
  display: grid;
  gap: .35rem;
  padding: 1.2rem 1.35rem;
  color: #f1f7ff;
  background: #0b2239;
}
.md-typeset .ifd-form-example__eyebrow { color: #90dce9; }
.md-typeset .ifd-form-example__head > strong {
  color: #fff;
  font: 760 clamp(1.12rem, 2vw, 1.5rem)/1.25 var(--ifd-font-ui);
}
.md-typeset .ifd-form-example__subhead {
  color: #d1e1ed;
  font: 450 .78rem/1.5 var(--ifd-font-ui);
}
.md-typeset .ifd-form-example__fields {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: 1px;
  background: #c5d8e7;
}
.md-typeset .ifd-form-example__field {
  min-width: 0;
  padding: 1.05rem 1.2rem;
  background: #fff;
  overflow-wrap: anywhere;
}
.md-typeset .ifd-form-example__number { color: #11638a; }
.md-typeset .ifd-form-example__field > p {
  margin: .55rem 0 .8rem;
  color: #1b3044;
  font: 500 .91rem/1.62 var(--ifd-font-reading);
}
.md-typeset .ifd-form-example__field > small {
  display: block;
  padding-top: .65rem;
  border-top: 1px solid #d5e3ed;
  color: #3e5267;
  font: 450 .77rem/1.55 var(--ifd-font-reading);
}
.md-typeset .ifd-form-example__field > small strong { color: #173e5c; }
[data-md-color-scheme="slate"] .md-typeset .ifd-form-comparison__item,
[data-md-color-scheme="slate"] .md-typeset .ifd-form-comparison__item--focused {
  color: #eaf4ff;
  border-color: #52708b;
  background: #172c43;
}
[data-md-color-scheme="slate"] .md-typeset .ifd-form-comparison__item--focused { border-top-color: #54d1e3; }
[data-md-color-scheme="slate"] .md-typeset .ifd-form-comparison__label { color: #98dbf3; }
[data-md-color-scheme="slate"] .md-typeset .ifd-form-comparison__quote { color: #f4f8ff; }
[data-md-color-scheme="slate"] .md-typeset .ifd-form-comparison__reason { color: #d1e0ec; }
[data-md-color-scheme="slate"] .md-typeset .ifd-form-example {
  background: #14273d;
  border-color: #46617b;
  box-shadow: 0 13px 30px rgba(0, 0, 0, .2);
}
[data-md-color-scheme="slate"] .md-typeset .ifd-form-example__fields { background: #415d75; }
[data-md-color-scheme="slate"] .md-typeset .ifd-form-example__field { background: #172c43; }
[data-md-color-scheme="slate"] .md-typeset .ifd-form-example__number { color: #91def2; }
[data-md-color-scheme="slate"] .md-typeset .ifd-form-example__field > p { color: #eef6ff; }
[data-md-color-scheme="slate"] .md-typeset .ifd-form-example__field > small {
  color: #ccddeb;
  border-top-color: #46617b;
}
[data-md-color-scheme="slate"] .md-typeset .ifd-form-example__field > small strong { color: #c1edfb; }
@media (max-width: 48rem) {
  .md-typeset .ifd-form-comparison,
  .md-typeset .ifd-form-example__fields { grid-template-columns: 1fr; }
  .md-typeset .ifd-form-example__field { padding: .95rem 1rem; }
}


/* Shared next-step component for operational explainers. Other question types
   already had it; without this the same canonical markup was plain inline text. */
.md-typeset .ifd-question-shell[data-ifd-page-type="operational-explainer"] .ifd-question-body .ifd-next {
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  gap: .75rem;
  margin: 1rem 0 1.5rem;
}
.md-typeset .ifd-question-shell[data-ifd-page-type="operational-explainer"] .ifd-question-body a.ifd-next__link {
  display: block;
  min-width: 0;
  padding: 1rem 1.15rem;
  border: 1px solid #234966;
  border-radius: .7rem;
  color: #f4f8ff;
  background: #10283f;
  text-decoration: none;
  font: 690 .85rem/1.5 var(--ifd-font-ui);
  overflow-wrap: anywhere;
}
.md-typeset .ifd-question-shell[data-ifd-page-type="operational-explainer"] .ifd-question-body a.ifd-next__link > span {
  display: block;
  margin-bottom: .3rem;
  color: #91deee;
  font: 760 .7rem/1.35 var(--ifd-font-ui);
  letter-spacing: .05em;
  text-transform: uppercase;
}
.md-typeset .ifd-question-shell[data-ifd-page-type="operational-explainer"] .ifd-question-body a.ifd-next__link:hover {
  border-color: #5ccee4;
  background: #173c5b;
}
.md-typeset .ifd-question-shell[data-ifd-page-type="operational-explainer"] .ifd-question-body a.ifd-next__link:focus-visible {
  outline: 3px solid #38bedc;
  outline-offset: 3px;
}
.md-typeset .ifd-question-shell[data-ifd-page-type="operational-explainer"] .ifd-question-body .ifd-next--practical > a {
  grid-column: 1 / -1;
  padding: 1.25rem 1.35rem;
  font-size: 1.02rem;
  border-left: 5px solid #56cede;
}
@media (max-width: 48rem) {
  .md-typeset .ifd-question-shell[data-ifd-page-type="operational-explainer"] .ifd-question-body .ifd-next { grid-template-columns: 1fr; }
}