.intro-sr-only{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);white-space:nowrap;border:0}.hadoota-mode-transition{position:fixed;inset:0;z-index:15000;pointer-events:none;display:grid;place-items:center;background:radial-gradient(ellipse at center,#fff4dd 0,#fbe9c9f5 70%);animation:mode-veil-in .18s cubic-bezier(.2,0,0,1) both;isolation:isolate;--star-x:64px}.hadoota-mode-transition.to-story{--star-x:-64px}.hadoota-mode-transition.is-out{animation:mode-veil-out .22s cubic-bezier(.4,0,1,1) both}.hadoota-mode-transition .mode-star,.hadoota-mode-transition .mode-symbol{animation-iteration-count:1}.hadoota-mode-transition.is-in .mode-symbol{animation:mode-symbol-in .4s ease both}.mode-stage{position:relative;display:block;width:112px;height:80px}.mode-fold{position:absolute;inset:0;display:block;perspective:480px;filter:drop-shadow(0 10px 9px #64503424);animation:mode-fold-arrive .5s var(--h-ease) both}.mode-fold>img{display:block;width:100%;height:100%;object-fit:contain}.mode-page{position:absolute;left:50%;top:21%;width:35%;height:58%;transform-origin:left center;background:linear-gradient(90deg,#e9d9b7,#fff8e7);border-radius:2px 11px 7px 2px;box-shadow:inset -2px 0 3px #c8b18a55;animation:mode-page-fold .42s cubic-bezier(.3,.6,.25,1) both;backface-visibility:hidden}.to-story .mode-page{left:15%;transform-origin:right center;border-radius:11px 2px 2px 7px;animation-name:mode-page-fold-back}.mode-star{position:absolute;left:calc(50% - 16px);top:-4px;width:32px;height:34px;opacity:0;animation:mode-star-release .5s var(--h-ease) both}.mode-star .story-control-art{width:32px;height:34px}.mode-symbol{position:absolute;left:calc(50% + var(--star-x) - 22px);top:-58px;display:grid;place-items:center;width:44px;height:44px;color:var(--h-navy);font:600 22px/1 var(--font-display);letter-spacing:.06em;opacity:0;animation:mode-symbol .5s ease both}.mode-symbol:lang(ar){font-family:var(--font-body-ar);letter-spacing:0}.mode-symbol .story-control-art{width:30px;height:32px}.hadoota-mode-transition.is-reduced{animation:mode-veil-in .15s linear both!important}.hadoota-mode-transition.is-reduced.is-out{animation:mode-veil-out .15s linear both!important}.hadoota-mode-transition.is-reduced *{animation:none!important;transition:none!important}.hadoota-mode-transition.is-reduced :is(.mode-page,.mode-star){display:none}.hadoota-mode-transition.is-reduced .mode-symbol{opacity:1}@keyframes mode-veil{0%{opacity:0}18%,62%{opacity:1}to{opacity:0}}@keyframes mode-veil-reduced{0%,to{opacity:0}35%,65%{opacity:1}}@keyframes mode-fold-arrive{0%{transform:translateY(8px) scale(.92)}60%{transform:none}to{transform:translateY(-3px) scale(.98)}}@keyframes mode-page-fold{0%{transform:rotateY(0)}to{transform:rotateY(-168deg)}}@keyframes mode-page-fold-back{0%{transform:rotateY(0)}to{transform:rotateY(168deg)}}@keyframes mode-star-release{0%,20%{opacity:0;transform:translateY(14px) scale(.3) rotate(-20deg)}45%{opacity:1;transform:translate(calc(var(--star-x)*.35),-34px) scale(1) rotate(0)}to{opacity:0;transform:translate(var(--star-x),-58px) scale(.5) rotate(12deg)}}@keyframes mode-symbol{0%,45%{opacity:0;transform:scale(.6)}75%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.9)}}.hadoota-welcome{position:fixed;inset:0;z-index:16000;overflow:hidden;background:#f7eddc;color:#7954a4;isolation:isolate}.hadoota-welcome video{width:100%;height:100%;object-fit:cover;object-position:35% center}.welcome-vignette{position:absolute;inset:0;pointer-events:none;background:linear-gradient(90deg,transparent 42%,#faf0dc32 59%,#faf0dcc9 100%)}.welcome-brand{position:absolute;right:7%;top:45%;width:35%;display:flex;align-items:center;gap:clamp(13px,2vw,29px);transform:translateY(-50%)}.welcome-book-mark{width:clamp(80px,9vw,140px);flex-shrink:0;filter:drop-shadow(0 8px 5px #52364d17);opacity:0}.welcome-brand-copy{display:flex;flex-direction:column;align-items:flex-start;gap:3px}.welcome-tagline{font-family:var(--font-body);font-size:clamp(13px,1.65vw,23px);color:#765947;white-space:nowrap;clip-path:inset(0 100% 0 0)}.welcome-wordmark{display:flex;font-family:var(--font-display);font-size:clamp(29px,4.2vw,61px);font-weight:500;line-height:1.15;letter-spacing:-.035em;white-space:nowrap}.welcome-wordmark>span{opacity:0;transform:translateY(9px)}.intro-playing .welcome-book-mark{animation:welcome-book 1s 1.7s both}.intro-playing .welcome-tagline{animation:welcome-write 1.15s 2.6s ease-out both,welcome-tagline-away .6s 4.1s ease both}.intro-playing .welcome-wordmark>span{animation:welcome-letter .65s calc(3.8s + var(--letter)*.11s) both}.welcome-buffer{position:absolute;right:21%;top:calc(45% + 100px);width:21px;height:21px}.welcome-buffer>span:first-child{display:block;width:100%;height:100%;border:2px solid #b599c83b;border-top-color:#7954a4;border-radius:50%;animation:welcome-spin 1.2s linear infinite}.welcome-skip{position:absolute;bottom:32px;right:38px;display:flex;align-items:center;gap:16px;border:1px solid #b6a185;background:#fff7e8ed;color:#6d5945;padding:12px 19px;border-radius:40px;font:inherit;font-size:14px;cursor:pointer;box-shadow:0 3px #a38c6f33}.welcome-skip:focus-visible{outline:var(--h-focus-width) solid var(--h-focus-color);outline-offset:4px}[dir=rtl] .welcome-skip{right:auto;left:38px}[dir=rtl] .welcome-skip>span{transform:rotate(180deg)}@keyframes welcome-book{0%{opacity:0;transform:scale(.87) rotate(-7deg)}to{opacity:1;transform:scale(1) rotate(0)}}@keyframes welcome-write{to{clip-path:inset(0 0 0 0)}}@keyframes welcome-letter{to{opacity:1;transform:translateY(0)}}@keyframes welcome-spin{to{transform:rotate(360deg)}}@media(max-width:700px){.welcome-brand{inset:auto 8% 105px;width:auto;justify-content:center;transform:none}.welcome-vignette{background:linear-gradient(0deg,#faf0dcf0,transparent 64%)}.welcome-brand-copy{gap:0}.welcome-wordmark{font-size:45px}.welcome-book-mark{width:85px}.welcome-tagline{font-size:16px}.welcome-skip{right:24px;bottom:25px}.welcome-buffer{top:auto;bottom:82px;right:calc(50% - 10px)}}@media(prefers-reduced-motion:reduce){.hadoota-welcome *{animation:none!important;transition:none!important}.hadoota-welcome video{visibility:hidden}.hadoota-welcome .welcome-book-mark,.hadoota-welcome .welcome-wordmark>span{opacity:1;transform:none}.hadoota-welcome .welcome-tagline{clip-path:none}.welcome-buffer>span:first-child{animation:none}}@keyframes welcome-tagline-away{to{opacity:0;filter:blur(3px);transform:translateY(-5px)}}@font-face{font-family:HadootaWordmark;src:url(/brand/hadoota-wordmark.woff2) format("woff2");font-weight:600;font-display:swap}.welcome-wordmark{font-family:HadootaWordmark,Fredoka,sans-serif;font-weight:600;letter-spacing:0}.hadoota-welcome .welcome-skip{max-width:calc(100vw - 48px);min-height:44px;line-height:1.4}html[lang=ar] .hadoota-welcome .welcome-tagline{font-family:var(--font-body-ar);letter-spacing:0}@media(max-height:420px){.hadoota-welcome .welcome-skip{bottom:16px}.hadoota-welcome .welcome-brand{top:40%;bottom:auto}}.hadoota-welcome .welcome-brand{--welcome-word:clamp(29px,4.2vw,61px);gap:calc(var(--welcome-word)*.156)}.hadoota-welcome .welcome-book-mark{width:calc(var(--welcome-word)*1.5);height:auto;aspect-ratio:258/183;filter:none}.hadoota-welcome .welcome-wordmark{font-size:var(--welcome-word);color:var(--h-purple-500)}@media(max-width:700px){.hadoota-welcome .welcome-brand{--welcome-word:45px}}.hadoota-welcome .welcome-buffer{width:40px;height:40px}.hadoota-welcome .welcome-buffer>.welcome-buffer-star{display:grid;place-items:center;width:100%;height:100%;border:0;border-radius:0;animation:welcome-star-turn 1.6s cubic-bezier(.22,.8,.2,1) infinite}.hadoota-welcome .welcome-buffer .story-control-art{width:36px;height:36px;filter:drop-shadow(0 0 6px #ffdf94)}@keyframes welcome-star-turn{0%{rotate:0deg;scale:.9}50%{scale:1.08}to{rotate:360deg;scale:.9}}.hadoota-welcome .welcome-skip>.welcome-skip-arrow{width:28px;height:28px}@media(prefers-reduced-motion:reduce){.hadoota-welcome .welcome-buffer>.welcome-buffer-star{animation:none!important}}@keyframes mode-veil-in{0%{opacity:0}to{opacity:1}}@keyframes mode-veil-out{0%{opacity:1}to{opacity:0}}@keyframes mode-symbol-in{0%,40%{opacity:0;transform:scale(.6)}to{opacity:1;transform:scale(1)}}
