/* A fitted 16:9 scene keeps live controls anchored to the approved stone paths. */
.shell:has(.cloud-journey){height:100dvh;min-height:0;overflow:hidden;background:#c9e3ef}
.menu:has(.cloud-journey){height:100%;min-height:0;padding:0;display:block}
.menu:has(.cloud-journey)>.menu-top,.menu:has(.cloud-journey)>#nav{display:none}
#page.page-island:has(.cloud-journey){position:relative;width:100%;height:100%;max-height:none;padding:0;margin:0;overflow:hidden}
.cloud-journey{height:100%;width:100%;display:grid;place-items:center;isolation:isolate;background:radial-gradient(ellipse at 50% 50%,#e9f6fb,#b5d6e8);color:#163d56;overflow:hidden}
.cloud-scene{position:relative;width:min(100vw,177.6833dvh);aspect-ratio:1672/941;container-type:inline-size;flex:none;isolation:isolate}
.cloud-scene-art{position:absolute;inset:0;width:100%;height:100%;object-fit:fill;user-select:none;pointer-events:none}
.cloud-heading{position:absolute;z-index:3;top:2%;left:50%;transform:translateX(-50%);text-align:center;width:26%;padding:.55cqw 2cqw .8cqw;background:linear-gradient(110deg,#e9f2e4e8,#fffde8f5,#d1dfd6e8);border:1px solid #b1b198;border-radius:45% 45% 22% 22% / 18% 18% 28% 28%;box-shadow:0 .25cqw .8cqw #254e642b,inset 0 0 0 .2cqw #ffffff7a;text-shadow:0 1px #fff}
.cloud-heading>span{font-size:clamp(9px,.8cqw,13px);color:#56756b;letter-spacing:.08em}
.cloud-heading h1{font-size:clamp(19px,2.4cqw,40px);line-height:1.25;margin:0;font-weight:900;color:#123d55}
.cloud-heading p{font-size:clamp(10px,.9cqw,15px);margin:.2cqw 0 0;color:#426874}
.cloud-back{position:absolute;z-index:4;right:2.5%;top:3%;display:flex;gap:.6cqw;align-items:center;padding:.6cqw 1cqw;border-radius:1.3cqw;border:1px solid #b6d4df;background:#f1faffeb;box-shadow:0 3px 12px #29475a22;color:#20485f;font:inherit;font-size:clamp(11px,1cqw,17px);min-height:40px}
.cloud-back svg{width:1.4cqw;min-width:17px;height:1.4cqw;min-height:17px}.cloud-back b{font-size:1.4em}
.cloud-chapters{position:absolute;z-index:3;top:17%;left:50%;transform:translateX(-50%);display:flex;gap:.5cqw;align-items:center;direction:rtl}
.cloud-chapter{display:flex;align-items:center;justify-content:center;gap:.45cqw;white-space:nowrap;font:inherit;font-size:clamp(10px,1cqw,17px);padding:.5cqw 1.2cqw;border:1px solid #d6f6ff;border-radius:1.1cqw;line-height:1.5;box-shadow:0 3px 8px #23526835}
.cloud-chapter.active{background:linear-gradient(#cefaff,#5bbcd4);color:#124969;font-weight:800}
.cloud-chapter.upcoming{background:#e6edf0ed;color:#496879;opacity:1;cursor:default;border-color:#b8c8ce}
.cloud-chapter svg{width:1em;height:1em}.cloud-chapter small{font-size:.78em;font-weight:400;padding-inline-start:.4cqw;border-inline-start:1px solid #416e7a4d}
.cloud-levels{position:absolute;inset:0;list-style:none;margin:0;padding:0;direction:ltr}
.cloud-levels li{position:absolute;left:var(--cx);top:var(--cy);transform:translate(-50%,-50%);width:4.1%;aspect-ratio:1;z-index:2}
.cloud-level{position:relative;display:grid;place-items:center;width:100%;height:100%;padding:0;border-radius:50%;border:.19cqw solid #e9f8ff;background:linear-gradient(150deg,#4d7893,#153b58 70%);box-shadow:0 .22cqw 0 #567c8c,0 .4cqw .65cqw #1339505e,0 0 0 .13cqw #799ca9;color:#fff;opacity:1;cursor:pointer;font:inherit;transition:filter .15s,box-shadow .15s;touch-action:manipulation}
.cloud-level b{font-size:clamp(13px,1.65cqw,28px);line-height:1;font-weight:800}
.cloud-level:disabled{cursor:default;background:linear-gradient(145deg,#7094a8,#335c75);opacity:1;color:#edf7fc}
.cloud-level.is-current{background:linear-gradient(145deg,#d7ffff,#63d5ef);color:#125478;border-color:#f5ffff;box-shadow:0 0 0 .23cqw #259ec5,0 0 0 .5cqw #d5faffaa,0 0 2cqw #70eaff}
.cloud-level.is-done{background:linear-gradient(#38bdbb,#207485)}
.cloud-level-status{position:absolute;right:-6%;bottom:-6%;width:36%;height:36%;border-radius:50%;display:grid;place-items:center;background:#e5f5f9;color:#345c71;box-shadow:0 1px 3px #23465f40}
.cloud-level-status:empty{display:none}.cloud-level-status svg{width:72%;height:72%}
.cloud-start-label{position:absolute;top:125%;left:50%;transform:translateX(-50%);white-space:nowrap;background:#f1fcfff2;color:#1c5670;border:1px solid #9cd9e8;border-radius:2cqw;font-size:clamp(9px,.95cqw,16px);padding:.25cqw .8cqw;box-shadow:0 2px 8px #163d5533;direction:rtl}
.cloud-level:not(:disabled):hover{filter:brightness(1.2)}
.cloud-journey button:focus-visible{outline:3px solid #e59b29;outline-offset:5px}
.cloud-caption{position:absolute;bottom:3%;left:50%;transform:translateX(-50%);width:max-content;max-width:90%;display:flex;align-items:center;justify-content:center;gap:.6cqw;text-align:center;background:#f4fbffdf;backdrop-filter:blur(9px);border:1px solid #bfd6df;border-radius:1.5cqw;padding:.8cqw 1.5cqw;font-size:clamp(10px,1.05cqw,18px);box-shadow:0 3px 15px #325e7b20}
.cloud-caption-detail{border-inline-start:1px solid #a3becb;padding-inline-start:.8cqw;font-size:.83em;color:#577383}.cloud-caption-dot{width:.5cqw;height:.5cqw;background:#1bacbe;border-radius:50%;box-shadow:0 0 .6cqw #51efff}
.cloud-ambience{position:absolute;inset:0;overflow:hidden;pointer-events:none}.cloud-portal-glow{position:absolute;left:21%;top:15%;width:7%;height:14%;background:radial-gradient(ellipse,#71eaff55,transparent 70%);animation:cloud-shimmer 4s ease-in-out infinite}.cloud-mist{position:absolute;bottom:0;width:30%;height:22%;background:radial-gradient(ellipse,#f4fcff88,transparent 70%);filter:blur(1cqw);animation:cloud-drift 13s ease-in-out infinite alternate}.cloud-mist-left{left:-8%}.cloud-mist-right{right:-8%;animation-delay:-7s}.cloud-glint{position:absolute;width:.3%;aspect-ratio:1;border-radius:50%;background:#cffbff;box-shadow:0 0 .6cqw .2cqw #63efff9c;animation:cloud-shimmer 3s ease-in-out infinite}.glint-one{left:33%;top:53%}.glint-two{left:70%;top:59%;animation-delay:-1.4s}
@keyframes cloud-shimmer{0%,100%{opacity:.3}50%{opacity:1}}@keyframes cloud-drift{to{transform:translate(15%,8%)}}
.reduce-motion .cloud-ambience *,.low-quality .cloud-ambience *{animation:none}
@media(prefers-reduced-motion:reduce){.cloud-ambience *{animation:none}}
@media(orientation:portrait){.cloud-scene{width:100vw}.cloud-journey{background:linear-gradient(#c2deed,#f5fbff 45%,#cee5f0)}.cloud-heading{top:-27%;width:60%;padding:12px}.cloud-heading h1{font-size:28px}.cloud-heading>span,.cloud-heading p{font-size:12px}.cloud-back{top:-59%;right:4%;border-radius:14px;padding:8px 12px}.cloud-chapters{top:-6%;gap:7px}.cloud-chapter{font-size:12px;padding:7px 12px;border-radius:10px}.cloud-levels li{width:7.5%}.cloud-level{border-width:2px}.cloud-level b{font-size:14px}.cloud-start-label{font-size:10px;padding:3px 7px}.cloud-caption{bottom:-34%;width:85%;flex-wrap:wrap;padding:12px;font-size:13px;border-radius:16px}.cloud-caption-detail{width:100%;border:0;font-size:11px}.cloud-caption-dot{width:6px;height:6px}}
@media(max-height:460px) and (orientation:landscape){.cloud-heading>span{display:none}.cloud-back{min-height:30px;padding:4px 9px}.cloud-caption{bottom:1%;padding:4px 10px}.cloud-chapter{padding:3px 9px}.cloud-levels li{width:4.8%}.cloud-heading{top:1%}}
@media(pointer:coarse){.cloud-level::before{content:"";position:absolute;inset:-8px;border-radius:50%}}