/* Safari Sophie — assistent (demo) */
.ag-knop{position:fixed;right:24px;bottom:24px;z-index:130;display:flex;align-items:center;gap:12px;
 background:var(--goud);color:var(--room);border:none;cursor:pointer;border-radius:999px;padding:14px 22px 14px 16px;
 font-family:'Lora',Georgia,serif;font-weight:600;font-size:14px;letter-spacing:.06em;
 box-shadow:0 10px 30px rgba(42,35,26,.32);transition:transform .25s var(--easing),background .25s,box-shadow .25s}
.ag-knop:hover{background:var(--goud-diep);transform:translateY(-3px);box-shadow:0 16px 38px rgba(42,35,26,.4)}
.ag-knop:active{transform:translateY(0) scale(.97)}
.ag-knop svg{width:22px;height:22px;stroke:currentColor;fill:none;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round;flex-shrink:0}
.ag-knop.weg{opacity:0;pointer-events:none;transform:translateY(12px)}
.ag-punt{position:absolute;top:10px;right:16px;width:9px;height:9px;border-radius:50%;background:#e8d5ad;box-shadow:0 0 0 0 rgba(232,213,173,.7);animation:agPuls 2.6s infinite}
@keyframes agPuls{0%{box-shadow:0 0 0 0 rgba(232,213,173,.6)}70%{box-shadow:0 0 0 12px rgba(232,213,173,0)}100%{box-shadow:0 0 0 0 rgba(232,213,173,0)}}

.ag-paneel{position:fixed;right:24px;bottom:24px;z-index:131;width:390px;max-width:calc(100vw - 32px);
 background:var(--paper);border-radius:22px;box-shadow:0 30px 80px rgba(24,19,16,.45);overflow:hidden;
 display:flex;flex-direction:column;max-height:min(620px,calc(100dvh - 48px));
 opacity:0;transform:translateY(18px) scale(.98);pointer-events:none;transition:opacity .3s var(--easing),transform .35s var(--easing)}
.ag-paneel.open{opacity:1;transform:none;pointer-events:auto}
.ag-kop{display:flex;align-items:center;gap:12px;padding:16px 18px;background:var(--nacht);color:var(--room)}
.ag-kop img{width:40px;height:40px;border-radius:50%;background:var(--room);padding:3px;flex-shrink:0}
.ag-kop .t{flex:1;min-width:0}
.ag-kop .t b{display:block;font-family:'Marcellus',serif;font-weight:400;font-size:15px;letter-spacing:.12em;text-transform:uppercase}
.ag-kop .t span{font-size:12px;color:rgba(251,247,238,.6);display:flex;align-items:center;gap:6px}
.ag-kop .t span::before{content:"";width:6px;height:6px;border-radius:50%;background:#7fae8a}
.ag-sluit{background:none;border:none;color:rgba(251,247,238,.75);cursor:pointer;padding:8px;border-radius:10px;transition:.2s;flex-shrink:0}
.ag-sluit:hover{background:rgba(251,247,238,.12);color:var(--room)}
.ag-sluit svg{width:20px;height:20px;stroke:currentColor;fill:none;stroke-width:1.8;stroke-linecap:round}

.ag-body{flex:1;overflow-y:auto;overscroll-behavior:contain;-webkit-overflow-scrolling:touch;padding:18px 18px 8px;display:flex;flex-direction:column;gap:12px}
.ag-body::-webkit-scrollbar{width:6px}
.ag-body::-webkit-scrollbar-thumb{background:rgba(42,35,26,.16);border-radius:99px}
.ag-bericht{max-width:86%;padding:13px 16px;border-radius:16px;font-size:15px;line-height:1.55;animation:agOp .4s var(--easing)}
.ag-bericht.sophie{background:var(--room);color:var(--ink);border:1px solid var(--lijn);border-bottom-left-radius:6px;align-self:flex-start}
.ag-bericht.ik{background:var(--goud);color:var(--room);border-bottom-right-radius:6px;align-self:flex-end}
.ag-bericht b{font-family:'Marcellus',serif;font-weight:400}
@keyframes agOp{from{opacity:0;transform:translateY(8px)}to{opacity:1;transform:none}}
.ag-typt{align-self:flex-start;display:flex;gap:5px;padding:14px 16px;background:var(--room);border:1px solid var(--lijn);border-radius:16px;border-bottom-left-radius:6px}
.ag-typt i{width:7px;height:7px;border-radius:50%;background:var(--goud);opacity:.4;animation:agTyp 1.2s infinite}
.ag-typt i:nth-child(2){animation-delay:.18s}
.ag-typt i:nth-child(3){animation-delay:.36s}
@keyframes agTyp{0%,60%,100%{opacity:.3;transform:translateY(0)}30%{opacity:1;transform:translateY(-4px)}}

.ag-keuzes{display:flex;flex-wrap:wrap;gap:8px;padding:6px 18px 4px}
.ag-keuzes button{background:var(--room);border:1px solid var(--goud);color:var(--goud-diep);cursor:pointer;
 border-radius:999px;padding:10px 15px;font-family:'Lora',Georgia,serif;font-size:13.5px;font-weight:500;
 transition:.2s var(--easing);min-height:40px}
.ag-keuzes button:hover{background:var(--goud);color:var(--room);transform:translateY(-2px)}
.ag-keuzes button:active{transform:scale(.97)}
.ag-keuzes button.sterk{background:var(--goud);color:var(--room)}
.ag-keuzes button.sterk:hover{background:var(--goud-diep)}

.ag-invoer{display:flex;gap:8px;padding:12px 16px calc(14px + env(safe-area-inset-bottom));border-top:1px solid var(--lijn);background:var(--paper)}
.ag-invoer input{flex:1;font:inherit;font-size:16px;font-family:'Lora',Georgia,serif;padding:12px 15px;border:1px solid var(--lijn);
 border-radius:999px;background:var(--room);color:var(--ink);min-height:46px;min-width:0}
.ag-invoer input:focus{outline:none;border-color:var(--goud);box-shadow:0 0 0 3px rgba(156,131,94,.16)}
.ag-invoer button{background:var(--goud);border:none;color:var(--room);cursor:pointer;width:46px;height:46px;border-radius:50%;
 display:grid;place-items:center;flex-shrink:0;transition:.2s}
.ag-invoer button:hover{background:var(--goud-diep)}
.ag-invoer button:active{transform:scale(.94)}
.ag-invoer button svg{width:19px;height:19px;stroke:currentColor;fill:none;stroke-width:1.9;stroke-linecap:round;stroke-linejoin:round}
.ag-voet{padding:0 18px 12px;font-size:11.5px;color:var(--ink-soft);text-align:center;line-height:1.4}

@media (max-width:640px){
  .ag-knop{right:16px;bottom:16px;padding:13px 18px 13px 14px;font-size:13px}
  .ag-knop span{display:none}
  .ag-paneel{right:0;left:0;bottom:0;width:auto;max-width:none;border-radius:22px 22px 0 0;max-height:88dvh}
}
@media (prefers-reduced-motion:reduce){
  .ag-knop,.ag-paneel,.ag-bericht{transition-duration:.01ms!important;animation:none!important}
  .ag-punt,.ag-typt i{animation:none!important}
}