/* Dickyland 15.0 | Sprekende 3D-paleiswacht en speelse diepte */
.royal-agent{position:fixed;left:auto;right:clamp(6px,1.7vw,30px);bottom:8px;width:clamp(180px,17vw,252px);height:clamp(280px,42vh,400px);z-index:180;filter:drop-shadow(0 16px 20px #02081788);touch-action:none;user-select:none;-webkit-user-select:none;pointer-events:none;transition:opacity .32s ease,visibility .32s ease}
.royal-agent.is-dragging{filter:drop-shadow(0 19px 23px #000b);transition:none!important;z-index:500}
.royal-agent.is-hidden-viewport{opacity:0;visibility:hidden;pointer-events:none}
body.home:not(.film-ended) .royal-agent{opacity:0!important;visibility:hidden!important;pointer-events:none!important}
.agent-halo{position:absolute;bottom:29px;left:8%;right:8%;height:45px;border-radius:50%;background:radial-gradient(ellipse,#fbd88b85 0%,#95724724 32%,transparent 72%);filter:blur(10px);pointer-events:none}
.agent-view{position:absolute;inset:0 0 37px;touch-action:none;pointer-events:auto;cursor:grab;outline-offset:-9px;border-radius:60% 60% 20% 20%}
.agent-view:active{cursor:grabbing}
.agent-view canvas{width:100%;height:100%;display:block;pointer-events:none}
.agent-fallback{position:absolute;bottom:10px;left:16%;width:68%;height:78%;object-fit:contain;object-position:bottom center;filter:drop-shadow(0 14px 14px #000c);pointer-events:none;opacity:.97}
.royal-agent.model-ready .agent-fallback{opacity:0;visibility:hidden}
.agent-podium{position:absolute;bottom:28px;left:16%;right:16%;height:25px;display:flex;align-items:center;justify-content:space-around;border:1px solid #f5d18b;background:linear-gradient(160deg,#d6a450,#62401b 60%,#201522);border-radius:50% / 45%;box-shadow:0 8px 0 #33211c,0 18px 25px #0009,inset 0 3px 8px #ffe9b872;transform:perspective(240px) rotateX(20deg);pointer-events:none;color:#fff4ca;font:900 8px/1 Cinzel,serif;letter-spacing:1px;text-shadow:0 2px 3px #000}
.agent-podium b{font-size:17px;color:#fff1b5}
.agent-voice-controls{position:absolute;bottom:0;left:0;right:0;display:flex;gap:5px;align-items:center;justify-content:center;pointer-events:auto}
.agent-voice-start,.agent-drag-grip{height:34px;border-radius:25px;border:1px solid #f5ca7e;background:linear-gradient(145deg,#172e50,#08162b);color:#ffe4aa;box-shadow:0 5px 16px #0008;font:800 10px Manrope,Arial,sans-serif;letter-spacing:.1px}
.agent-voice-start{padding:5px 13px;min-width:118px;white-space:nowrap}
.agent-voice-start[aria-pressed=true]{background:linear-gradient(135deg,#a77730,#654122);color:#fff9db}
.agent-voice-start span:first-child{font-size:13px;display:inline-block;margin-right:4px}
.agent-drag-grip{width:37px;font-size:20px;cursor:grab;touch-action:none}
.agent-drag-grip:active{cursor:grabbing}
.royal-agent.speaking .agent-podium{box-shadow:0 8px 0 #33211c,0 12px 31px #edbc73a6,inset 0 3px 8px #ffe9b872}
.royal-agent:not(.model-ready) .agent-view{background:linear-gradient(180deg,transparent 60%,rgba(4,13,28,.14))}
@media(max-width:700px){.royal-agent{width:155px;height:270px;right:5px;bottom:max(5px,env(safe-area-inset-bottom));z-index:185}.agent-podium{bottom:31px;height:19px}.agent-podium span{font-size:6px}.agent-voice-start{font-size:9px;min-width:98px;height:31px;padding:4px 7px}.agent-drag-grip{height:31px;width:32px}.agent-voice-controls{bottom:0}}
/* Responsive depth, not a large 3D engine running beneath page contents */
.world-card,.dossier-card,.money-note,.bank-wallet{transform-style:preserve-3d;backface-visibility:hidden;will-change:transform}
.world-card{transition:transform .3s cubic-bezier(.2,.8,.2,1),box-shadow .3s ease;box-shadow:0 19px 28px #0008,0 3px 0 #8b5d36,inset 0 1px #fff2}
.world-card:hover{box-shadow:0 31px 45px #0009,0 8px 0 #8b5d36,0 0 33px #eeb96a2f}
.world-card-img{position:relative;overflow:hidden}
.world-card-img:after{content:'';position:absolute;inset:0;background:linear-gradient(116deg,transparent 15%,#fff5 28%,transparent 44%);transform:translateX(-150%);transition:transform .7s ease;pointer-events:none}
.world-card:hover .world-card-img:after{transform:translateX(160%)}
.world-card-icon,.world-card-label strong,.dossier-card-body strong{transform:translateZ(26px)}
.island-map-frame{transform:perspective(1400px) rotateX(1.5deg);box-shadow:0 35px 0 -23px #977444,0 45px 60px #000b,0 0 0 7px #fbe1ae17;transition:transform .6s ease}
.island-map-frame:hover{transform:perspective(1400px) rotateX(0deg) scale(1.012)}
.agent-dossiers{isolation:isolate;position:relative;overflow:hidden;padding:clamp(75px,9vw,135px) clamp(15px,4vw,60px);background:radial-gradient(ellipse at 54% -12%,#3e47696b,transparent 57%),radial-gradient(ellipse at 95% 73%,#5e361a45,transparent 41%),linear-gradient(155deg,#07182f,#131628 60%,#070e1d);border-top:1px solid #e0b5682e;border-bottom:1px solid #e0b5682e}
.agent-dossiers:before{content:'D';position:absolute;font:900 min(37vw,590px)/1 Cinzel,Georgia,serif;color:#dab3670a;top:12%;right:-6%;z-index:-1;pointer-events:none}
.dossiers-orbit{position:absolute;top:4%;left:-10%;width:55vw;height:55vw;max-width:690px;max-height:690px;border:1px solid #edd39317;border-radius:50%;box-shadow:0 0 0 65px #d4a45406,0 0 0 128px #d4a45403;pointer-events:none}
.dossiers-heading{max-width:880px;text-align:center;margin:0 auto clamp(30px,5vw,65px)}
.dossiers-heading h2{font:800 clamp(35px,4.4vw,70px)/1.14 Cinzel,Georgia,serif;color:#ffe9bd;margin:13px auto 19px;text-wrap:balance}
.dossiers-heading h2 em{font-style:normal;color:#f2ba6a}
.dossiers-heading p{color:#d7dfec;font-size:clamp(13px,1.18vw,17px);line-height:1.7;max-width:710px;margin:auto}
.dossiers-grid{display:grid;grid-template-columns:repeat(3,minmax(0,1fr));gap:clamp(13px,2vw,28px);width:min(1320px,100%);margin:auto;perspective:1500px}
.dossier-card{height:clamp(330px,36vw,450px);width:100%;position:relative;display:block;overflow:hidden;text-align:left;color:#fff;border:1px solid #deb170;background:linear-gradient(165deg,#192e4e,#080d1b);border-radius:15px;padding:0;transform-style:preserve-3d;box-shadow:0 12px 0 #261a17,0 26px 40px #0009;transition:transform .35s cubic-bezier(.2,.8,.2,1),box-shadow .35s ease}
.dossier-card:hover,.dossier-card:focus-visible{transform:perspective(1200px) translateY(-8px) rotateX(2deg);box-shadow:0 19px 0 #261a17,0 37px 50px #000b}
.dossier-card-art{position:absolute;inset:0;display:block;background-position:center;background-size:cover;filter:saturate(1.08) contrast(1.02);transition:transform .6s ease;transform:scale(1.05)}
.dossier-card:hover .dossier-card-art{transform:scale(1.13)}
.dossier-card:after{content:'';position:absolute;inset:0;background:linear-gradient(180deg,#07111b05 10%,#07111b88 50%,#030916 95%);pointer-events:none}
.dossier-stamp{position:absolute;z-index:2;top:21px;left:19px;padding:7px 11px;border:1px solid #ffe3a4;border-radius:5px;background:#091b35bd;color:#ffe3a4;font:800 9px Manrope,sans-serif;letter-spacing:1.2px;transform:translateZ(25px)}
.dossier-card-body{position:absolute;z-index:3;left:22px;right:22px;bottom:20px;display:flex;flex-direction:column;gap:10px;transform:translateZ(22px)}
.dossier-tag{color:#ffd08d;letter-spacing:2px;font:800 10px Manrope,sans-serif}
.dossier-card-body strong{font:800 clamp(22px,2.3vw,34px)/1.14 Cinzel,Georgia,serif;color:#fff6da}
.dossier-card-body small{font:550 12px/1.6 Manrope,sans-serif;color:#e6e1d9}
.dossier-listen{display:flex;align-items:center;justify-content:space-between;gap:15px;min-height:38px;padding:9px 13px;border:1px solid #e6be70;background:#c58d42;color:#111b2a;font:850 11px Manrope,sans-serif;margin-top:6px;border-radius:6px}
.dossier-listen b{font-size:17px}
@media(max-width:800px){.dossiers-grid{grid-template-columns:1fr;max-width:460px}.dossier-card{height:290px}.dossiers-heading h2{font-size:clamp(28px,7vw,45px)}.island-map-frame{transform:none}}
@media(prefers-reduced-motion:reduce){.dossier-card,.world-card,.dossier-card-art,.island-map-frame{transition:none!important}.dossiers-orbit{display:none}}


/* Dickyland 18.5: clean floating agent without visible buttons below. */
.royal-agent{width:clamp(165px,17vw,235px);height:clamp(255px,37vh,350px);right:clamp(8px,1.2vw,18px);bottom:12px;filter:drop-shadow(0 26px 26px rgba(0,0,0,.42)) drop-shadow(0 10px 32px rgba(238,189,104,.14));}
.agent-view{inset:0;outline-offset:-8px;border-radius:58% 58% 22% 22%;}
.agent-fallback{bottom:0;left:14%;width:72%;height:88%;}
.agent-halo{bottom:4px;left:5%;right:5%;height:52px;background:radial-gradient(ellipse,rgba(249,214,136,.72) 0%,rgba(149,114,71,.2) 34%,transparent 72%);filter:blur(14px);}
.agent-podium,.agent-voice-controls,.agent-ui-ghost{display:none!important;}
@media(max-width:740px){.royal-agent{width:122px;height:205px;right:2px;bottom:max(6px,env(safe-area-inset-bottom));}.agent-view{inset:0}.agent-fallback{width:73%;height:90%;left:13%;}}

/* Dickyland 18.7: natuurlijker licht en meer rust rond de nieuwe Agent. */
.royal-agent{filter:drop-shadow(0 20px 25px rgba(0,0,0,.42)) drop-shadow(0 2px 15px rgba(255,224,165,.12))!important;}
.royal-agent .agent-view{border-radius:54% 54% 17% 17%;touch-action:none;}
.royal-agent .agent-halo{bottom:0;opacity:.65;filter:blur(12px);}
.royal-agent.speaking .agent-halo{opacity:.79;filter:blur(9px);}
.royal-agent.model-ready .agent-fallback{display:none}
.royal-agent .agent-view:focus-visible{outline:2px solid rgba(255,221,152,.85);outline-offset:-5px}
.royal-agent.is-dragging{filter:drop-shadow(0 27px 30px rgba(0,0,0,.60))!important}
@media(max-width:700px){.royal-agent{filter:drop-shadow(0 13px 19px rgba(0,0,0,.45))!important}}
#royal-agent .agent-view{inset:0!important}
#royal-agent .agent-ui-ghost,#royal-agent .agent-voice-controls,#royal-agent .agent-podium{display:none!important}

/* Dickyland 19.2: extra ruimte voor levendiger 3D-agent. */
.royal-agent{width:clamp(170px,18vw,248px);height:clamp(270px,39vh,372px)}
.royal-agent.speaking .agent-halo{transform:scale(1.06);opacity:.88;transition:transform .22s ease,opacity .22s ease}
@media(max-width:740px){.royal-agent{width:126px;height:214px}}

/* Dickyland 20.7: click-driven animation props, no new chatbot UI. */
.royal-agent .agent-comedy-fx {
  position:absolute;z-index:8;left:50%;top:16%;transform:translate(-50%,-50%);
  pointer-events:none;user-select:none;color:#ffdc7e;
  font:900 clamp(15px,2.5vw,29px)/1.1 Georgia,serif;
  letter-spacing:.12em;text-shadow:0 2px 8px #031123,0 0 12px #ffecb6;
  animation:agent-comedy-spark 1.4s ease-out both;
}
.royal-agent .agent-fx-badge {top:36%;left:58%;animation:agent-comedy-spark 1.7s ease-out both}
.royal-agent .agent-fx-nose {top:20%;left:62%;animation:agent-comedy-spark 1.3s ease-out both}
.royal-agent .agent-fx-ticket {
  top:43%;left:32%;padding:10px 8px;border-radius:3px;letter-spacing:.08em;
  border:2px solid #b98a51;background:#f6edcf;color:#5f1b15;
  font:900 clamp(10px,1.7vw,17px)/1.1 Georgia,serif;
  text-shadow:none;box-shadow:0 7px 14px #0009;
  animation:agent-comedy-ticket 2.5s ease-in-out both;
}
@keyframes agent-comedy-spark {
  0%{opacity:0;transform:translate(-50%,-30%) scale(.3) rotate(-15deg)}
  21%{opacity:1;transform:translate(-50%,-65%) scale(1.15) rotate(9deg)}
  75%{opacity:1;transform:translate(-50%,-120%) scale(.9) rotate(-5deg)}
  100%{opacity:0;transform:translate(-50%,-145%) scale(.72) rotate(12deg)}
}
@keyframes agent-comedy-ticket {
  0%,10%{opacity:0;transform:translate(-50%,-40%) scale(.55) rotate(-16deg)}
  25%,80%{opacity:1;transform:translate(-50%,-50%) scale(1) rotate(-5deg)}
  100%{opacity:0;transform:translate(-50%,-70%) scale(.85) rotate(6deg)}
}
@media (prefers-reduced-motion:reduce){
  .royal-agent .agent-comedy-fx{animation:none!important;opacity:1!important}
}
/* Small comic accessories help suggest a flying hat and a loose belt clasp.
   The original GLB's cap and belt are baked into a single skinned mesh. */
.royal-agent .agent-flying-cap {
  display:block;position:absolute;width:32px;height:20px;left:10px;top:-10px;
  border-radius:65% 65% 12% 12%;background:linear-gradient(135deg,#254f76,#08172c);
  border:1px solid #d7b473;box-shadow:0 3px 4px #07101bc9;
  animation:agent-cap-fly 1.36s ease-out both;
}
.royal-agent .agent-flying-cap::after {
  content:'';position:absolute;left:5px;right:-7px;bottom:-5px;height:7px;
  border-radius:55% 35% 55% 35%;background:#102a47;border:1px solid #b5955d;
}
.royal-agent .agent-loose-buckle {
  display:block;position:absolute;width:25px;height:19px;left:3px;top:44px;
  border:4px solid #e9c274;border-radius:3px;
  box-shadow:0 1px 2px #0007;transform:rotate(0deg);
  animation:agent-loose-belt 1.7s ease-in-out both;
}
@keyframes agent-cap-fly {
  0%{opacity:0;transform:translate(-22px,8px) rotate(-8deg) scale(.8)}
  16%{opacity:1}
  45%{opacity:1;transform:translate(40px,-42px) rotate(70deg) scale(1)}
  90%{opacity:.85;transform:translate(85px,-26px) rotate(240deg) scale(.75)}
  100%{opacity:0;transform:translate(100px,-14px) rotate(315deg) scale(.55)}
}
@keyframes agent-loose-belt {
  0%,15%{opacity:0;transform:rotate(0deg) translateY(0)}
  30%{opacity:1;transform:rotate(-25deg) translateY(0)}
  65%{opacity:1;transform:rotate(36deg) translateY(13px)}
  100%{opacity:0;transform:rotate(70deg) translateY(27px)}
}
@media(prefers-reduced-motion:reduce){
  .royal-agent .agent-flying-cap,.royal-agent .agent-loose-buckle{animation:none!important}
}

/* Dickyland 20.8: more expressive reactions on a small mobile-sized model. */
.royal-agent.model-ready .agent-view canvas{transform-origin:50% 78%;transition:transform .24s ease-out}
.royal-agent.model-ready.speaking .agent-view canvas{transform:scale(1.065)}
.royal-agent.model-ready.agent-comedy-playing .agent-view canvas{transform:scale(1.12)}
.royal-agent.agent-comedy-playing .agent-halo{opacity:.88;filter:blur(8px)}
.royal-agent .agent-fx-head{font-size:clamp(20px,3vw,38px);top:6%}
.royal-agent .agent-fx-nose{font-size:clamp(25px,3vw,42px);top:14%}
@media(max-width:740px){.royal-agent.model-ready.agent-comedy-playing .agent-view canvas{transform:scale(1.085)}}
@media(prefers-reduced-motion:reduce){.royal-agent.model-ready .agent-view canvas{transition:none;transform:none!important}}



/* 21.0: No drawn-on mouth or fake flying props. Full 3D facial and body motion. */
.royal-agent.model-ready.agent-comedy-playing .agent-view canvas {transform:scale(1.07)}
.royal-agent.agent-comedy-playing .agent-halo {opacity:.74;filter:blur(10px)}
@media(max-width:740px){.royal-agent.model-ready.agent-comedy-playing .agent-view canvas{transform:scale(1.05)}}

/* 21.1: Geen klikgrappen. Eenmalige knop wanneer de browser autoplay blokkeert. */
#royal-agent .agent-comedy-fx,#royal-agent .agent-flying-cap,#royal-agent .agent-loose-buckle{display:none!important}
#royal-agent.agent-comedy-playing .agent-view canvas{transform:none!important}
#royal-agent .agent-voice-unlock{
 position:absolute;z-index:15;top:-41px;right:0;min-height:35px;max-width:200px;
 padding:8px 13px;border-radius:9px;border:1px solid #e2b77a;
 background:#0e273b;color:#f4dfb5;font:700 12px/1.3 Manrope,Arial,sans-serif;
 box-shadow:0 6px 20px #0008;white-space:nowrap;pointer-events:auto;cursor:pointer;
}
#royal-agent .agent-voice-unlock[hidden]{display:none!important}
#royal-agent .agent-voice-unlock:focus-visible{outline:3px solid #ffdf9f;outline-offset:2px}
@media(max-width:740px){#royal-agent .agent-voice-unlock{top:-35px;font-size:11px;padding:6px 9px}}

/* Dickyland 22.4: contact shadow follows the walking cadence instead of floating. */
.royal-agent .agent-halo{transform-origin:50% 70%;transition:opacity .18s ease,filter .18s ease,transform .10s linear}
.royal-agent.dg200-walking .agent-halo{transform:scaleX(var(--agent-shadow-scale,1)) scaleY(.72);opacity:.76;filter:blur(10px)}
