:root{--bg:#071628;--card:#0b1d31;--line:#24415f;--text:#f7f8fc;--muted:#c0cce0;--violet:#7448ff;--violet2:#5f2feb;--warn:#3b1d2c;--warnline:#844559;--green:#102c27;--greenline:#286959}
*{box-sizing:border-box}body{margin:0;background:radial-gradient(circle at 50% 0,#17335b 0,#071628 48%,#061321 100%);font-family:Inter,ui-sans-serif,system-ui,-apple-system,Segoe UI,Roboto,Arial;color:var(--text);min-height:100vh}.wrap{width:min(1280px,calc(100% - 40px));margin:auto}.nav{display:flex;align-items:center;justify-content:space-between;padding:36px 0 14px}.brand{font-weight:950;font-size:26px;letter-spacing:-.04em;color:white;text-decoration:none;text-shadow:0 2px 0 rgba(116,72,255,.35)}select{background:white;border:0;border-radius:14px;padding:12px 18px;font-weight:800;font-size:16px}.panel{margin:0 auto 40px;border:1px solid var(--line);border-radius:42px;background:rgba(8,28,48,.88);min-height:650px;display:grid;grid-template-columns:1.05fr .95fr;overflow:hidden;box-shadow:0 40px 90px rgba(0,0,0,.25)}.copy{padding:105px 70px}.kicker{color:#6d5dfc;text-transform:uppercase;font-weight:950;letter-spacing:.18em;font-size:14px}.copy h1{font-size:76px;line-height:.96;margin:28px 0 24px;letter-spacing:-.055em}.copy p{max-width:520px;color:var(--muted);font-size:21px;line-height:1.55}.status{margin-top:28px;padding:15px 17px;border-radius:16px;border:1px solid transparent;font-weight:800;max-width:520px;display:none}.status.show{display:block}.status.error{background:var(--warn);border-color:var(--warnline);color:#ffd4d4}.status.ok{background:var(--green);border-color:var(--greenline);color:#cffff2}.btn{display:inline-flex;margin-top:26px;padding:18px 28px;border:0;border-radius:17px;background:linear-gradient(135deg,var(--violet),var(--violet2));color:white;font-weight:950;font-size:16px;cursor:pointer;box-shadow:0 15px 30px rgba(116,72,255,.25)}.btn[disabled]{opacity:.55;cursor:not-allowed}.art{display:flex;align-items:center;justify-content:center;padding:60px 40px}.door{width:min(520px,100%);height:560px;border-radius:20px;border:8px solid #44302c;background:linear-gradient(90deg,#3e2a20 0 49.4%,#2d211c 49.4% 50.6%,#3e2a20 50.6% 100%);box-shadow:inset 0 0 0 2px #74413a,0 20px 50px rgba(0,0,0,.35);position:relative}.door:before,.door:after{content:"";position:absolute;top:70px;width:33%;height:200px;border:3px solid #291a16;box-shadow:0 250px 0 -2px #3e2a20,0 250px 0 0 #291a16}.door:before{left:7%}.door:after{right:7%}.bar{position:absolute;left:9%;right:9%;top:48%;height:22px;background:repeating-linear-gradient(135deg,#7891b3 0 22px,#c2cee0 22px 44px);transform:rotate(-8deg);border-radius:10px;box-shadow:0 4px 12px #0006}.lock{position:absolute;left:50%;top:48%;transform:translate(-50%,-50%);width:96px;height:96px;border-radius:24px;background:linear-gradient(135deg,#ff6635,#ff3f20);display:grid;place-items:center;font-size:42px;box-shadow:0 10px 25px #0006}.mini{font-size:14px!important}.home-card{margin:90px auto;padding:50px;max-width:800px;background:var(--card);border:1px solid var(--line);border-radius:30px}.home-card a{color:#a996ff}@media(max-width:900px){.panel{grid-template-columns:1fr}.art{display:none}.copy{padding:70px 34px}.copy h1{font-size:56px}}@media(max-width:520px){.wrap{width:min(100% - 24px,1280px)}.nav{padding-top:22px}.copy{padding:52px 24px}.copy h1{font-size:48px}.copy p{font-size:18px}.panel{border-radius:28px;min-height:570px}}


}


/* Premium cinematic double-door opening */
.art{position:relative;display:flex;align-items:center;justify-content:center;padding:48px 34px;overflow:hidden;perspective:1800px;background:radial-gradient(circle at 50% 48%,rgba(83,74,255,.12),transparent 52%)}
.door-scene{position:relative;width:min(470px,92%);height:560px;display:flex;align-items:center;justify-content:center;transform-style:preserve-3d}
.portal-glow{position:absolute;inset:62px 34px 28px;border-radius:40px;background:radial-gradient(ellipse at 50% 55%,rgba(255,250,210,.94) 0 10%,rgba(255,204,99,.54) 22%,rgba(113,73,255,.32) 47%,rgba(20,44,79,0) 72%);filter:blur(16px);opacity:.15;transform:scale(.72);transition:opacity .55s ease,transform 1.15s cubic-bezier(.18,.8,.2,1)}
.door-frame{position:relative;width:350px;height:470px;border-radius:24px 24px 10px 10px;padding:16px;background:linear-gradient(135deg,#1a2d46,#071322 45%,#1a2c45);border:1px solid #385473;box-shadow:0 38px 80px rgba(0,0,0,.42),inset 0 0 0 2px rgba(154,188,225,.06),0 0 40px rgba(105,73,255,.08);transform-style:preserve-3d}
.door-frame:before{content:"";position:absolute;left:22px;right:22px;bottom:-18px;height:18px;border-radius:0 0 18px 18px;background:linear-gradient(#203751,#0a1727);box-shadow:0 18px 30px rgba(0,0,0,.28)}
.door-leaf{position:absolute;top:16px;bottom:16px;width:calc(50% - 17px);background:linear-gradient(145deg,#623a27 0%,#42261c 52%,#2c1915 100%);border:2px solid #7f5137;box-shadow:inset 0 0 0 3px #2a1713,inset 0 0 32px rgba(0,0,0,.3);transform-style:preserve-3d;will-change:transform,filter;transition:transform 1.08s cubic-bezier(.16,.84,.18,1),filter .8s ease,box-shadow .8s ease}
.door-left{left:16px;transform-origin:0 50%;border-radius:12px 2px 2px 12px}
.door-right{right:16px;transform-origin:100% 50%;border-radius:2px 12px 12px 2px}
.door-panel{position:absolute;left:18px;right:18px;border:2px solid #2b1713;border-radius:8px;box-shadow:inset 0 0 0 2px rgba(150,91,58,.22),inset 0 10px 28px rgba(0,0,0,.18)}
.door-panel.top{top:28px;height:155px}.door-panel.bottom{bottom:28px;height:180px}
.door-handle{position:absolute;top:49%;width:15px;height:15px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ffe1a1,#c68838 42%,#724216 78%);box-shadow:0 0 0 3px #221611,0 4px 10px rgba(0,0,0,.5),0 0 16px rgba(255,186,84,.18)}
.door-handle.left{right:14px}.door-handle.right{left:14px}
.door-seam{position:absolute;top:18px;bottom:18px;left:50%;width:3px;transform:translateX(-50%);background:linear-gradient(transparent,#f6cc72 14%,#ffe9ae 50%,#f6cc72 86%,transparent);opacity:.26;box-shadow:0 0 12px rgba(255,208,111,.25);transition:opacity .35s ease,box-shadow .55s ease}
.door-lock{position:absolute;left:50%;top:50%;width:74px;height:88px;transform:translate(-50%,-48%);z-index:8;filter:drop-shadow(0 12px 16px rgba(0,0,0,.48));transition:transform .48s cubic-bezier(.2,.8,.2,1),opacity .35s ease,filter .35s ease}
.lock-shackle{position:absolute;left:50%;top:0;width:42px;height:42px;transform:translateX(-50%);border:10px solid #e9b548;border-bottom:0;border-radius:25px 25px 5px 5px;background:transparent}
.lock-body{position:absolute;left:8px;right:8px;bottom:0;height:58px;border-radius:15px;background:linear-gradient(145deg,#ffd66f,#e49a2c 55%,#9f5d18);border:2px solid #6c3c10;box-shadow:inset 0 3px 0 rgba(255,255,255,.35)}
.lock-body i{position:absolute;left:50%;top:17px;width:10px;height:21px;transform:translateX(-50%);background:#5b3516;border-radius:8px 8px 3px 3px}
.light-rays{position:absolute;width:280px;height:410px;left:50%;top:50%;transform:translate(-50%,-50%) scale(.45);background:conic-gradient(from 0deg,transparent 0 8%,rgba(255,238,180,.22) 8% 12%,transparent 12% 24%,rgba(141,114,255,.18) 24% 28%,transparent 28% 42%,rgba(255,238,180,.2) 42% 46%,transparent 46% 100%);filter:blur(8px);opacity:0;transition:opacity .45s ease,transform 1.1s ease}
.spark{position:absolute;width:7px;height:7px;border-radius:50%;background:#ffe29a;box-shadow:0 0 15px #ffc867;opacity:0;transform:translate(0,20px) scale(.2)}
.s1{left:33%;top:28%}.s2{left:66%;top:24%}.s3{left:24%;top:55%}.s4{left:76%;top:58%}.s5{left:41%;top:18%}.s6{left:60%;top:70%}
.open-copy{position:absolute;bottom:25px;left:50%;transform:translate(-50%,10px);font-size:12px;font-weight:950;letter-spacing:.32em;color:#ffdc8a;opacity:0;text-shadow:0 0 18px rgba(255,202,93,.5)}
.art.is-opening .portal-glow,.art.is-open .portal-glow{opacity:1;transform:scale(1.15)}
.art.is-opening .door-left,.art.is-open .door-left{transform:rotateY(-108deg) translateX(-4px);filter:brightness(.82);box-shadow:26px 18px 45px rgba(0,0,0,.48),inset 0 0 0 3px #2a1713}
.art.is-opening .door-right,.art.is-open .door-right{transform:rotateY(108deg) translateX(4px);filter:brightness(.82);box-shadow:-26px 18px 45px rgba(0,0,0,.48),inset 0 0 0 3px #2a1713}
.art.is-opening .door-seam,.art.is-open .door-seam{opacity:1;box-shadow:0 0 36px 12px rgba(255,223,148,.72)}
.art.is-opening .door-lock,.art.is-open .door-lock{transform:translate(-50%,95px) rotate(18deg) scale(.72);opacity:0;filter:blur(1px) drop-shadow(0 12px 16px rgba(0,0,0,.2))}
.art.is-opening .light-rays,.art.is-open .light-rays{opacity:1;transform:translate(-50%,-50%) scale(1.15) rotate(12deg)}
.art.is-opening .spark,.art.is-open .spark{animation:sparkBurst .9s ease-out .25s forwards}
.art.is-opening .s2,.art.is-open .s2{animation-delay:.32s}.art.is-opening .s3,.art.is-open .s3{animation-delay:.38s}.art.is-opening .s4,.art.is-open .s4{animation-delay:.43s}.art.is-opening .s5,.art.is-open .s5{animation-delay:.49s}.art.is-opening .s6,.art.is-open .s6{animation-delay:.54s}
.art.is-opening .open-copy,.art.is-open .open-copy{animation:openWord .7s ease .6s forwards}
.btn.opening{pointer-events:none;opacity:.9;transform:translateY(1px)}
@keyframes sparkBurst{0%{opacity:0;transform:translate(0,20px) scale(.2)}35%{opacity:1}100%{opacity:0;transform:translate(var(--sx,14px),-86px) scale(1)}}
.s1{--sx:-25px}.s2{--sx:24px}.s3{--sx:-38px}.s4{--sx:34px}.s5{--sx:-12px}.s6{--sx:16px}
@keyframes openWord{0%{opacity:0;transform:translate(-50%,10px);letter-spacing:.48em}100%{opacity:1;transform:translate(-50%,0);letter-spacing:.32em}}
@media(max-width:900px){.art{display:flex;padding:30px 20px 50px}.door-scene{height:430px}.door-frame{width:270px;height:365px}.door-panel.top{height:116px}.door-panel.bottom{height:136px}.door-lock{transform:translate(-50%,-48%) scale(.84)}}
@media(max-width:520px){.art{padding:20px 12px 38px}.door-scene{height:360px}.door-frame{width:228px;height:310px;padding:13px}.door-left{left:13px}.door-right{right:13px}.door-leaf{top:13px;bottom:13px;width:calc(50% - 14px)}.door-panel{left:13px;right:13px}.door-panel.top{top:20px;height:95px}.door-panel.bottom{bottom:20px;height:112px}.door-lock{transform:translate(-50%,-48%) scale(.72)}}
@media(prefers-reduced-motion:reduce){.door-leaf,.door-lock,.portal-glow,.light-rays,.door-seam{transition-duration:.01ms!important}.spark,.open-copy{animation-duration:.01ms!important;animation-delay:0s!important}}

/* Single premium hinged door */
.single-door-panel .art{perspective:1600px}
.single-door-scene{position:relative;width:min(430px,92%);height:550px;display:flex;align-items:center;justify-content:center;transform-style:preserve-3d}
.single-portal-glow{position:absolute;width:330px;height:450px;border-radius:28px;background:radial-gradient(ellipse at center,rgba(255,245,196,.95) 0 8%,rgba(255,201,91,.55) 24%,rgba(107,82,255,.25) 48%,transparent 72%);filter:blur(18px);opacity:.08;transform:scale(.72);transition:opacity .45s ease,transform 1.05s cubic-bezier(.18,.8,.2,1)}
.single-door-frame{position:relative;width:315px;height:455px;border-radius:20px 20px 8px 8px;padding:14px;background:linear-gradient(145deg,#1b314b,#0a1726 52%,#162b42);border:1px solid #3e5f80;box-shadow:0 32px 70px rgba(0,0,0,.4),inset 0 0 0 2px rgba(255,255,255,.035);transform-style:preserve-3d}
.single-door-frame:after{content:"";position:absolute;left:18px;right:18px;bottom:-16px;height:16px;border-radius:0 0 16px 16px;background:linear-gradient(#213a55,#081421)}
.single-door-light{position:absolute;inset:14px;border-radius:10px;background:linear-gradient(90deg,rgba(255,239,181,.85),rgba(255,202,94,.35));opacity:0;filter:blur(3px);transition:opacity .3s ease}
.single-door-leaf{position:absolute;left:14px;top:14px;bottom:14px;width:calc(100% - 28px);border-radius:10px;background:linear-gradient(145deg,#74482f 0%,#54301f 48%,#352019 100%);border:2px solid #8f6042;box-shadow:inset 0 0 0 3px #2d1913,inset 0 0 38px rgba(0,0,0,.3),0 12px 26px rgba(0,0,0,.24);transform-origin:0 50%;transform-style:preserve-3d;will-change:transform,filter;transition:transform 1.05s cubic-bezier(.16,.84,.18,1),filter .75s ease,box-shadow .75s ease;z-index:3}
.single-panel{position:absolute;left:30px;right:30px;border:2px solid #321b15;border-radius:9px;box-shadow:inset 0 0 0 2px rgba(166,101,65,.2),inset 0 10px 26px rgba(0,0,0,.15)}
.panel-top{top:35px;height:105px}.panel-mid{top:166px;height:82px}.panel-bottom{bottom:36px;height:135px}
.single-handle{position:absolute;right:24px;top:49%;width:18px;height:18px;border-radius:50%;background:radial-gradient(circle at 35% 35%,#ffe7a8,#ca8b3b 44%,#6f4016 80%);box-shadow:0 0 0 3px #251812,0 5px 10px rgba(0,0,0,.5),0 0 14px rgba(255,191,83,.16)}
.single-floor-light{position:absolute;bottom:22px;left:50%;width:250px;height:34px;transform:translateX(-50%) scaleX(.6);border-radius:50%;background:radial-gradient(ellipse,rgba(255,211,109,.8),rgba(109,76,255,.25) 45%,transparent 75%);filter:blur(12px);opacity:0;transition:opacity .5s ease,transform 1s ease}
.art.is-opening .single-portal-glow{opacity:1;transform:scale(1.12)}
.art.is-opening .single-door-light{opacity:1}
.art.is-opening .single-door-leaf{transform:rotateY(-112deg) translateX(-3px);filter:brightness(.8);box-shadow:30px 18px 48px rgba(0,0,0,.48),inset 0 0 0 3px #2d1913}
.art.is-opening .single-floor-light{opacity:1;transform:translateX(-50%) scaleX(1.05)}
.loading-card{margin:110px auto;max-width:620px;padding:70px 46px;text-align:center;background:rgba(8,28,48,.9);border:1px solid var(--line);border-radius:32px;box-shadow:0 30px 70px rgba(0,0,0,.28)}
.loading-card h1{font-size:38px;margin:18px 0 10px}.loading-card p{color:var(--muted);font-size:18px}
.loader-ring{width:58px;height:58px;border-radius:50%;border:5px solid rgba(255,255,255,.1);border-top-color:#8a6cff;margin:0 auto;animation:spin .8s linear infinite}
@keyframes spin{to{transform:rotate(360deg)}}
@media(max-width:900px){.single-door-scene{height:440px}.single-door-frame{width:260px;height:380px}.panel-top{height:88px}.panel-mid{top:142px;height:68px}.panel-bottom{height:112px}}
@media(max-width:520px){.single-door-scene{height:360px}.single-door-frame{width:220px;height:320px}.single-panel{left:22px;right:22px}.panel-top{top:28px;height:72px}.panel-mid{top:120px;height:54px}.panel-bottom{bottom:28px;height:92px}.loading-card{margin:70px auto;padding:50px 24px}.loading-card h1{font-size:30px}}
