.ke-scene{position:fixed;inset:0;z-index:100000;isolation:isolate;overflow:hidden;background:#080e18;color:#f6edd9;font-family:Inter,Arial,sans-serif;min-height:320px}
.ke-scene *{box-sizing:border-box}.ke-scene [hidden]{display:none!important}
.ke-vista{position:absolute;inset:-3%;background:url('/media/kingdom-vista.svg') center 58%/cover no-repeat;transform:scale(1);transition:transform 7s cubic-bezier(.2,.55,.25,1),filter 3s}
.ke-open .ke-vista{transform:scale(1.1)}
.ke-haze{position:absolute;inset:0;background:linear-gradient(#03071066,transparent 30%,#05091233 60%,#05080ef2),radial-gradient(ellipse at center,transparent 25%,#03070d99);pointer-events:none}
.ke-brand{position:absolute;top:max(32px,env(safe-area-inset-top));left:42px;z-index:5;font-size:13px;letter-spacing:.28em;line-height:1.7;color:#efe3c8}.ke-brand b{font:italic 24px Georgia,serif;color:#e1bd77}.ke-brand span{display:block;font-size:8px;letter-spacing:.27em;color:#b9b5ad;margin-top:3px}
.ke-skip{position:absolute;z-index:6;right:34px;top:36px;border:1px solid #c8b17c44;border-radius:30px;background:#0a111b99;color:#d3ccbc;font:11px Inter,Arial,sans-serif;padding:12px 18px;cursor:pointer}.ke-skip span{margin-left:10px;color:#dab879}
.ke-architecture{position:absolute;inset:0;perspective:1200px;pointer-events:none}.ke-gates{position:absolute;width:min(960px,86vw);height:92%;bottom:-5%;left:50%;transform:translateX(-50%);perspective:1500px}
.ke-leaf{position:absolute;top:0;width:50%;height:100%;transition:transform 3.9s cubic-bezier(.42,0,.2,1),opacity 3.9s;backface-visibility:hidden;filter:drop-shadow(0 8px 20px #000)}.ke-leaf svg{display:block;width:100%;height:100%}.ke-leaf-left{left:0;transform-origin:left center}.ke-leaf-right{right:0;transform-origin:right center}
.ke-open .ke-leaf-left{transform:rotateY(-107deg);opacity:.5}.ke-open .ke-leaf-right{transform:rotateY(107deg);opacity:.5}
.ke-pillar{position:absolute;bottom:-5%;width:max(7vw,40px);height:83%;background:linear-gradient(90deg,#090f18,#28303a 44%,#121922 78%,#090e17);border:1px solid #b3955c45;box-shadow:0 0 45px #000a;transition:transform 5s,opacity 4s}.ke-pillar:before{content:'';position:absolute;top:-15px;left:-15%;width:130%;height:24px;border-block:2px solid #a58b54;background:linear-gradient(90deg,#141b24,#444132,#141b24)}.ke-pillar:after{content:'';position:absolute;top:23%;left:50%;height:46px;width:5px;background:#ffe3a0;box-shadow:0 0 12px 4px #fac977aa,0 0 65px 24px #eaae442e;border-radius:50%}.ke-pillar-left{right:calc(50% + min(480px,43vw))}.ke-pillar-right{left:calc(50% + min(480px,43vw))}
.ke-seal{position:absolute;top:49%;left:50%;transform:translate(-50%,-50%);width:98px;height:118px;border:1px solid #c6a064;border-radius:48% 48% 46% 46%;background:linear-gradient(135deg,#2f302c,#0a111c 65%);box-shadow:0 0 0 7px #131a22,0 0 0 8px #947644,0 15px 45px #000;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#e1bf7a;transition:opacity .65s,transform 1s}.ke-seal span{font-size:26px}.ke-seal b{font:italic 43px Georgia,serif;line-height:1}.ke-open .ke-seal{opacity:0;transform:translate(-50%,-50%) scale(1.1)}
.ke-intro{position:absolute;bottom:15%;left:20px;right:20px;text-align:center;text-shadow:0 2px 20px #000;transition:opacity .6s,transform .8s}.ke-intro span{font-size:9px;letter-spacing:.35em;color:#d9bd85}.ke-intro p{font:normal clamp(24px,3vw,38px) Georgia,serif;margin:15px 0}.ke-open .ke-intro{opacity:0;transform:translateY(10px)}
.ke-welcome{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;text-align:center;padding:90px 24px 70px;background:linear-gradient(transparent,#050b168c 30%,#050b16b3 62%,transparent);animation:ke-reveal 1.5s both}
.ke-rule{display:flex;align-items:center;gap:18px;color:#dfc28b;font-size:9px;letter-spacing:.32em}.ke-rule:before,.ke-rule:after{content:'';height:1px;width:42px;background:linear-gradient(90deg,transparent,#be985b)}.ke-rule:after{transform:rotate(180deg)}
.ke-welcome h1{font:400 clamp(48px,6.7vw,100px)/1.06 Georgia,'Times New Roman',serif;letter-spacing:-.045em;margin:24px 0 18px;text-shadow:0 4px 45px #030712}.ke-welcome h1 em{font-weight:400;color:#e8c88b}.ke-welcome p{font-size:13px;letter-spacing:.08em;color:#c8c7c5;margin:0 0 34px}
.ke-enter{display:flex;gap:40px;align-items:center;padding:17px 26px;border:1px solid #e5c487;background:linear-gradient(115deg,#b68c46,#ead09a);color:#17150f;font:600 12px Inter,Arial,sans-serif;letter-spacing:.035em;cursor:pointer;box-shadow:0 5px 35px #d6ae5020;transition:filter .2s,transform .2s}.ke-enter:hover{filter:brightness(1.1);transform:translateY(-2px)}.ke-enter span{font-size:20px;font-weight:400}
.ke-scene button:focus-visible{outline:2px solid #faf3df;outline-offset:6px}
.ke-bottom{position:absolute;left:16px;right:16px;bottom:max(28px,env(safe-area-inset-bottom));display:flex;align-items:center;justify-content:center;gap:20px;font-size:8px;letter-spacing:.25em;color:#aca797;pointer-events:none}.ke-bottom i{height:3px;width:3px;background:#b89350;transform:rotate(45deg)}
.ke-instant *{transition:none!important;animation:none!important}
@keyframes ke-reveal{from{opacity:0;transform:translateY(15px)}to{opacity:1;transform:translateY(0)}}
@media(max-width:600px){.ke-brand{top:23px;left:20px;font-size:11px}.ke-brand span{font-size:7px}.ke-skip{top:27px;right:18px;padding:10px 12px;font-size:10px}.ke-gates{width:90vw;height:83%;bottom:0}.ke-pillar-left{right:95%}.ke-pillar-right{left:95%}.ke-pillar{height:74%}.ke-seal{width:76px;height:94px}.ke-seal b{font-size:34px}.ke-vista{background-size:auto 100%;background-position:center}.ke-welcome h1{font-size:clamp(42px,11vw,66px)}.ke-bottom{gap:12px;font-size:7px}.ke-rule{gap:12px;font-size:8px}.ke-rule:before,.ke-rule:after{width:26px}}
@media(max-height:520px){.ke-welcome{padding:65px 15px 40px}.ke-welcome h1{font-size:44px;margin:12px 0}.ke-welcome p{margin-bottom:16px}.ke-enter{padding:10px 20px}.ke-bottom{bottom:12px}.ke-intro{bottom:10%}}
@media(prefers-reduced-motion:reduce){.ke-scene *{animation:none!important;transition:none!important}.ke-open .ke-vista{transform:none}}

.ke-completion .ke-welcome h1{font-size:clamp(48px,6vw,86px);margin:18px 0 14px}.ke-completion .ke-welcome p{margin-bottom:22px;max-width:90%;line-height:1.5}.ke-reward{display:flex;align-items:center;gap:14px;border:1px solid #c7a36666;background:#0b1421b3;padding:12px 23px;margin:0 0 26px;color:#ebcc8e;box-shadow:0 0 45px #dfb35712}.ke-reward svg{width:65px;height:30px;stroke:#e6c279;stroke-width:2}.ke-reward span{font-size:11px;letter-spacing:.08em}.ke-completion .ke-welcome{animation:ke-reveal 1.5s both}@media(max-width:600px){.ke-completion .ke-welcome h1{font-size:56px}.ke-reward{gap:10px;padding:10px 16px}.ke-completion .ke-rule{font-size:7px;letter-spacing:.2em}}@media(max-height:560px){.ke-completion .ke-welcome h1{font-size:38px;margin:10px 0}.ke-completion .ke-welcome p{margin-bottom:12px}.ke-reward{margin-bottom:14px;padding:5px 16px}.ke-reward svg{height:23px}}