*{box-sizing:border-box}html,body{margin:0;min-height:100%;background:#0b0b0a}button,input{font:inherit}.scene{--ink:#f1eee7;--muted:#a8a49c;--gold:#c9ae7f;position:relative;isolation:isolate;min-height:100svh;overflow:hidden;background:#0b0b0a;color:var(--ink);font-family:Arial,Helvetica,sans-serif}.scene:before{content:"";position:absolute;inset:0;z-index:-3;background:radial-gradient(circle at 73% 43%,#8a795d2b 0 1%,transparent 29%),linear-gradient(115deg,#080807 0 46%,#161512 100%)}.scene:after{content:"";position:absolute;inset:0;z-index:-2;opacity:.22;background-image:linear-gradient(#fff 1px,transparent 1px),linear-gradient(90deg,#fff 1px,transparent 1px);background-size:clamp(68px,8vw,132px) clamp(68px,8vw,132px);mask-image:linear-gradient(90deg,transparent 12%,#000 70%,transparent)}.noise{position:absolute;inset:0;z-index:-1;pointer-events:none;opacity:.035;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='.9' numOctaves='4' stitchTiles='stitch'/%3E%3C/filter%3E%3Crect width='100%25' height='100%25' filter='url(%23n)' opacity='.8'/%3E%3C/svg%3E")}
header{height:88px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;padding:0 clamp(28px,4.5vw,76px);border-bottom:1px solid #ffffff1c;font-size:10px;letter-spacing:.17em;text-transform:uppercase}.logo{font:21px Constantia,Georgia,serif;letter-spacing:.23em}.place{color:var(--muted)}.status{justify-self:end;display:flex;align-items:center;gap:10px;color:var(--muted)}.status i{width:6px;height:6px;border-radius:50%;background:var(--gold);box-shadow:0 0 14px var(--gold);animation:pulse 2.6s ease-in-out infinite}
.stage{min-height:calc(100svh - 178px);display:grid;grid-template-columns:minmax(0,1.08fr) minmax(360px,.92fr);align-items:center;gap:4vw;padding:clamp(48px,7vw,110px) clamp(28px,7vw,118px)}.copy{position:relative;z-index:2;max-width:760px;animation:rise 1.25s cubic-bezier(.2,.8,.2,1) both}.copy>span,footer span,.mark small,.auth>span{display:block;color:var(--gold);font-size:10px;letter-spacing:.2em;text-transform:uppercase}.copy h1{max-width:760px;margin:24px 0 28px;font:clamp(48px,6.2vw,105px)/.9 Constantia,Georgia,serif;letter-spacing:-.047em}.copy h1 em{display:block;color:#b9c5d6;font-weight:400}.copy p{max-width:560px;color:#c2beb6;font-size:clamp(14px,1.1vw,17px);line-height:1.65}
.turn{position:relative;aspect-ratio:1;min-width:0;perspective:1500px;transform-style:preserve-3d;transition:transform 1.05s cubic-bezier(.66,0,.18,1)}.turn.open{transform:rotateY(180deg)}.mark{position:absolute;inset:0;width:100%;display:grid;place-items:center;border:0;background:transparent;color:#d8cfbf;cursor:pointer;backface-visibility:hidden;transition:filter .35s}.mark:hover{filter:brightness(1.16)}.mark:focus-visible{outline:1px solid var(--gold);outline-offset:8px}.mark b{position:relative;font:clamp(250px,34vw,570px)/.68 Constantia,Georgia,serif;letter-spacing:-.13em;transform:translateX(-.05em);opacity:.92;text-shadow:0 0 80px #d1b98a14;animation:mark 1.8s cubic-bezier(.2,.8,.2,1) both}.halo{position:absolute;width:72%;aspect-ratio:1;border-radius:50%;background:#d9c39b14;filter:blur(28px);box-shadow:0 0 120px #d9c39b22;animation:breathe 5s ease-in-out infinite}.axis{position:absolute;background:#d1ba8b4a;transform-origin:center;animation:draw 1.7s .3s cubic-bezier(.2,.8,.2,1) both}.axis.x{width:100%;height:1px}.axis.y{width:1px;height:100%}.mark small{position:absolute;right:2%;bottom:10%;color:#aaa399}.auth{position:absolute;inset:4% 0;display:flex;flex-direction:column;justify-content:center;padding:clamp(30px,4vw,64px);border:1px solid #c9ae7f50;background:linear-gradient(145deg,#171613fa,#0d0d0cfa);box-shadow:0 35px 90px #0009;color:var(--ink);backface-visibility:hidden;transform:rotateY(180deg)}.auth h2{max-width:440px;margin:18px 0 9px;font:clamp(31px,3.1vw,52px)/.98 Constantia,Georgia,serif;letter-spacing:-.035em}.auth>p{margin:0 0 clamp(20px,2.5vw,34px);color:#9d9992;font-size:13px;line-height:1.55}.auth label{display:grid;gap:8px;margin-top:15px;color:#aaa69e;font-size:9px;letter-spacing:.16em;text-transform:uppercase}.auth input{width:100%;height:50px;padding:0 2px;border:0;border-bottom:1px solid #ffffff35;outline:0;background:transparent;color:#f1eee7;font:15px Arial,Helvetica,sans-serif;letter-spacing:0;text-transform:none}.auth input:focus{border-color:var(--gold)}.submit{display:flex;align-items:center;justify-content:space-between;width:100%;height:54px;margin-top:28px;padding:0 18px;border:1px solid #d2bd96;background:#d2bd96;color:#111;font-size:10px;font-weight:700;letter-spacing:.16em;text-transform:uppercase;cursor:pointer}.submit:hover{background:transparent;color:#f1eee7}.submit b{font-size:18px}.close{position:absolute;top:19px;right:21px;width:35px;height:35px;border:1px solid #ffffff25;border-radius:50%;background:transparent;color:#aaa69e;font-size:20px;cursor:pointer}.auth .message{height:16px;margin:10px 0 -16px;color:#d59b8e;font-size:12px}
footer{height:90px;display:grid;grid-template-columns:1fr auto 1fr;align-items:center;gap:32px;padding:0 clamp(28px,4.5vw,76px);border-top:1px solid #ffffff1c}footer>div:first-child{display:flex;align-items:baseline;gap:13px}footer strong{font-size:11px;letter-spacing:.2em}footer p{margin:0;color:#77746e;font:italic 14px Constantia,Georgia,serif}.progress{justify-self:end;width:min(190px,18vw);height:1px;background:#ffffff26}.progress i{display:block;width:42%;height:100%;background:var(--gold);box-shadow:0 0 10px #c9ae7f77;animation:progress 3.8s ease-in-out infinite}
@keyframes rise{from{opacity:0;transform:translateY(32px)}to{opacity:1;transform:none}}@keyframes mark{from{opacity:0;filter:blur(16px);transform:translateX(-.05em) scale(.92)}to{opacity:.92;filter:none;transform:translateX(-.05em) scale(1)}}@keyframes draw{from{transform:scale(0);opacity:0}to{transform:scale(1);opacity:1}}@keyframes breathe{50%{transform:scale(1.13);opacity:.6}}@keyframes pulse{50%{opacity:.35;transform:scale(.72)}}@keyframes progress{0%{transform:translateX(0);width:8%}50%{transform:translateX(120%);width:46%}100%{transform:translateX(0);width:8%}}
@media(max-width:780px){header{height:72px;grid-template-columns:1fr auto;padding:0 28px}.place{display:none}.stage{position:relative;display:flex;min-height:calc(100svh - 152px);flex-direction:column;align-items:stretch;justify-content:center;gap:24px;padding:42px 28px 28px}.copy h1{margin:18px 0 22px;font-size:clamp(46px,14vw,66px)}.copy p{max-width:100%;font-size:14px}.turn:not(.open){z-index:8;width:100%;height:220px;aspect-ratio:auto;opacity:.78}.turn:not(.open) .mark{height:100%;overflow:visible;touch-action:manipulation;-webkit-tap-highlight-color:transparent}.turn:not(.open) .mark b{display:block;width:1em;font-size:190px;letter-spacing:0;text-align:center;transform:none}.turn:not(.open) .mark small{right:50%;bottom:4px;width:max-content;transform:translateX(50%);pointer-events:none}.turn.open{position:fixed;inset:72px 0 80px;width:100%;height:auto;aspect-ratio:auto;z-index:20;transform:rotateY(180deg)}.turn.open .auth{inset:18px;padding:34px 28px}.turn.open .mark{inset:18px;width:calc(100% - 36px)}.stage:has(.turn.open) .copy{opacity:0}.auth h2{font-size:36px}.auth>p{margin-bottom:20px}.submit{margin-top:24px}footer{position:relative;z-index:21;height:80px;grid-template-columns:1fr auto;padding:0 28px}footer p{display:none}.progress{width:88px}}
@media(max-width:380px),(max-height:760px){.stage{justify-content:flex-start;gap:18px;padding-top:30px}.copy h1{font-size:45px}.copy p{font-size:13px;line-height:1.5}.turn:not(.open){height:180px}.turn:not(.open) .mark b{font-size:160px}}
@media(prefers-reduced-motion:reduce){*{animation:none!important;transition:none!important}}