/* Single visual contract: the founder's original illustrated concept. */
:root { font-family:'Comic Sans MS','Trebuchet MS',sans-serif;--concept-cream:#fff5dc;--concept-ink:#073e47;--concept-teal:#249eaa; }
#parade-app{color:var(--concept-ink);background:#173f40;position:absolute;left:50%;top:50%;transform:translate(-50%,-50%);width:min(100vw,calc(100dvh * 16 / 9));height:min(56.25vw,100dvh);container-type:size}
#parade-stage{width:100%;height:100%;left:0;top:0;transform:none;aspect-ratio:auto}
.parade-panel{max-height:calc(100cqh - 24px)}
body{background:#173e3d}
.parade-hud-top{top:max(12px,var(--parade-safe-top));left:max(16px,var(--parade-safe-left));right:max(16px,var(--parade-safe-right));align-items:flex-start}
.parade-hud-actions{gap:13px}
.hero-medallion{width:clamp(64px,8cqw,112px);height:clamp(64px,8cqw,112px);background:#bfe4de;border:5px solid #fff8df;outline:2px solid #315f58;box-shadow:inset 0 0 0 3px #538b88,0 4px 0 #4c765a55}
.hero-medallion>img{left:50%;top:0;transform:translateX(-50%);height:153%;width:auto;max-width:none}
.hero-medallion>span{display:none}
.hero-medallion>img[src^="data:"]{inset:0;transform:none;width:100%;height:100%;object-fit:cover}
.concept-map{border:0!important;background:transparent!important;box-shadow:none!important;width:clamp(64px,7.6cqw,110px);height:clamp(64px,7.6cqw,110px);padding:0;transform:rotate(-6deg)}
.concept-map>svg{width:100%;height:100%;filter:drop-shadow(1px 3px 0 #29473e70)}
.parade-goal{position:absolute;left:50%;transform:translateX(-50%);top:0;max-width:57%;min-height:clamp(53px,6.7cqw,82px);padding:8px 25px;gap:17px;border:3px solid #b9a777;border-radius:31px;background:linear-gradient(#fffbe8,#fff4d5);box-shadow:inset 0 0 0 4px #fffcf0,0 5px 0 #506b5b55;font-size:clamp(19px,2.45cqw,36px);line-height:1.15;color:var(--concept-ink)}
.parade-goal>img,.parade-goal>svg{width:clamp(32px,4cqw,51px);height:clamp(32px,4cqw,51px);flex:none}
.concept-pause{width:clamp(54px,6.1cqw,84px);height:clamp(58px,6.6cqw,91px);border:3px solid #536951;border-radius:23px;background:#fff5d8;box-shadow:inset 0 0 0 4px #fffced,0 3px #365f5355}
.concept-pause>svg{width:70%;height:70%}
.parade-inventory{left:auto;right:max(16px,var(--parade-safe-right));transform:none;bottom:max(17px,var(--parade-safe-bottom));padding:10px 16px;border:3px solid #b9a477;border-radius:28px;background:#fff5dcee;box-shadow:inset 0 0 0 4px #fffcf0,0 4px #31584955;gap:10px}
#parade-app:has(#parade-dialogue:not(:empty)) .parade-inventory{bottom:calc(28cqh + 14px)}
.inventory-item{width:clamp(54px,6.1cqw,90px);min-height:clamp(49px,5.9cqw,80px);border:2px solid transparent;border-radius:19px;background:transparent}
.inventory-item>img{width:80%;height:54px;object-fit:contain}
.inventory-item.selected{background:#d0ece4;border-color:#49a5af;box-shadow:0 0 0 2px #f7ffff,0 0 10px #81dbf3}
.inventory-item>span{font-size:12px}
.speech-bubble{position:absolute;left:0;right:0;bottom:0;transform:none;width:100%;height:28cqh;min-height:150px;max-height:none;margin:0;display:flex;align-items:center;gap:20px;padding:30px 28px 25px 25%;border:4px solid #b4aa7e;border-radius:45px 45px 0 0;background:linear-gradient(105deg,#fff8e5,#fff5dc 55%,#fffbe9);box-shadow:inset 0 0 0 6px #fffdf1,0 -4px 0 #48684d44;font-size:clamp(26px,3.7cqw,54px);line-height:1.2;overflow:visible}
.speech-bubble:before,.speech-bubble:after{content:'';position:absolute;width:125px;height:130px;pointer-events:none;opacity:.18;background:radial-gradient(ellipse at 52% 20%,#769d6b 0 12%,transparent 13%),radial-gradient(ellipse at 75% 38%,#769d6b 0 15%,transparent 16%),radial-gradient(ellipse at 34% 43%,#769d6b 0 14%,transparent 15%),radial-gradient(ellipse at 54% 70%,#769d6b 0 13%,transparent 14%)}
.speech-bubble:before{right:-3px;top:0;transform:rotate(-28deg)}
.speech-bubble:after{left:0;bottom:0;transform:rotate(130deg)}
.speech-bubble .speech-portrait{position:absolute;left:-1.2%;bottom:0;width:26%;height:47cqh;max-height:none;object-fit:contain;object-position:bottom;filter:drop-shadow(2px 1px 0 #fff7df)}
.hero-portrait-window{position:absolute;left:-1%;bottom:0;width:24%;height:38cqh;overflow:hidden;pointer-events:none}
.speech-bubble .hero-portrait-window .speech-portrait{position:absolute;inset:0 auto auto 0;width:100%;height:auto;max-height:none;object-fit:initial;object-position:top;filter:none}
.hero-portrait-window.has-photo{left:1%;width:21%;height:34cqh;border:4px solid #fff6dc;border-radius:44% 44% 0 0}
.speech-bubble .hero-portrait-window .photo-portrait{width:100%;height:100%;object-fit:cover;object-position:center}
.speech-bubble.npc-speech .speech-portrait{height:40cqh;width:23%;left:0}
.speech-bubble .speech-copy{flex:1;min-width:0;align-self:stretch;display:flex;flex-direction:column;justify-content:center;gap:17px}
.speech-bubble .speaker{display:table;align-self:flex-start;margin:0;padding:5px 29px;border-radius:28px;background:#c7ddd0;color:#083e48;font-size:clamp(23px,3.2cqw,42px);line-height:1.1;font-weight:bold}
.speech-bubble .speech-copy p{margin:0;font-weight:bold}
.speech-controls{display:flex;align-items:center;align-self:center;gap:24px;margin-left:10px;z-index:1}
.speech-bubble .speech-audio{width:clamp(53px,6cqw,90px);height:clamp(53px,6cqw,90px);background:#fff3d3;border:3px solid #a4a088;box-shadow:inset 0 0 0 4px #fff8e5;color:#154d56}
.speech-bubble .speech-next{width:clamp(75px,9cqw,139px);height:clamp(75px,9cqw,139px);padding:14px;background:linear-gradient(135deg,#37b8bf,#16929f);border:4px solid #125f6d;box-shadow:inset 0 0 0 5px #89d7d4,0 4px 0 #77988a;color:#fffaf0}
.speech-bubble .speech-next>svg{width:70%;height:70%;filter:drop-shadow(1px 2px 0 #256c74)}
.speech-bubble .speech-audio>svg{width:55%;height:55%}
.action-bubble{background:#fff6d9;border:2px solid #54694c;box-shadow:0 3px 0 #37644b44;transform:translate(-50%,-50%) rotate(-7deg);width:clamp(40px,5cqw,73px);height:clamp(40px,5cqw,73px)}
.action-bubble:after{background:#fff6d9}
.interactive-cue>.object-art,.boarding-friend.interactive-cue>.parade-actor{filter:saturate(1.14) brightness(1.035)}
.painted-cue{position:absolute;inset:0;pointer-events:none;background-repeat:no-repeat;filter:saturate(1.22) brightness(1.045);mask-image:radial-gradient(ellipse,black 32%,transparent 72%);transition:filter 180ms}
.scene-object .object-art{transition:filter 180ms}
.scene-object.chosen-target>.object-art{filter:saturate(1.3) brightness(1.11)}
.scene-object.chosen-target>.painted-cue{filter:saturate(1.35) brightness(1.13)}
.scene-object .object-halo,.building-aura,.window-destination::before{display:none!important}
@media(hover:hover){
 .scene-object:not([data-discovery="true"]):hover>.object-art{filter:saturate(1.25) brightness(1.09)}
 .scene-object:not([data-discovery="true"]):hover>.painted-cue{filter:saturate(1.3) brightness(1.1)}
}
.world-portal{border:0;background:transparent;border-radius:25%;min-width:44px;min-height:44px}
.path-portal>.painted-cue{mask-image:radial-gradient(ellipse,black 12%,transparent 67%)}
.world-portal .object-label{font-size:14px}
.scene-exit{display:none}
.parade-button{font-family:inherit;border-radius:24px;background:linear-gradient(#36b4ba,#1b98a3);border:3px solid #84d1cf;box-shadow:0 4px #276976;color:#fffbea}
.clubhouse-board{left:33%;top:16%;width:25%;height:23%;gap:4%}
.crew-pin{box-shadow:none;border-color:#c9a876}
.parade-title{background:#fff5de;border:4px solid #b5a377;border-radius:35px;box-shadow:inset 0 0 0 5px #fffdf1,0 12px 35px #193e3c55}
.parade-title h1{font-family:inherit;color:#164e55}
.parade-title .title-cast{height:100px}
.parade-title .title-cast img{filter:drop-shadow(0 3px 0 #6f957044)}
.parade-panel{font-family:inherit;color:#164e55;background:#fff7e1}
.hero-thought{pointer-events:none;position:absolute;z-index:3}
.hero-thought .action-bubble{left:0!important;top:0!important}
.bridge-span>img{width:100%;height:100%;object-fit:contain}
.pickup-token{position:absolute;width:6%;aspect-ratio:1;z-index:5;pointer-events:none;animation:packed-picture 750ms ease-out both}
.pickup-token img{width:100%;height:100%;object-fit:contain}
@keyframes packed-picture{0%{opacity:0;transform:translate(-50%,0) scale(.65)}25%{opacity:1;transform:translate(-50%,-18%) scale(1)}75%{opacity:1}100%{opacity:0;transform:translate(-50%,-75%) scale(.65)}}
.gentle .pickup-token{animation:none;opacity:1}
@media(prefers-reduced-motion:reduce){.pickup-token{animation:none}.painted-cue,.scene-object .object-art{transition:none}}
.ice-tray{position:absolute;left:36%;top:73%;width:61%;height:22%;border:3px solid #b9a477;border-radius:28px;background:#fff6dceF;box-shadow:inset 0 0 0 5px #fffdf0;pointer-events:none}
.ice-piece{z-index:2}.ice-test{z-index:3}.ice-test .parade-button{font-size:clamp(16px,2cqw,28px);padding:13px 20px}
#parade-app[data-scene="crossing"] .parade-inventory{display:none}
#parade-toast{font-size:15px;max-width:65cqw;top:100px}
@media(max-height:520px) and (orientation:landscape){
 .parade-hud-top{top:9px;left:11px;right:11px}.parade-hud-actions{gap:8px}
 .hero-medallion{width:59px;height:59px;border-width:3px}.concept-map{width:59px;height:59px}
 .concept-pause{width:49px;height:54px;border-radius:16px;border-width:2px}
 .parade-goal{min-height:47px;font-size:20px;padding:6px 16px;gap:10px;border-width:2px;border-radius:24px;max-width:56%}
 .parade-goal>img,.parade-goal>svg{width:32px;height:32px}
 .speech-bubble{height:29cqh;min-height:110px;padding:12px 15px 11px 24%;border-radius:28px 28px 0 0;border-width:3px;font-size:25px;gap:10px}
 .speech-bubble .speech-copy{gap:9px}.speech-bubble .speaker{font-size:23px;padding:3px 20px}
 .speech-bubble.npc-speech .speech-portrait{height:35cqh}
 .hero-portrait-window{height:38cqh;width:24%}.hero-portrait-window.has-photo{height:33cqh}
 .speech-controls{gap:11px;margin-left:0}.speech-bubble .speech-audio{width:47px;height:47px;border-width:2px;padding:6px}
 .speech-bubble .speech-next{width:68px;height:68px;border-width:3px;padding:7px;box-shadow:inset 0 0 0 3px #89d7d4,0 3px #77988a}
 .speech-bubble .speech-next>svg{width:80%;height:80%}
 .parade-inventory{padding:5px 10px;bottom:10px;right:11px;border-radius:23px;border-width:2px;gap:5px}
 #parade-app:has(#parade-dialogue:not(:empty)) .parade-inventory{bottom:calc(29cqh + 8px)}
 .inventory-item{width:52px;min-height:46px}.inventory-item>img{height:37px}.inventory-item>span{font-size:10px}
 .action-bubble{width:37px;height:37px}.parade-title .title-cast{height:66px}#parade-toast{top:66px;font-size:12px}
}
@media(orientation:portrait){
 .parade-hud-top{top:12px}.hero-medallion,.concept-map{width:58px;height:58px}.concept-pause{width:49px;height:56px}
 .parade-goal{top:72px;max-width:94%;width:max-content;font-size:20px;min-height:47px}
 .speech-bubble{min-height:165px;height:25cqh;padding:14px 13px 14px 28%;font-size:23px;gap:8px;flex-wrap:nowrap}
 .speech-bubble .speech-copy{flex-basis:auto;gap:9px}.speech-bubble.npc-speech .speech-portrait{height:31cqh;width:31%}.hero-portrait-window{height:36cqh;width:26%}.speech-bubble .speaker{font-size:21px;padding:4px 15px}
 .speech-controls{gap:5px;margin:0}.speech-bubble .speech-audio{display:none}.speech-bubble .speech-next{width:54px;height:54px;padding:4px}
 .parade-inventory{bottom:28cqh;right:12px}.inventory-item{width:47px}
}