:root{--paper:#eeebe3;--ink:#282c28;--muted:#6e7067;--accent:#8d6d45;--line:rgba(113,94,68,.22);--arabic:Almarai,Arial,sans-serif;--english:"Space Grotesk",Arial,sans-serif}
*{box-sizing:border-box}
html,body{margin:0;width:100%;height:100%;overflow:hidden;background:var(--paper)}
body{font-family:var(--arabic);-webkit-font-smoothing:antialiased;cursor:none}
[hidden]{display:none!important}
img{display:block}
#viewport{position:absolute;inset:0;overflow:hidden}
.stage{width:1080px;height:1920px;position:absolute;left:50%;top:50%;transform-origin:center center;background:var(--paper);color:var(--ink);padding:100px 84px 88px;display:flex;flex-direction:column;overflow:hidden;isolation:isolate;transition:opacity .65s ease}
.stage.theme-charcoal{--paper:#1b211f;--ink:#f0ede5;--muted:#b1b6aa;--accent:#c3a177;--line:rgba(199,174,136,.24)}
.stage:before{content:"";position:absolute;inset:0;pointer-events:none;z-index:-1;background:radial-gradient(ellipse at 85% 10%,rgba(171,143,103,.11),transparent 55%),linear-gradient(130deg,transparent 40%,rgba(150,135,110,.04));}
.edge-rule{position:absolute;inset:42px;border:1px solid var(--line);pointer-events:none}
.edge-rule:after,.edge-rule:before{content:"";position:absolute;top:-3px;width:5px;height:5px;background:var(--accent);transform:rotate(45deg)}
.edge-rule:after{right:-3px}.edge-rule:before{left:-3px}
.screen-header{display:flex;align-items:center;justify-content:space-between;direction:ltr;position:relative;flex-shrink:0;min-height:98px}
.brand-logo{width:270px;height:90px;object-fit:contain;object-position:left center}
.header-note{text-align:right;font-size:22px;line-height:1.7;display:flex;flex-direction:column}
.header-note span:last-child{font:14px "Space Grotesk",Arial,sans-serif;letter-spacing:3px;color:var(--muted);margin-top:10px}
.composition{position:relative;flex:1;min-height:0;display:flex;flex-direction:column;align-items:center;justify-content:center;padding:55px 0;z-index:1;text-align:center}
.copy{width:100%}
.edition{display:flex;align-items:center;justify-content:center;font:15px "Space Grotesk",Arial,sans-serif;letter-spacing:4px;color:var(--accent);direction:ltr;margin:0 0 36px}
.edition i{display:block;width:34px;height:1px;background:var(--accent);margin:0 22px}
.title-ar{font-size:102px;font-weight:400;line-height:1.5;margin:0;white-space:pre-line;overflow-wrap:break-word;max-height:310px}
.title-en{font:italic 66px/1.14 Georgia,"Times New Roman",serif;margin:24px 0 0;color:var(--accent);white-space:pre-line;overflow-wrap:break-word;max-height:160px}
.message-body{margin:68px auto 0;max-width:790px}
.message-body p,.visual-body p{font-size:28px;line-height:1.8;margin:0;white-space:pre-line;color:var(--muted);overflow-wrap:break-word}
.message-body p[lang=en],.visual-body p[lang=en]{font:23px/1.7 "Space Grotesk",Arial,sans-serif;margin-top:14px}
.visual{width:100%;margin-top:66px;display:flex;flex-direction:column;align-items:center}
.visual-body{margin-top:42px;width:100%;max-width:790px}
.partners{width:100%;display:flex;align-items:center;justify-content:center;direction:ltr}
.logo-card{width:378px;height:300px;display:flex;align-items:center;justify-content:center;background:#f8f6ef;border:1px solid rgba(113,94,68,.2);padding:40px;position:relative}
.logo-card:after{content:"";position:absolute;left:20px;right:20px;bottom:-9px;height:1px;background:var(--line)}
.logo-card img{width:100%;height:100%;object-fit:contain}
.logo-card.surface-charcoal,.guest-logo-card.surface-charcoal{background:#242925}
.partnership-mark{width:100px;display:flex;flex-direction:column;align-items:center;flex-shrink:0;color:var(--accent);font:36px Georgia,serif}
.partnership-mark i{width:1px;height:45px;background:var(--line);margin:16px 0}
.partnership-mark b{font-weight:400}
.identity{margin-top:42px;width:100%}
.identity h2{font-size:48px;font-weight:700;line-height:1.55;margin:0;max-height:150px;overflow-wrap:break-word}
.identity>p{font:35px/1.4 "Space Grotesk",Arial,sans-serif;margin:12px 0 0;max-height:100px;overflow-wrap:break-word}
.company{margin-top:20px;color:var(--accent)}
.company p{font-size:26px;line-height:1.6;margin:0;overflow-wrap:break-word}
.company p[lang=en]{font:21px/1.6 "Space Grotesk",Arial,sans-serif;margin-top:6px}
.portrait-block{position:relative;width:540px;height:590px;flex-shrink:0}
.portrait-window{position:absolute;inset:0;border-radius:260px 260px 3px 3px;overflow:hidden;background:var(--line)}
.portrait-window img{width:100%;height:100%;object-fit:cover;object-position:50% 35%}
.portrait-outline{position:absolute;left:-18px;right:18px;top:-18px;bottom:18px;border:1px solid var(--accent);border-radius:270px 270px 3px 3px;opacity:.65}
.guest-logo-card{position:absolute;bottom:24px;right:-48px;width:180px;height:128px;background:#f8f6ef;border:1px solid rgba(113,94,68,.25);padding:22px;box-shadow:0 12px 36px rgba(0,0,0,.12)}
.guest-logo-card img{width:100%;height:100%;object-fit:contain}
.photo-rule{position:absolute;left:30px;bottom:-16px;width:88px;height:3px;background:var(--accent)}
.mode-guest .title-ar,.mode-portrait .title-ar{font-size:70px;max-height:210px}
.mode-guest .title-en,.mode-portrait .title-en{font-size:44px;max-height:106px;margin-top:14px}
.mode-guest .edition,.mode-portrait .edition{margin-bottom:22px}
.mode-guest .visual,.mode-portrait .visual{margin-top:42px}
.mode-guest .identity,.mode-portrait .identity{margin-top:35px}
.mode-guest .visual-body,.mode-portrait .visual-body{margin-top:24px}
.mode-guest .visual-body p,.mode-portrait .visual-body p{font-size:24px}
.mode-guest .visual-body p[lang=en],.mode-portrait .visual-body p[lang=en]{font-size:20px}
.mode-message .title-ar{font-size:126px;max-height:390px}
.mode-message .title-en{font-size:80px;max-height:210px}
.mode-message .architecture{opacity:.8}
.architecture{position:absolute;width:840px;height:1510px;left:-430px;top:390px;pointer-events:none;z-index:0;opacity:.45;transform:rotate(-13deg)}
.architecture i{position:absolute;inset:0;border:1px solid var(--line);border-radius:450px 450px 0 0}
.architecture i:nth-child(2){inset:35px}.architecture i:nth-child(3){inset:70px}
.architecture b{position:absolute;top:5%;left:55%;width:740px;height:740px;border:1px solid var(--line);border-radius:50%}
.occasion-art{width:370px;height:370px;position:relative;margin:0 auto}
.celestial-orbit{position:absolute;inset:0;border:1px solid var(--line);border-radius:50%}
.celestial-orbit:after{content:"";position:absolute;inset:26px;border:1px solid var(--line);border-radius:50%}
.crescent{position:absolute;width:215px;height:215px;border-radius:50%;box-shadow:-26px 18px 0 0 var(--accent);left:92px;top:55px;transform:rotate(-15deg)}
.star{position:absolute;color:var(--accent);font-size:45px;line-height:1}
.star-one{left:105px;top:110px}.star-two{right:65px;bottom:85px;font-size:25px}
.occasion-year{position:absolute;inset:0;align-items:center;justify-content:center;font:100px Georgia,serif;color:var(--accent);display:none}
.occasion-newyear .occasion-year{display:flex}
.occasion-newyear .crescent,.occasion-newyear .star,.occasion-custom .crescent{display:none}
.occasion-custom .star-one{font-size:150px;top:100px;left:110px}
.mode-greeting .visual{order:-1;margin:0 0 60px}
.mode-greeting .title-ar{font-size:132px;max-height:400px}
.mode-greeting .title-en{font-size:82px;max-height:190px}
.mode-greeting .message-body{margin-top:52px}
.screen-footer{display:flex;align-items:flex-end;justify-content:space-between;border-top:1px solid var(--line);padding-top:28px;min-height:95px;flex-shrink:0;direction:rtl;position:relative}
.footer-message{display:flex;flex-direction:column;font-size:19px;color:var(--muted);line-height:1.6;max-width:75%}
.footer-message span:last-child{font:14px/1.6 "Space Grotesk",Arial,sans-serif;margin-top:5px;text-align:right}
.footer-signature{font:15px "Space Grotesk",Arial,sans-serif;letter-spacing:4px;color:var(--accent);display:flex;align-items:center}
.signature-dot{width:6px;height:6px;margin-left:14px;background:var(--accent);transform:rotate(45deg)}
.progress{position:absolute;bottom:0;left:0;right:0;height:3px;background:transparent;direction:ltr}
.progress i{display:block;width:100%;height:100%;background:var(--accent);opacity:.5;transform-origin:left;transform:scaleX(0)}
.stage.is-changing{opacity:0}
.landscape{width:1920px;height:1080px;padding:72px 100px 65px}
.landscape .edge-rule{inset:30px}
.landscape .brand-logo{width:245px;height:74px}
.landscape .screen-header{min-height:75px}
.landscape .composition{padding:35px 0;flex-direction:row;flex-wrap:wrap;align-content:center;column-gap:65px}
.landscape .copy{width:760px;flex-shrink:0}
.landscape .visual{width:830px;margin:0}
.landscape .visual-body{width:760px;margin:12px 0 0;max-width:760px}
.landscape .title-ar{font-size:83px;max-height:260px}
.landscape .title-en{font-size:60px;max-height:145px}
.landscape .message-body{margin-top:35px}
.landscape .partners .logo-card{width:340px;height:290px}
.landscape.mode-message .copy{width:1200px}
.landscape.mode-message .title-ar{font-size:108px;max-height:310px}
.landscape.mode-message .title-en{font-size:64px;max-height:150px}
.landscape.mode-message .message-body{margin-top:32px;max-width:1100px}
.landscape.mode-guest .composition,.landscape.mode-portrait .composition{display:block;padding:35px 0}
.landscape.mode-guest .copy,.landscape.mode-portrait .copy{position:absolute;right:0;top:50%;transform:translateY(-70%);width:850px}
.landscape.mode-guest .visual,.landscape.mode-portrait .visual{position:absolute;left:0;top:50%;transform:translateY(-50%);width:740px}
.landscape .portrait-block{width:380px;height:410px}
.landscape .portrait-window{border-radius:200px 200px 3px 3px}
.landscape .portrait-outline{border-radius:210px 210px 3px 3px}
.landscape .guest-logo-card{width:150px;height:105px;right:-52px;padding:18px}
.landscape .identity{margin-top:26px}
.landscape .identity h2{font-size:40px;max-height:120px}
.landscape .identity>p{font-size:29px;max-height:85px}
.landscape .company{margin-top:10px}
.landscape .company p{font-size:22px}
.landscape .company p[lang=en]{font-size:18px}
.landscape.mode-guest .visual-body,.landscape.mode-portrait .visual-body{position:absolute;right:0;top:65%;width:850px;margin:0}
.landscape.mode-greeting .copy{width:970px}
.landscape.mode-greeting .visual{width:600px;margin:0 0 0 90px;order:0}
.landscape.mode-greeting .occasion-art{transform:scale(1.12)}
.landscape.mode-greeting .title-ar{font-size:115px;max-height:340px}
.landscape.mode-greeting .message-body{margin-top:34px}
.landscape .screen-footer{min-height:80px;padding-top:20px}
.landscape .architecture{left:-160px;top:90px;height:1600px;transform:rotate(-35deg)}
.stage.compact .title-ar{font-size:65px}.stage.compact .title-en{font-size:44px}
.stage.compact .visual{margin-top:28px}.stage.compact .portrait-block{height:460px;width:430px}
.stage.compact .edition{margin-bottom:18px}.stage.compact .visual-body{margin-top:18px}
.stage.compact .identity{margin-top:24px}
#loading{position:absolute;inset:0;display:flex;flex-direction:column;align-items:center;justify-content:center;color:#6f644f}
#loading p{font:32px Almarai,Arial,sans-serif;margin:25px 0 14px}
#loading small{font:11px "Space Grotesk",Arial,sans-serif;letter-spacing:3px}
.loading-line{height:1px;width:70px;background:#a58b63;animation:breathe 2s ease-in-out infinite}
@keyframes breathe{50%{opacity:.2;transform:scaleX(.5)}}
@media(prefers-reduced-motion:reduce){*{transition:none!important;animation:none!important}}