body[data-withifi-world-id="getallenwereld"]{
  --withifi-number-ink:#263247;
  --withifi-number-muted:#68788b;
  --withifi-number-blue:#86c9dc;
  --withifi-number-mint:#bde4d6;
  --withifi-number-surface:rgba(255,255,255,.9);
  background:linear-gradient(145deg,#f5fbfd 0%,#f7fbf8 52%,#fdfaf4 100%);
}

.withifi-number-exercise-host{
  width:100%;
  max-width:none!important;
  color:var(--withifi-number-ink);
  font-family:Inter,system-ui,-apple-system,BlinkMacSystemFont,"Segoe UI",sans-serif;
}

.withifi-number-experience{
  width:min(1180px,calc(100% - 32px));
  margin:clamp(24px,5vw,64px) auto;
}

.withifi-number-experience,
.withifi-number-experience *{box-sizing:border-box;min-width:0}

.withifi-number-header{
  display:grid;
  grid-template-columns:1fr auto;
  align-items:center;
  gap:14px 24px;
  margin-bottom:20px;
  padding:0 6px;
}

.withifi-number-back{
  width:max-content;
  color:#3f6572;
  font-size:.95rem;
  font-weight:750;
  text-decoration:none;
}

.withifi-number-back:hover,
.withifi-number-back:focus-visible{
  color:#263247;
  outline:3px solid rgba(134,201,220,.35);
  outline-offset:5px;
  border-radius:8px;
}

.withifi-number-status{
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:16px;
  color:var(--withifi-number-muted);
  font-size:.9rem;
  font-weight:700;
}

.withifi-number-progress{
  grid-column:1/-1;
  overflow:hidden;
  width:100%;
  height:9px;
  border-radius:999px;
  background:rgba(114,145,159,.13);
}

.withifi-number-progress__bar{
  display:block!important;
  height:100%!important;
  min-height:0!important;
  margin:0!important;
  border:0!important;
  border-radius:inherit;
  background:linear-gradient(90deg,var(--withifi-number-mint),var(--withifi-number-blue))!important;
  transition:width .35s ease;
}

.withifi-number-workspace{
  display:grid;
  grid-template-columns:minmax(0,1fr) minmax(240px,310px);
  align-items:start;
  gap:clamp(22px,4vw,42px);
}

.withifi-number-card,
.withifi-number-companion{
  border:1px solid rgba(75,116,133,.12);
  border-radius:30px;
  background:var(--withifi-number-surface);
  box-shadow:0 22px 60px rgba(47,91,108,.09);
  backdrop-filter:blur(16px);
  -webkit-backdrop-filter:blur(16px);
}

.withifi-number-card{
  min-width:0;
  padding:clamp(28px,5vw,58px);
}

.withifi-number-question{
  display:block;
  margin:0 auto clamp(28px,5vw,48px);
  text-align:center;
}

.withifi-number-question>*{
  margin:0!important;
  color:var(--withifi-number-ink)!important;
  font-size:clamp(1.85rem,4vw,3rem)!important;
  font-weight:850!important;
  line-height:1.16!important;
  letter-spacing:-.025em;
}

.withifi-number-stage{
  display:grid;
  place-items:center;
  min-height:clamp(160px,28vw,280px);
  margin:0 auto clamp(30px,5vw,50px);
  padding:clamp(24px,5vw,42px);
  border-radius:25px;
  background:linear-gradient(145deg,rgba(245,251,253,.92),rgba(248,252,249,.96));
}

.withifi-number-objects{
  display:grid!important;
  grid-template-columns:repeat(var(--withifi-object-columns),minmax(34px,58px));
  place-content:center;
  gap:clamp(8px,1.8vw,17px);
  max-width:100%;
  margin:0!important;
  padding:0!important;
  color:inherit;
  text-align:center;
  white-space:normal!important;
}

.withifi-number-object{
  display:grid;
  place-items:center;
  min-width:0;
  font-size:clamp(1.7rem,4vw,3rem);
  line-height:1;
}

.withifi-number-value{
  margin:0!important;
  color:#315e6c;
  font-size:clamp(4.5rem,13vw,8rem)!important;
  font-weight:850;
  line-height:1;
  text-align:center;
}

.withifi-number-answer-region>*,
.withifi-number-answer-region [id$="AnswerArea"],
.withifi-number-answer-region [id$="Antwoorden"],
.withifi-number-answer-region [id$="Keuzes"]{
  display:flex!important;
  flex-wrap:wrap;
  justify-content:center;
  gap:clamp(14px,2.4vw,22px)!important;
  width:100%;
  margin:0!important;
}

.withifi-number-answer-region button,
.withifi-number-card--grid button:not(.tm-tab){
  min-width:clamp(112px,18vw,170px);
  min-height:62px;
  padding:15px 25px!important;
  border:1px solid rgba(59,105,123,.17)!important;
  border-radius:19px!important;
  background:rgba(255,255,255,.96)!important;
  color:var(--withifi-number-ink)!important;
  box-shadow:0 10px 24px rgba(55,95,112,.08)!important;
  font:inherit!important;
  font-size:clamp(1.05rem,2vw,1.25rem)!important;
  font-weight:800!important;
  cursor:pointer;
  transition:transform .18s ease,border-color .18s ease,box-shadow .18s ease;
}

.withifi-number-answer-region button:hover,
.withifi-number-answer-region button:focus-visible,
.withifi-number-card--grid button:not(.tm-tab):hover,
.withifi-number-card--grid button:not(.tm-tab):focus-visible{
  border-color:rgba(67,148,176,.55)!important;
  outline:3px solid rgba(134,201,220,.26)!important;
  outline-offset:3px;
  box-shadow:0 14px 30px rgba(55,95,112,.13)!important;
  transform:translateY(-2px);
}

.withifi-number-answer-region button:disabled{
  cursor:default;
  opacity:.72;
  transform:none;
}

.withifi-number-answer-region button.goed{
  border-color:rgba(70,145,115,.45)!important;
  background:rgba(235,249,242,.98)!important;
}

.withifi-number-answer-region button.fout{
  border-color:rgba(207,159,86,.42)!important;
  background:rgba(255,249,237,.98)!important;
}

.withifi-number-support{
  display:grid;
  gap:12px;
  margin-top:clamp(24px,4vw,38px);
  color:var(--withifi-number-muted);
  text-align:center;
}

.withifi-number-support:empty{display:none}

.withifi-number-support>*{
  margin:0!important;
  line-height:1.6;
}

.withifi-number-support [id$="NextWrap"],
.withifi-number-support [id$="volgende"],
.withifi-number-support #volgende{
  justify-self:center;
}

.withifi-number-companion{
  position:sticky;
  top:28px;
  display:flex;
  flex-direction:column;
  align-items:center;
  min-height:330px;
  padding:28px 24px;
  text-align:center;
}

.withifi-number-companion__title{
  order:2;
  margin:16px 0 8px;
  color:#3d6b61;
  font-size:1rem;
  font-weight:850;
  letter-spacing:.02em;
}

.withifi-number-companion__slot{
  order:1;
  display:grid;
  place-items:center;
  width:100%;
}

.withifi-number-companion #ifi-assistant{
  display:flex!important;
  flex-direction:column;
  align-items:center;
  justify-content:flex-start;
  gap:16px;
  width:100%;
  min-height:0;
  margin:0;
  pointer-events:auto;
}

.withifi-number-companion #ifi-image{
  order:1;
  width:min(150px,70%);
  max-width:150px;
  max-height:180px;
}

.withifi-number-companion #ifi-message{
  position:static;
  order:3;
  width:100%;
  max-width:none;
  min-height:86px;
  margin:0;
  padding:18px;
  border-radius:20px;
  opacity:1;
  visibility:visible;
  transform:none;
  transition:opacity .25s ease;
}

.withifi-number-companion #ifi-voice-indicator{order:4}
.withifi-number-legacy{display:none!important}

.withifi-number-card--grid{
  display:grid;
  gap:22px;
}

.withifi-number-card--grid .oefening,
.withifi-number-card--grid .oefen-card,
.withifi-number-card--grid .vraag-card,
.withifi-number-card--grid .tm-game,
.withifi-number-card--grid [class$="-card"]{
  padding:clamp(22px,4vw,34px)!important;
  border:1px solid rgba(75,116,133,.12)!important;
  border-radius:24px!important;
  background:rgba(248,252,251,.9)!important;
  box-shadow:none!important;
}

@media(max-width:900px){
  .withifi-number-workspace{grid-template-columns:1fr}
  .withifi-number-companion{position:static;min-height:0}
  .withifi-number-companion__slot{max-width:520px}
}

@media(max-width:620px){
  .withifi-number-experience{width:min(100% - 20px,1180px);margin:18px auto 34px}
  .withifi-number-header{grid-template-columns:1fr;gap:12px;padding:0 4px}
  .withifi-number-status{justify-content:space-between;width:100%}
  .withifi-number-card{padding:28px 18px;border-radius:24px}
  .withifi-number-stage{min-height:150px;padding:22px 14px}
  .withifi-number-answer-region>*,
  .withifi-number-answer-region [id$="AnswerArea"],
  .withifi-number-answer-region [id$="Antwoorden"],
  .withifi-number-answer-region [id$="Keuzes"]{flex-direction:column;align-items:stretch}
  .withifi-number-answer-region button{width:100%;min-width:0}
  .withifi-number-companion{padding:24px 18px;border-radius:24px}
}

@media(prefers-reduced-motion:reduce){
  .withifi-number-progress__bar,
  .withifi-number-answer-region button,
  .withifi-number-companion #ifi-message{transition:none!important}
  .withifi-number-answer-region button:hover,
  .withifi-number-answer-region button:focus-visible{transform:none}
}
