/* The prologue is a native modal: the page beneath cannot steal keyboard focus. */
body.castle-intro-active{overflow:hidden}
.cinema{position:fixed;z-index:10000;overflow:hidden;isolation:isolate}
.cinema .castle-intro-world,.cinema .castle-intro-art,.cinema .castle-intro-canvas,.cinema .castle-intro-vignette{position:absolute;inset:0;width:100%;height:100%}
.cinema .castle-intro-world{overflow:hidden}
.cinema .castle-intro-canvas{display:block;z-index:2}
.cinema .castle-intro-vignette{z-index:4;pointer-events:none}
.cinema .castle-intro-ui{position:absolute;z-index:5}
.cinema .castle-intro-copy{display:flex;flex-direction:column;text-align:center}
.cinema .castle-intro-skip{position:absolute;background:none;cursor:pointer}
.cinema .castle-intro-enter{display:flex;align-items:center;cursor:pointer}
.cinema .castle-intro-progress>span{display:block;height:100%}
.cinema .castle-intro-status{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip-path:inset(50%);white-space:nowrap}
.castle-intro.cinema{margin:0;padding:0;border:0;max-width:none;max-height:none;width:100%;height:100dvh;inset:0;background:#080a10;color:#f8eddb;display:none;transform:none;animation:none;--cinema-gold:#d5b47a;--cinema-progress:0%}
.castle-intro.cinema[open]{display:block}
.cinema::backdrop{background:#080a10}
.cinema .castle-intro-world{background:#10101a;perspective:1000px}
.cinema .castle-intro-world:after{content:"";position:absolute;z-index:3;inset:0;background:radial-gradient(circle at 50% 48%,#21143c 0,#0d0a18 42%,#080a10 100%);opacity:0;pointer-events:none;transition:opacity .32s ease}
.cinema.is-loading .castle-intro-world:after{opacity:1}
.cinema .castle-intro-art{opacity:1;transform:scale(1.03);object-fit:cover;filter:brightness(.72) saturate(.8);transition:filter 1.4s,transform 5s}
.cinema .castle-intro-canvas{opacity:0;transition:opacity .12s}
.cinema.has-scene .castle-intro-canvas{opacity:1}
.cinema-fallback-doors{position:absolute;inset:8% 0 2%;width:min(62vh,92vw);margin:auto;display:flex;perspective:1000px;opacity:0;transition:opacity .18s;filter:brightness(.85);box-shadow:0 0 0 16px #14141b,0 0 0 19px #665138,0 0 80px 50px #090a13}
.cinema-fallback-doors i{width:50%;height:100%;background-image:url('./intro-door-realistic.webp');background-size:200% 100%;transform-origin:left center;transition:transform 2.4s cubic-bezier(.42,0,.15,1)}
.cinema-fallback-doors i+ i{background-position:right center;transform-origin:right center}
.cinema.has-scene .cinema-fallback-doors{opacity:0}
.cinema .castle-intro-vignette{background:linear-gradient(0deg,rgba(4,5,10,.96),rgba(4,5,10,.62) 17%,transparent 49%,rgba(4,5,10,.2) 75%,rgba(4,5,10,.64)),radial-gradient(ellipse,transparent 30%,rgba(3,4,10,.55) 110%);transition:opacity 1.3s}
.cinema-grain{position:absolute;inset:0;z-index:4;pointer-events:none;opacity:.06;background-image:url("data:image/svg+xml,%3Csvg viewBox='0 0 180 180' xmlns='http://www.w3.org/2000/svg'%3E%3Cfilter id='n'%3E%3CfeTurbulence type='fractalNoise' baseFrequency='.85' numOctaves='3' stitchTiles='stitch'/%3E%3C/filter%3E%3Cpath fill='%23fff' filter='url(%23n)' d='M0 0h180v180H0z'/%3E%3C/svg%3E")}
.cinema .castle-intro-ui{display:block;padding:0;inset:0;pointer-events:none}
.cinema button{pointer-events:auto;font-family:inherit}
.cinema .castle-intro-enter{font-size:12px;font-weight:500;line-height:1.2}
.cinema .castle-intro-skip{font-size:14px;font-weight:400;line-height:1.4}
.cinema .castle-intro-kicker{font-size:10px;font-weight:500;line-height:1.4}
.cinema .castle-intro-copy>p{font-size:9px;font-weight:400;line-height:1.4}
.cinema .castle-intro-brand{position:absolute;top:34px;left:44px;width:auto;display:flex;flex-direction:column;align-items:flex-start;gap:6px;opacity:1;transform:none;animation:none;color:#f3e9d5}
.cinema .castle-intro-brand strong{align-self:auto;font-family:Georgia,serif;font-size:16px;font-weight:400;letter-spacing:.2em;line-height:1.2}
.cinema .castle-intro-brand small{align-self:auto;font-family:inherit;font-size:9px;color:#bbac95;letter-spacing:.31em;margin:0}
.cinema .castle-intro-skip{top:30px;right:44px;min-height:44px;padding:8px 0 8px 18px;border:none;border-radius:0;color:#eee3d1;opacity:1;font:400 14px/1.4 inherit;letter-spacing:.04em;text-transform:none}
.cinema .castle-intro-skip span{margin-left:14px;color:var(--cinema-gold);font-size:19px}
.cinema .castle-intro-copy{position:absolute;left:22px;right:22px;bottom:12%;margin:0;align-items:center;text-shadow:0 3px 30px #04050a;transition:opacity .55s,transform .9s;animation:none;transform:none}
.cinema .cinema-bottom{transition:opacity .35s ease}
.cinema.is-loading .castle-intro-copy,.cinema.is-loading .cinema-bottom{opacity:0;pointer-events:none}
.cinema .castle-intro-kicker{padding:0;border:0;border-radius:0;background:none;backdrop-filter:none;color:#d3b985;font:500 10px/1.4 inherit;letter-spacing:.28em;opacity:1;animation:none}
.cinema .castle-intro-copy h2{margin:19px 0 22px;font:400 clamp(42px,4.5vw,70px)/.95 Georgia,'Times New Roman',serif;letter-spacing:-.035em;text-transform:none}
.cinema .castle-intro-copy h2 br{display:none}
.cinema .castle-intro-copy h2 em{font:italic 400 1em/.95 Georgia,'Times New Roman',serif;color:#dfc08c;padding-left:.14em}
.cinema .castle-intro-enter{gap:26px;padding:15px 22px;border:1px solid #bca477;border-radius:2px;background:rgba(15,14,21,.58);color:#f1e5cc;box-shadow:inset 0 0 20px rgba(213,180,122,.025),0 3px 30px rgba(0,0,0,.32);backdrop-filter:blur(8px);font:500 12px/1.2 inherit;letter-spacing:.18em;opacity:1;transform:none;animation:none;transition:background .25s,border-color .25s,box-shadow .25s}
.cinema .castle-intro-enter i{width:auto;height:auto;display:inline;background:none;box-shadow:none;color:var(--cinema-gold);font:400 20px/1 Georgia,serif}
.cinema .castle-intro-enter:hover{background:rgba(75,54,29,.7);border-color:#ffe4a9;box-shadow:0 0 36px rgba(207,156,62,.2);transform:none}
.cinema button:focus-visible{outline:2px solid #ffe4a9;outline-offset:6px}
.cinema .castle-intro-copy>p{font:400 9px/1.4 inherit;letter-spacing:.23em;color:#aa9e8b;margin:17px 0 0;opacity:1;animation:none;transform:none}
.cinema-bottom{position:absolute;bottom:30px;left:44px;right:44px;display:flex;align-items:center;justify-content:space-between;gap:20px}
.cinema-chapter{font-size:10px;letter-spacing:.18em;color:#c9b794}
.cinema-sound{min-height:44px;padding:8px 0 8px 18px;border:0;background:none;color:#c8bdad;font-size:12px;letter-spacing:.03em}
.cinema-sound span{margin-left:12px;color:#dfc08c;font-size:18px}
.cinema-sound[aria-pressed=true]{color:#ffe3a9}
.cinema .castle-intro-progress{position:absolute;bottom:0;left:0;width:100%;height:2px;margin:0;background:rgba(213,180,122,.08);opacity:1;animation:none}
.cinema .castle-intro-progress>span{width:var(--cinema-progress);background:#c6a66a;box-shadow:0 0 8px #c6a66a;transition:none}
.cinema-arrival{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;gap:16px;opacity:0;transform:translateY(14px);text-align:center;text-shadow:0 3px 30px #0e0a16;transition:opacity 1.2s,transform 1.6s}
.cinema-arrival span{font-size:11px;letter-spacing:.35em;color:#f2ddb6}
.cinema-arrival strong{font:italic 400 clamp(46px,6vw,92px)/1 Georgia,serif;letter-spacing:-.035em;color:#fff1db}
.cinema.is-opening .castle-intro-copy{opacity:0;transform:translateY(20px);filter:none;animation:none;pointer-events:none}
.cinema.is-opening .castle-intro-copy button{pointer-events:none}
.cinema.is-opening .castle-intro-brand,.cinema.is-opening .castle-intro-skip{opacity:1}
.cinema.is-opening .castle-intro-progress>span{width:var(--cinema-progress)}
.cinema.is-opening .castle-intro-art{filter:brightness(.9) saturate(.9);transform:scale(1.13)}
.cinema.is-opening .castle-intro-vignette{opacity:.65}
.cinema.is-opening:after{display:none}
.cinema.is-arriving .cinema-arrival{opacity:1;transform:none}
.cinema.is-leaving{opacity:0;transform:none;animation:none;transition:opacity .7s}
.cinema.is-static .cinema-fallback-doors{opacity:.95}
.cinema.is-static.is-opening .cinema-fallback-doors i{transform:rotateY(-88deg)}
.cinema.is-static.is-opening .cinema-fallback-doors i+i{transform:rotateY(88deg)}
.replay-intro{margin-top:24px;padding:8px 0;border:0;border-bottom:1px solid rgba(255,255,255,.28);background:none;color:#dcd3ed;font-size:12px;cursor:pointer}
.replay-intro[hidden]{display:none}
.replay-intro:hover{color:#fff;border-color:#fff}
@media(min-width:900px){.cinema .castle-intro-world{inset:4vh 0;height:92vh}.cinema .castle-intro-copy{bottom:12%}}
@media(max-width:600px){.cinema .castle-intro-brand{top:max(25px,env(safe-area-inset-top));left:22px}.cinema .castle-intro-brand strong{font-size:12px;letter-spacing:.16em}.cinema .castle-intro-brand small{font-size:8px;letter-spacing:.18em}.cinema .castle-intro-skip{top:19px;right:22px;font-size:12px}.cinema .castle-intro-copy{bottom:16%;left:18px;right:18px}.cinema .castle-intro-kicker{font-size:8px;letter-spacing:.18em}.cinema .castle-intro-copy h2{font-size:43px;line-height:1.06;margin:18px 0 24px}.cinema .castle-intro-copy h2 br{display:block}.cinema .castle-intro-copy h2 em{padding-left:0}.cinema .castle-intro-enter{font-size:11px;padding:16px 20px;gap:22px}.cinema-bottom{bottom:max(20px,env(safe-area-inset-bottom));left:22px;right:22px}.cinema-chapter{font-size:8px;letter-spacing:.1em}.cinema-sound{font-size:11px}.cinema-arrival span{font-size:9px;letter-spacing:.23em}.cinema-arrival strong{font-size:47px}}
@media(max-height:520px) and (orientation:landscape){.cinema .castle-intro-copy{bottom:14%}.cinema .castle-intro-copy h2{font-size:36px;margin:8px 0 13px}.cinema .castle-intro-copy>p{display:none}.cinema .castle-intro-enter{padding:10px 17px}.cinema .castle-intro-brand{top:20px}.cinema-bottom{bottom:10px}}
@media(prefers-reduced-motion:reduce){.cinema *{animation:none!important;transition:none!important}.cinema .castle-intro-art,.cinema.is-opening .castle-intro-art{transform:none}.cinema .cinema-fallback-doors{display:none}.cinema.is-opening .castle-intro-copy{transform:none}.cinema.is-leaving{transition:opacity .12s}.cinema-arrival{transform:none}}
