/* CA P1 four new worlds — cinematic compatible layer for P0 atlas.css */
.p1-hero .hero-content{max-width:790px}
.p1-hero .hero-art .nasa-picture{height:100%}
.p1-hero .hero-art img{height:100%;width:100%;object-fit:cover;object-position:57% 42%;filter:saturate(1.12) contrast(1.06)}
.p1-hero .hero-art .hero-overlay{background:linear-gradient(90deg,rgba(2,7,23,.95),rgba(3,9,25,.80) 28%,rgba(4,9,25,.36) 62%,rgba(1,6,18,.13)),linear-gradient(0deg,#040914d6,transparent 22%)}
.p1-hero .hero-content{padding-top:97px;padding-bottom:125px}
.p1-hero .hero-lead{font-size:clamp(18px,2.2vw,26px)}
.p1-hero .hero-intro{background:linear-gradient(90deg,#0412298a,transparent);border-radius:10px}
.p1-evidence{background:#061123!important}
.p1-evidence img{object-fit:contain!important;filter:saturate(1.04) contrast(1.02)!important;mix-blend-mode:normal!important}
.p1-evidence:before{display:none!important}
.evidence-frame .p1-evidence{padding:5px!important}
.evidence-frame .p1-evidence img{border-radius:9px}
.p1-evidence .picture-kind{z-index:3}
.p1lab{background:radial-gradient(ellipse at 65% 39%,#14325b,#060e23 70%)}
.p1-buttons{display:flex;flex-wrap:wrap;gap:8px;margin:0 0 13px}
.p1-buttons button{background:#0e2a4a;border:1px solid #76b4e875;border-radius:12px;color:#d3e8fa;padding:11px 15px;font-size:13px;font-weight:850;min-height:47px;transition:.2s}
.p1-buttons button.active{color:#031423;border-color:#75e9ff;background:linear-gradient(120deg,#82e9ff,#d4ffff);box-shadow:0 0 18px #54caf647}
.p1-buttons button:hover{transform:translateY(-1px);border-color:#e8faff}
.p1-live{font-size:14px;color:#d9f1fc;font-weight:700;min-height:2.7em;margin:0}
.p1-footnote{font-size:11px;line-height:1.7;color:#a1bed6;margin:12px 0 0}
.tylos-universe{height:390px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 49% 58%,#0d3660,#050f24 62%),radial-gradient(2px 2px at 72% 21%,#eaffff,transparent 95%)}
.tylos-universe::before{content:"";position:absolute;inset:0;background-image:radial-gradient(1.6px 1.6px at 15% 22%,#d7eaff,transparent),radial-gradient(2px 2px at 81% 69%,#bfefff,transparent),radial-gradient(1px 1px at 75% 17%,#a3d5ff,transparent);opacity:.7}
.tylos-core{position:absolute;left:50%;top:57%;transform:translate(-50%,-50%);width:220px;aspect-ratio:1;border-radius:50%;background:radial-gradient(ellipse at 72% 30%,#ffe0a5 1%,#d68c48 11%,#745f6c 38%,#1b3248 65%,#040812 81%),repeating-linear-gradient(23deg,#7bbab4 0 7px,#8fabb6 9px 13px,#b78e6b 19px 23px);box-shadow:inset -43px -33px 55px #001422c7,0 0 53px #5ea6b540;border:1px solid #a5d9e06b}
.wind-layer{position:absolute;left:50%;top:56%;border-radius:50%;transform:translate(-50%,-50%) rotate(-16deg);transition:opacity .35s,box-shadow .35s;opacity:.28;pointer-events:none}
.wind-layer:after{content:"❯";color:inherit;font-size:25px;position:absolute;right:5%;top:25%;text-shadow:0 0 15px currentColor}
.wind-fe{width:270px;height:245px;border:9px solid #36e09d;border-left-color:transparent;border-bottom-color:transparent;box-shadow:0 0 28px #28df9570;color:#70ffd0;animation:windturn 11s linear infinite}
.wind-na{width:350px;height:302px;border:11px solid #ffd378;border-left-color:transparent;border-bottom-color:transparent;box-shadow:0 0 33px #ffd37849;color:#ffe08b;animation:windturn 7s linear infinite reverse}
.wind-h{width:435px;height:346px;border:7px solid #4ebaff;border-left-color:transparent;border-bottom-color:transparent;box-shadow:0 0 31px #3caeff51;color:#8fdcff;animation:windturn 16s linear infinite}
body[data-page="tylos"][data-wind="fe"] .wind-fe,body[data-page="tylos"][data-wind="na"] .wind-na,body[data-page="tylos"][data-wind="h"] .wind-h{opacity:1;filter:brightness(1.6)}
body[data-page="tylos"] .tylos-universe .layer-tag{position:absolute;z-index:2;bottom:14px;left:50%;transform:translateX(-50%);border:1px solid #a2ddff6b;background:#06182cd9;padding:10px 15px;border-radius:99px;color:#e5faff;font-weight:900;font-size:14px;white-space:nowrap}
@keyframes windturn{to{transform:translate(-50%,-50%) rotate(344deg)}}
#janssenSvg{max-height:365px;filter:drop-shadow(0 4px 20px #6e26184c)}
.j-bar{border-radius:99px;background:#233550;overflow:hidden;border:1px solid #7fa7c84a;height:17px;margin:10px 0}
.j-bar span{display:block;width:90%;height:100%;background:linear-gradient(90deg,#ff6b36,#ffe18d);box-shadow:0 0 15px #ff993e70;transition:width .16s}
.glass-scene{height:380px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 77% 22%,#2d78ca 0%,#092e73 35%,#030b28 78%)}
.glass-globe{position:absolute;left:48%;top:42%;transform:translate(-50%,-50%);width:min(72%,390px);aspect-ratio:1;border-radius:50%;background:radial-gradient(circle at 78% 31%,#c4edff 1%,#5282d8 12%,#163e92 40%,#101b53 66%,#030817 82%), repeating-linear-gradient(-16deg,transparent 0 13px,#8bbaf333 15px 19px,transparent 26px 35px);box-shadow:inset -55px -38px 65px #030a1bb8,0 0 45px #6dc4ff70;border:2px solid #b5e9ff57}
.glass-globe::after{content:"";position:absolute;inset:5%;border-radius:50%;background:repeating-linear-gradient(24deg,transparent 0 14px,#b2e3ff23 16px 18px,transparent 23px 34px);transform:rotate(-19deg)}
.glass-particles{position:absolute;inset:0;pointer-events:none;transform:skewX(-23deg)}
.glass-shard{position:absolute;width:2px;height:clamp(13px,2.7vw,27px);top:-10%;background:linear-gradient(180deg,transparent,#e5ffff,#55baff,transparent);box-shadow:0 0 6px #7be5ffb0;opacity:.8;animation:glassStorm 1.8s linear infinite;animation-delay:var(--delay)}
@keyframes glassStorm{to{transform:translate(260px,540px)}}
.glass-label{position:absolute;bottom:18px;left:14px;padding:9px 12px;border-radius:12px;border:1px solid #8cc9ff7b;color:#e2f6ff;background:#051b40cc;font-weight:800;font-size:12px}
.mirror-stage{height:380px;position:relative;overflow:hidden;background:radial-gradient(ellipse at 73% 56%,#145a73 0%,#091c43 39%,#030b22 77%)}
.mirror-world{position:absolute;width:230px;height:230px;border-radius:50%;left:51%;top:46%;transform:translate(-50%,-50%);background:radial-gradient(circle at 32% 28%,#fff 0%,#d4edfa 9%,#82bdce 28%,#225b80 56%,#0b193c 74%,#020717 87%);box-shadow:0 0 55px #82ecff70,inset -35px -32px 49px #081327ed;border:1px solid #c8edff99;filter:brightness(var(--shine,1.7));transition:filter .3s,box-shadow .3s}
.mirror-world::after{content:"";position:absolute;inset:7%;border-radius:50%;background:repeating-linear-gradient(27deg,transparent 0 14px,#fff6 16px 18px,transparent 22px 31px);opacity:.42}
.mirror-beam{position:absolute;left:-20%;top:5%;width:100%;height:50%;background:linear-gradient(22deg,transparent 31%,#a4e8ff2b 49%,#ffffff33 50%,transparent 61%);transform:rotate(5deg)}
.mirror-glint{position:absolute;left:63%;top:14%;width:80px;height:80px;pointer-events:none;filter:drop-shadow(0 0 20px white);background:radial-gradient(circle,#fff 0%,#fff7 4%,transparent 17%),linear-gradient(90deg,transparent 43%,#edffffba 50%,transparent 57%),linear-gradient(0deg,transparent 45%,#e4ffffa8 50%,transparent 55%);animation:mirrorTwinkle 4.2s ease-in-out infinite}
@keyframes mirrorTwinkle{50%{opacity:.46;transform:scale(.74)}}
.mirror-number{position:absolute;right:18px;bottom:14px;font-weight:950;font-size:39px;color:white;letter-spacing:-.04em;text-shadow:0 3px 20px #64f4ff}
.mirror-number small{font-size:17px;margin-left:5px}
.mirror-stars{position:absolute;inset:0;background-image:radial-gradient(2px 2px at 14% 25%,#e4ffff,transparent),radial-gradient(1px 1px at 74% 24%,#e4ffff,transparent),radial-gradient(2px 2px at 24% 78%,#b2d8ff,transparent);opacity:.8;pointer-events:none}
@media(min-width:960px){body[data-page="cuancoa"] .p1-hero .hero-art img{object-position:50% 38%}}
@media(max-width:760px){.p1-hero .hero-content{padding-top:300px;padding-bottom:112px}.p1-hero .hero-art img{object-position:58% top}.p1-buttons{gap:6px}.p1-buttons button{font-size:12px;padding:9px 10px;flex:1 1 auto}.tylos-universe,.glass-scene,.mirror-stage{height:315px}.tylos-core{width:160px}.wind-fe{width:205px;height:170px}.wind-na{width:252px;height:221px}.wind-h{width:297px;height:258px}.mirror-world{width:190px;height:190px}.glass-label{font-size:10px}.mirror-number{font-size:32px}.evidence-frame .p1-evidence{min-height:205px}}
@media(prefers-reduced-motion:reduce){.wind-layer,.glass-shard,.mirror-glint{animation:none!important}}
/* Keep longer Japanese P1 hero headings balanced on desktop */
@media(min-width:761px){.p1-hero h1{font-size:clamp(40px,4.5vw,61px);max-width:770px;letter-spacing:-.07em}}

/* Iron and hydrogen layers mark altitude only; they do not rotate as though the winds followed closed orbits. */
.wind-fe,.wind-h{animation:none!important}

/* v1.3 fix: the glass-rain globe was taller than its 380px stage and its top was cut off */
.glass-globe{width:min(72%,330px);top:46%}
