#ifi-assistant{
  --withifi-companion-duration:5000ms;
  --withifi-companion-surface:rgba(255,255,255,.97);
  --withifi-companion-border:rgba(120,148,176,.2);
  --withifi-companion-glow:rgba(42,78,112,.12);
  position:relative;
  z-index:20;
  display:flex;
  align-items:center;
  justify-content:flex-end;
  gap:10px;
  min-width:58px;
  min-height:58px;
  margin-inline-start:auto;
  color:#263247;
  font-family:Inter,system-ui,sans-serif;
  pointer-events:none;
}

#ifi-assistant[data-withifi-world="taalwereld"]{
  --withifi-companion-surface:rgba(251,247,255,.98);
  --withifi-companion-border:rgba(165,128,204,.22);
  --withifi-companion-glow:rgba(139,102,181,.13);
}

#ifi-assistant[data-withifi-world="woordenwereld"]{
  --withifi-companion-surface:rgba(255,249,244,.98);
  --withifi-companion-border:rgba(221,154,105,.22);
  --withifi-companion-glow:rgba(198,129,80,.12);
}

#ifi-assistant[data-withifi-world="getallenwereld"]{
  --withifi-companion-surface:rgba(245,252,255,.98);
  --withifi-companion-border:rgba(91,163,196,.22);
  --withifi-companion-glow:rgba(62,143,180,.12);
}

#ifi-assistant[data-withifi-world="denkwereld"]{
  --withifi-companion-surface:rgba(255,252,241,.98);
  --withifi-companion-border:rgba(211,172,72,.22);
  --withifi-companion-glow:rgba(184,146,49,.11);
}

#ifi-assistant[data-withifi-world="klokkijken"]{
  --withifi-companion-surface:rgba(245,251,249,.98);
  --withifi-companion-border:rgba(93,166,142,.22);
  --withifi-companion-glow:rgba(73,145,121,.12);
}

#ifi-assistant[hidden]{display:none!important}

.withifi-companion-host{
  position:relative;
  overflow:visible;
}

#ifi-message{
  position:absolute;
  top:50%;
  right:calc(100% + 10px);
  width:max-content;
  max-width:300px;
  margin:0;
  padding:16px 19px;
  border:1px solid var(--withifi-companion-border);
  border-radius:24px 24px 7px 24px;
  background:var(--withifi-companion-surface);
  box-shadow:0 14px 36px var(--withifi-companion-glow);
  font-size:15px;
  font-weight:650;
  line-height:1.55;
  opacity:0;
  visibility:hidden;
  transform:translateY(-50%) translateX(6px);
  transition:opacity .34s ease,visibility .34s ease,transform .38s ease;
}

#ifi-assistant[data-withifi-bubble="open"] #ifi-message{
  opacity:1;
  visibility:visible;
  transform:translateY(-50%) translateX(0);
}

#ifi-assistant[data-withifi-state]{
  animation:ifiCompanionArrive .46s ease-out both;
}

#ifi-assistant img{
  width:58px;
  max-width:none;
  max-height:58px;
  height:auto;
  object-fit:contain;
  filter:drop-shadow(0 12px 18px rgba(42,78,112,.12));
  transform-origin:50% 100%;
}

#ifi-assistant[data-withifi-header="true"] img{
  animation:none!important;
}

#ifi-assistant[data-withifi-animation="gentle-wave"] img,
#ifi-assistant[data-withifi-animation="gentle-celebration"] img{
  animation:ifiGentleWave var(--withifi-companion-duration) ease-in-out both;
}

#ifi-assistant[data-withifi-animation="soft-breathe"] img,
#ifi-assistant[data-withifi-animation="breathing-circle"] img{
  animation:ifiSoftBreathe 4.5s ease-in-out infinite;
}

#ifi-assistant[data-withifi-animation="soft-nod"] img,
#ifi-assistant[data-withifi-animation="reassuring-nod"] img,
#ifi-assistant[data-withifi-animation="happy-nod"] img{
  animation:ifiSoftNod 1.4s ease-in-out both;
}

#ifi-assistant[data-withifi-animation="gentle-movement"] img{
  animation:ifiGentleMove 3s ease-in-out infinite;
}

@keyframes ifiGentleWave{
  0%,100%{transform:rotate(0deg) translateY(0)}
  30%{transform:rotate(2deg) translateY(-5px)}
  60%{transform:rotate(-1deg) translateY(-2px)}
}

@keyframes ifiCompanionArrive{
  from{opacity:0;transform:translateY(4px)}
  to{opacity:1;transform:translateY(0)}
}

@keyframes ifiSoftBreathe{
  0%,100%{transform:scale(1) translateY(0)}
  50%{transform:scale(1.025) translateY(-4px)}
}

@keyframes ifiSoftNod{
  0%,100%{transform:translateY(0)}
  45%{transform:translateY(5px)}
}

@keyframes ifiGentleMove{
  0%,100%{transform:translateX(0)}
  50%{transform:translateX(-7px)}
}

@media(max-width:768px){
  #ifi-assistant{min-width:48px;min-height:48px}
  #ifi-message{max-width:min(210px,calc(100vw - 90px));font-size:14px;padding:11px 13px}
  #ifi-assistant img{width:48px;max-height:48px}
}

@media(prefers-reduced-motion:reduce){
  #ifi-assistant,#ifi-assistant img{animation:none!important}
  #ifi-message{transition:none}
}

.ifi-progress-page{
  --ifi-progress-ink:#263247;
  --ifi-progress-muted:#65758b;
  --ifi-progress-mint:#cdeee2;
  --ifi-progress-blue:#dcecff;
  --ifi-progress-gold:#f6c85f;
  color:var(--ifi-progress-ink);
  font-family:Inter,system-ui,sans-serif;
}

.ifi-progress-page .ifi-progress-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(210px,1fr));
  gap:16px;
}

.ifi-progress-page .ifi-wellbeing-grid{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:16px;
}

.ifi-progress-page .ifi-wellbeing-card{
  background:linear-gradient(145deg,#fff,#f8f4ff);
}

.ifi-progress-page .ifi-progress-card{
  padding:20px;
  border:1px solid rgba(38,50,71,.08);
  border-radius:22px;
  background:#fff;
  box-shadow:0 12px 30px rgba(42,78,112,.08);
}

.ifi-progress-page .ifi-progress-card h2,
.ifi-progress-page .ifi-progress-card h3{
  margin:0 0 10px;
  color:var(--ifi-progress-ink);
}

.ifi-progress-page .ifi-progress-value{
  margin:4px 0;
  font-size:clamp(1.35rem,3vw,2rem);
  font-weight:800;
}

.ifi-progress-page .ifi-progress-label,
.ifi-progress-page .ifi-progress-meta{
  color:var(--ifi-progress-muted);
  line-height:1.55;
}

.ifi-progress-page .ifi-progress-track{
  overflow:hidden;
  height:14px;
  margin:12px 0 8px;
  border-radius:999px;
  background:#edf2f6;
}

.ifi-progress-page .ifi-progress-bar{
  width:0;
  height:100%;
  border-radius:inherit;
  background:linear-gradient(90deg,#82d6ba,#8abbea);
  transition:width .35s ease;
}

.ifi-progress-page .ifi-stars{
  color:#d69b18;
  font-size:1.15rem;
  letter-spacing:.08em;
}

.ifi-progress-page .ifi-child-selector{
  display:grid;
  grid-template-columns:repeat(auto-fit,minmax(220px,1fr));
  gap:12px;
  margin-bottom:22px;
}

.ifi-progress-page .ifi-child-selector button{
  display:grid;
  grid-template-columns:54px 1fr;
  gap:12px;
  width:100%;
  padding:14px;
  border:1px solid rgba(38,50,71,.1);
  border-radius:18px;
  background:#fff;
  color:inherit;
  text-align:left;
  cursor:pointer;
}

.ifi-progress-page .ifi-child-selector button:hover,
.ifi-progress-page .ifi-child-selector button:focus-visible{
  border-color:#82d6ba;
  outline:3px solid rgba(130,214,186,.25);
}

.ifi-progress-page .ifi-child-avatar,
.ifi-progress-page .ifi-parent-companion{
  width:54px;
  height:54px;
  object-fit:contain;
}

.ifi-progress-page .ifi-topic-list{
  display:grid;
  gap:10px;
  padding:0;
  list-style:none;
}

.ifi-progress-page .ifi-topic-list li{
  padding:12px 14px;
  border-radius:14px;
  background:#f7fafc;
}

.ifi-progress-page .ifi-advice-card{
  display:grid;
  grid-template-columns:minmax(80px,120px) 1fr;
  align-items:center;
  gap:20px;
  background:linear-gradient(135deg,var(--ifi-progress-blue),#fff);
}

.ifi-progress-page[data-parent-authenticated="false"] .ifi-parent-private{
  display:none;
}

@media(max-width:640px){
  .ifi-progress-page .ifi-progress-card{padding:16px;border-radius:18px}
  .ifi-progress-page .ifi-advice-card{grid-template-columns:76px 1fr;gap:12px}
}

@media(prefers-reduced-motion:reduce){
  .ifi-progress-page .ifi-progress-bar{transition:none}
}
