.dd-avondplanner { max-width: 640px; padding: 40px 32px; background: var(--dd-linen); border-radius: var(--dd-radius); border: 1.5px solid var(--dd-border); }

.dda-steps { position: relative; min-height: 200px; }
.dda-step  { display: none; animation: ddaFade .3s ease both; }
.dda-step.active { display: block; }
@keyframes ddaFade { from{opacity:0;transform:translateX(16px)} to{opacity:1;transform:none} }

.dda-q { font-size:19px; font-weight:600; color:var(--dd-green); margin:0 0 20px; }

.dda-options { display: flex; flex-wrap: wrap; gap: 10px; }

.dda-opt {
  display: flex; flex-direction: column; align-items: center; gap: 6px;
  width: calc(50% - 5px); padding: 18px 12px;
  background: #fff; border: 1.5px solid var(--dd-border); border-radius: 14px;
  cursor: pointer; font-family: var(--dd-font); font-size: 13.5px;
  color: var(--dd-text); transition: all .18s; line-height: 1.3;
}
.dda-opt:hover { border-color: var(--dd-green); background: #f0f7ee; transform: translateY(-2px); }
.dda-opt.selected { border-color: var(--dd-green); background: var(--dd-green); color: #fff; }
.dda-emoji { font-size: 28px; }

.dda-progress { display: flex; justify-content: center; gap: 8px; margin-top: 24px; }
.dda-dot { width:8px; height:8px; border-radius:50%; background:#d0c0a0; transition: background .2s; }
.dda-dot.active { background: var(--dd-green); }

/* Result */
.dda-loading  { text-align:center; padding:40px 20px; color:var(--dd-muted); }
.dda-spinner  { width:36px;height:36px;border:3px solid #e0d0b0;border-top-color:var(--dd-green);border-radius:50%;animation:ddaSpin 0.8s linear infinite;margin:0 auto 14px; }
@keyframes ddaSpin { to{transform:rotate(360deg)} }

.dda-result-header { display:flex; align-items:center; gap:12px; margin-bottom:16px; }
.dda-ruard-avatar  { width:50px;height:50px;border-radius:50%;object-fit:cover;object-position:center 10%;border:2px solid var(--dd-amber); }
.dda-result-header strong { display:block; font-size:16px; color:var(--dd-green); }
.dda-result-header span   { font-size:12px; color:var(--dd-muted); }

.dda-result-text { font-size:15px; line-height:1.7; color:var(--dd-text); padding:16px; background:#fff; border-radius:12px; border-left:4px solid var(--dd-amber); margin-bottom:20px; }

.dda-result-actions { display:flex; flex-wrap:wrap; gap:10px; margin-bottom:14px; }
.dda-result-actions .dd-btn { font-size:13.5px; padding:10px 18px; text-decoration:none; }

.dda-restart { background:none; border:none; color:var(--dd-muted); font-size:13px; cursor:pointer; padding:4px 0; text-decoration:underline; font-family:var(--dd-font); }
.dda-restart:hover { color:var(--dd-green); }

@media(max-width:480px) { .dda-opt { width:100%; } .dd-avondplanner { padding:24px 18px; } }