/* ADO: one composition and one owner for its scene, photo, cases and controls. */
.luggage-photo-clue{position:absolute;inset:4% 19% auto;z-index:3;height:39%;padding:5px 5px 22px;background:#f8eacb;box-shadow:2px 4px 12px #071f4466;rotate:-2deg}
.luggage-photo-clue img{display:block;width:100%;height:100%;object-fit:contain;background:#e1d4b7}
.luggage-photo-clue img[hidden]{display:none}
.luggage-photo-clue p{position:absolute;bottom:1px;left:0;right:0;text-align:center;font:700 10px/1.4 system-ui,sans-serif;color:#533f31;margin:3px}
.luggage-photo-clue .luggage-photo-loading{inset:30% 6% auto}
.luggage-time{position:absolute;left:10%;top:47%;width:80%;height:5px;accent-color:#e3b866}
.luggage-photo-retry{position:absolute;left:8%;right:8%;top:55%;font-size:12px;min-height:44px}
.luggage-case{position:absolute;width:19%;aspect-ratio:1.15;min-width:48px;min-height:48px;translate:-50% calc(-100% - 4px);transform-origin:50% calc(100% + 4px);border:2px solid #e6bd7a;border-radius:9px;background:linear-gradient(115deg,#ffffff30,transparent 40%),var(--case-color);box-shadow:3px 6px 0 #173c4a66,inset 0 0 0 3px #e4b58033;transform:rotate(-6deg);color:#1a3f47;padding:0;touch-action:manipulation}
.case-handle{position:absolute;top:-8px;left:32%;width:36%;height:9px;border:3px solid #7c5d3c;border-bottom:0;border-radius:5px 5px 0 0}.case-belt{position:absolute;inset:0 67% 0 23%;background:#e8bc7988;border-left:1px solid #724d35;border-right:1px solid #724d35}.case-tag{position:relative;display:block;width:95%;padding:3px;background:#fff1c9;rotate:5deg;font:700 clamp(9px,2.4vw,13px)/1.2 system-ui,sans-serif}.luggage-case small{position:absolute;bottom:4px;right:5px;font:700 8px system-ui,sans-serif;color:#fff3c7}.luggage-case[hidden]{display:none}
.case-stamp{position:absolute;top:7%;right:8%;display:grid;place-items:center;width:44%;height:49%;border-radius:40% 34% 39% 32%;color:var(--case-color);background:var(--case-accent);box-shadow:0 0 0 1px #fff5d5,1px 2px 2px #19292b80;rotate:9deg}
.case-stamp svg{display:block;width:100%;height:100%}
.case-flag{position:absolute;top:15%;left:10%;width:21%;aspect-ratio:3/2;rotate:-8deg}
.case-flag::before,.case-flag::after{position:absolute;inset:0;border:1px solid #fff5df;border-radius:1px}
.luggage-case[data-destination="copenhagen"] .case-flag::before,.luggage-case[data-destination="malmo"] .case-flag::before,.luggage-case[data-destination="malmo"] .case-flag::after{content:'';background:linear-gradient(transparent 41%,var(--flag-cross) 41% 59%,transparent 59%),linear-gradient(90deg,transparent 31%,var(--flag-cross) 31% 44%,transparent 44%),var(--flag-field)}
.luggage-case[data-destination="copenhagen"] .case-flag{--flag-cross:#fff7df;--flag-field:#a92336}
.luggage-case[data-destination="malmo"] .case-flag{--flag-cross:#ffd15b;--flag-field:#24577b}
.luggage-case[data-destination="malmo"] .case-flag::after{--flag-field:#aa2537;transform:translate(33%,73%) rotate(14deg)}
.case-wheel{position:absolute;bottom:-6px;left:13%;width:74%;height:5px;background:linear-gradient(90deg,#102b3b 0 15%,transparent 15% 85%,#102b3b 85%);border-radius:2px}
.luggage-result{position:absolute;z-index:30;left:5%;right:5%;top:43%;padding:14px 9px;background:#ffce60;color:#153a50;border:2px solid #fff4d3;border-radius:8px;box-shadow:4px 5px #071d35aa;text-align:center;font:850 clamp(15px,4vw,20px)/1.25 system-ui,sans-serif}
.luggage-result[data-kind="error"]{background:#b91d50;color:#fff7db}.luggage-result[hidden]{display:none}
.luggage-experience .luggage-photo-clue:before{content:'';position:absolute;top:-5px;left:38%;width:26%;height:13px;background:#eab546bf;rotate:3deg}
.luggage-experience .luggage-time[data-urgent="true"]{accent-color:#ff7c9e}
.luggage-experience .case-tag{position:absolute;bottom:9%;left:2%;width:96%;box-sizing:border-box;padding:3px 0;color:#183d54;border:1px dashed #b69b74;box-shadow:1px 2px #071c2c44}
.luggage-experience .luggage-case{container-type:inline-size}
.luggage-experience .luggage-case[data-bag-style="trunk"]{width:21%;aspect-ratio:1.32;border-radius:5px;transform:rotate(-4deg)}
.luggage-experience .luggage-case[data-bag-style="carry"]{width:17%;aspect-ratio:.89;border-radius:7px;transform:rotate(3deg)}
.luggage-experience .luggage-case[data-bag-style="hard"]{background:repeating-linear-gradient(90deg,transparent 0 5px,#fff2 6px 7px),var(--case-color)}
.luggage-experience .luggage-case .case-tag{font-size:min(12px,calc(146cqw / var(--tag-length, 10)));letter-spacing:-.025em;white-space:nowrap;rotate:0deg}
/* ADO phone composition uses the painted terminal and its own conveyor. */
#surprise.has-dismiss:has(.luggage-experience){width:min(440px,calc(100% - 24px));padding:0;border:0;border-radius:10px;background:#123e47;color:#fff8de;box-shadow:0 20px 80px #071e36aa}
#surprise:has(.luggage-experience)::before,#surprise:has(.luggage-experience)::after{display:none}
#surprise:has(.luggage-experience) :is(#surprise-title,#day-label),.luggage-experience .scene-subtitle{position:absolute;width:1px;height:1px;margin:-1px;padding:0;overflow:hidden;clip-path:inset(50%)}
.luggage-experience{position:relative}
.luggage-experience .play-scene{max-width:100%;aspect-ratio:1122/1402;border:0;border-radius:10px 10px 0 0;background-size:100% 100%;background-blend-mode:normal;background-color:#e7d4aa}
.luggage-experience .play-scene::before{content:none}
#surprise .luggage-experience .scene-hud{position:absolute;inset:2% 4% auto;z-index:26;width:max-content;max-width:92%;box-sizing:border-box;min-height:0;margin:0 auto;padding:3px 8px;border-radius:3px;background:#153b47e8;color:#fff3d2;font:700 12px/1.3 system-ui,sans-serif;text-align:center}
#surprise:has(.luggage-experience)>.dialog-dismiss{--modal-control-ink:#a72b61}
#surprise:has(.luggage-experience)>.dialog-dismiss svg{stroke-width:2px}
.luggage-experience .luggage-photo-clue{inset:10% 20% auto;height:17%;z-index:25;rotate:-1deg;border-radius:2px;padding:4px 4px 17px;box-shadow:2px 4px 8px #102e4555}
.luggage-experience .luggage-time{top:28%;height:5px;left:20%;width:60%;accent-color:#ffc64f}
.luggage-experience .luggage-case{width:18.5%;aspect-ratio:1.1;border-color:#e6d1a8;box-shadow:2px 4px 4px #102b3b88,inset 0 0 0 2px #fff4d32e}
.luggage-experience .luggage-result{top:43%;padding:10px 8px;border:1px solid #fff1cf;border-radius:3px;box-shadow:0 3px 12px #173d4777}
.luggage-experience .scene-status{position:absolute;width:1px;height:1px;margin:-1px;padding:0;min-height:0;overflow:hidden;clip-path:inset(50%)}
#surprise .luggage-experience .luggage-start{min-height:48px;padding:10px 20px;border:0;border-left:6px solid #ffc64f;border-radius:5px;background:#153d49;color:#fff3d2;font:400 19px/1.1 'Lilita One',sans-serif;box-shadow:2px 3px 0 #183e4744;cursor:pointer}
.luggage-experience .play-scene>.luggage-start{position:absolute;bottom:10%;left:50%;transform:translateX(-50%) rotate(-2deg);z-index:26;white-space:nowrap}
#surprise .luggage-experience .scene-ending{margin:0;border:0;border-radius:0;background:#fff2d6;padding:18px;color:#173d47}
#surprise .luggage-experience .scene-ending h3{color:#173d47}
.luggage-experience .scene-ending>.luggage-start{display:block;margin:16px auto 0}
.luggage-experience .luggage-photo-clue p{font-size:12px}

#surprise .luggage-intro{position:absolute;inset:0;z-index:45;margin:0;display:flex;flex-direction:column;justify-content:center;gap:14px;background:#123c45e8;backdrop-filter:blur(3px);padding:24px;color:#fff1cb;text-align:center;opacity:1;transition:opacity .25s;pointer-events:none}
#surprise .luggage-intro[hidden]{display:none}
#surprise .luggage-intro span{font:400 clamp(30px,8vw,44px)/1.05 'Lilita One',sans-serif}
#surprise .luggage-intro small{font:16px/1.5 system-ui,sans-serif}
#surprise .luggage-intro.is-leaving{opacity:0}
@media(prefers-reduced-motion:reduce){#surprise .luggage-intro{transition:none;backdrop-filter:none}}
