.story{--story-cam:.9s;--story-hand:.56s;--story-ease:cubic-bezier(.65, 0, .35, 1);--story-gutter:max(1.25rem, var(--safe-left));position:relative}@media (min-width:768px){.story{--story-gutter:2rem}}@media (min-width:1280px){.story{--story-gutter:2.5rem}}.story__track{height:calc(100svh - var(--header-bottom) + var(--chapters) * 75svh);position:relative}.story[data-released] .story__track{height:auto}.story__stage{top:var(--header-bottom);height:calc(100svh - var(--header-bottom));flex-direction:column;padding-block:.5rem .75rem;display:flex;position:sticky}.story__view{min-height:0;margin-inline:calc(-1 * var(--story-gutter));flex:auto;position:relative;overflow:hidden;-webkit-mask-image:linear-gradient(#0000 0,#000 1.5rem calc(100% - 1.5rem),#0000 100%);mask-image:linear-gradient(#0000 0,#000 1.5rem calc(100% - 1.5rem),#0000 100%)}.story__world{--s:1;--s-w:1;--t:1;--phone-w:calc(390px + var(--bezel) * 2);--phone-h:calc(var(--screen-h) + var(--bezel) * 2);--tablet-w:calc(1180px + var(--tablet-bezel) * 2);--tablet-h:calc(820px + var(--tablet-bezel) * 2);transform-origin:0 0;width:max-content;transition:transform var(--story-cam) var(--story-ease);position:absolute;top:0;left:0}.story__world[data-cut]{transition:none}.story__world:not([data-framed]){visibility:hidden}@media (scripting:none){.story__world:not([data-framed]){visibility:visible}}.story__devices{align-items:center;gap:72px;display:flex}.story-hand{--size:50px;z-index:60;width:var(--size);height:var(--size);margin:calc(var(--size) / -2) 0 0 calc(var(--size) / -2);pointer-events:none;transition:translate var(--story-hand) var(--story-ease);background:radial-gradient(circle at 50% 40%,#ffffff6b,#ffffff14 64%),#241e1657;border:3px solid #ffffffeb;border-radius:999px;position:absolute;top:0;left:0}.story-hand[data-cut]{transition:none}.story-hand[data-parked]{visibility:hidden}.story-hand[data-press]{animation:story-press .34s var(--story-ease)}.story-hand[data-down]{scale:.84}.story-hand:after{content:"";border:3px solid var(--color-gold-400);border-radius:inherit;opacity:0;position:absolute;inset:-3px}.story-hand[data-press]:after{animation:story-ring .62s var(--story-ease)}@keyframes story-press{0%,to{scale:1}45%{scale:.8}}@keyframes story-ring{0%{opacity:.9;scale:1}to{opacity:0;scale:1.9}}.story-coach{--notch:50%;z-index:58;background-color:var(--accent);background-image:var(--silk);width:max-content;max-width:17rem;color:var(--silk-ink);font-family:var(--font-inter), ui-sans-serif, system-ui, sans-serif;text-align:center;pointer-events:none;transform-origin:var(--notch) 100%;border-radius:999px;padding:.5625rem 1rem;font-size:15px;font-weight:600;line-height:1.3;animation:.52s cubic-bezier(.34,1.4,.64,1) both story-coach-in;position:absolute;top:0;left:0}.story-coach:lang(ar){font-family:var(--font-alexandria), var(--font-inter), ui-sans-serif, system-ui, sans-serif;line-height:1.6}.story-coach[data-side=below]{transform-origin:var(--notch) 0%}.story-coach:after{content:"";top:100%;left:var(--notch);background:var(--accent);border-radius:2px;width:12px;height:12px;margin:-7px 0 0 -6px;position:absolute;rotate:45deg}.story-coach[data-side=below]:after{margin:0 0 -7px -6px;top:auto;bottom:100%}.story-coach[data-leaving]{animation:.26s cubic-bezier(.55,0,1,.45) both story-coach-out}@keyframes story-coach-in{0%{scale:.2}to{scale:1}}@keyframes story-coach-out{0%{scale:1}to{scale:0}}.story-token{z-index:55;transform-origin:0 0;pointer-events:none;box-shadow:0 24px 48px -20px #1c181480;max-width:none!important;margin:0!important;position:absolute!important;top:0!important;left:0!important}.story [data-pending]{visibility:hidden}.story__rail{display:none}.story__title{color:var(--text-ink-2);font-size:.8125rem;font-weight:600;line-height:1.4}.story__chapters{gap:.25rem;margin-top:1.25rem;display:grid}.story__chapter{isolation:isolate;border-radius:var(--radius-card);color:var(--text-ink-3);transition:background-color .5s var(--story-ease), color .5s var(--story-ease);align-items:flex-start;gap:1rem;padding:.875rem 1rem;display:flex;position:relative;overflow:hidden}.story__chapter[data-state=done]{color:var(--text-ink-2)}.story__chapter[data-state=now]{background:var(--surface-card);color:var(--text-ink)}.story__number{letter-spacing:.18em;font-variant-numeric:tabular-nums;flex:none;width:1.5rem;margin-top:.3rem;font-size:.75rem;font-weight:600}.story__chapter[data-state=now] .story__number,.story__chapter[data-state=done] .story__number{color:var(--accent-text)}.story__name{letter-spacing:-.01em;font-size:1.1875rem;font-weight:600;line-height:1.3;display:block}:lang(ar) .story__name{letter-spacing:0;line-height:1.5}.story__more{transition:grid-template-rows .5s var(--story-ease);grid-template-rows:0fr;display:grid}.story__chapter[data-state=now] .story__more{grid-template-rows:1fr}.story__detail{color:var(--text-ink-2);font-size:.875rem;line-height:1.5;overflow:hidden}.story__chapter[data-state=now] .story__detail{padding-top:.375rem}:lang(ar) .story__detail{line-height:1.8}.story__foot{justify-items:start;gap:1rem;margin-top:1.5rem;display:grid}.story__note{color:var(--text-ink-3);font-size:.75rem;line-height:1.5}.story__try{border:1px solid var(--border-strong);white-space:nowrap;height:2.5rem;color:var(--text-ink);transition:border-color .3s var(--story-ease), color .3s var(--story-ease);border-radius:999px;align-items:center;gap:.5rem;padding-inline:1rem;font-size:.875rem;font-weight:500;display:inline-flex}.story__try:hover,.story__try:focus-visible{border-color:var(--accent);color:var(--accent-text)}.story__try--compact{height:2.25rem;padding-inline:.75rem;font-size:.8125rem}.story__try--icon{justify-content:center;width:2.25rem;height:2.25rem;padding-inline:0}.story__try[data-ready]{background-color:var(--accent);background-image:var(--silk);color:var(--silk-ink);border-color:#0000}.story__try[data-ready]:hover,.story__try[data-ready]:focus-visible{color:var(--silk-ink)}.story__hint{color:var(--accent-text);opacity:0;transition:opacity .4s var(--story-ease), translate .4s var(--story-ease);align-items:center;gap:.375rem;font-size:.8125rem;font-weight:500;display:inline-flex;translate:0 -.25rem}.story__hint[data-shown]{opacity:1;translate:0}.story__hint[data-shown] svg{animation:story-nudge 1.6s var(--story-ease) infinite}@keyframes story-nudge{0%,to{translate:0}50%{translate:0 3px}}.story__label{letter-spacing:.14em;text-transform:uppercase;color:var(--text-ink-3);flex:none;padding-bottom:.25rem;font-size:.6875rem;font-weight:600}:lang(ar) .story__label{letter-spacing:0;font-size:.75rem}.story__caption{flex:none;padding-top:.5rem}.story__row{align-items:center;gap:.75rem;height:2.25rem;display:flex}.story__row[data-finished]>:not(:last-child){display:none}.story__row[data-finished]>:last-child{margin-inline-start:0}.story__pips{gap:.375rem;display:flex}.story__pip{background:var(--border-strong);border-radius:999px;width:1.75rem;height:.25rem;position:relative;overflow:hidden}.story__pip[data-state=done]{background:var(--accent)}.story__pip-fill{background:var(--accent);transform-origin:0;position:absolute;inset:0}[dir=rtl] .story__pip-fill{transform-origin:100%}.story__now{min-height:4.5rem;margin-top:.5rem}.story__now-title{color:var(--text-ink);font-size:1.0625rem;font-weight:600;line-height:1.35;display:block}.story__now-detail{color:var(--text-ink-2);margin-top:.25rem;font-size:.875rem;line-height:1.45;display:block}:lang(ar) .story__now-title{line-height:1.5}:lang(ar) .story__now-detail{line-height:1.75}.story__hint--phone{margin-top:.25rem}@media (min-width:64rem){.story__stage{grid-template-columns:minmax(16rem,22rem) minmax(0,1fr);align-items:center;column-gap:clamp(2rem,4vw,4rem);padding-block:1.5rem;display:grid}.story__rail{display:block}.story__label,.story__caption{display:none}.story__view{height:calc(100% + 3rem);margin-block:-1.5rem;margin-inline:0 calc(-1 * (var(--story-gutter) + max(0px, (100vw - 90rem) / 2)));-webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 2rem, #000 calc(100% - 2rem), transparent 100%), linear-gradient(to var(--story-toward,right), transparent 0, #000 4rem);-webkit-mask-composite:source-in;-webkit-mask-image:linear-gradient(to bottom, transparent 0, #000 2rem, #000 calc(100% - 2rem), transparent 100%), linear-gradient(to var(--story-toward,right), transparent 0, #000 4rem);mask-image:linear-gradient(to bottom, transparent 0, #000 2rem, #000 calc(100% - 2rem), transparent 100%), linear-gradient(to var(--story-toward,right), transparent 0, #000 4rem);-webkit-mask-composite:source-in;mask-composite:intersect}[dir=rtl] .story__view{--story-toward:left}}@media (prefers-reduced-motion:reduce){.story__track{height:auto}.story__stage{height:min(calc(100svh - var(--header-bottom)), 56rem);position:relative;top:auto}.story__world,.story-hand,.story__chapter,.story__more,.story__hint{transition:none}.story-coach,.story-coach[data-leaving],.story__hint[data-shown] svg{animation:none}}
.pf-stage{justify-content:center;display:flex}.pf-hatch{color:color-mix(in srgb, var(--text-ink-3) 22%, transparent);background:repeating-linear-gradient(135deg,currentColor 0 1px,#0000 1px 10px)}.pf-camera{background:radial-gradient(120% 95% at 50% -10%,#7a5427 0%,#3a2814 42%,#120d08 78%,#080604 100%)}.pf-camera:after{content:"";pointer-events:none;background:radial-gradient(130% 110% at 50% 45%,#0000 58%,#0000008c 100%);position:absolute;inset:0}.pf-shade{z-index:60;background:#00000080;place-items:center;display:grid;position:absolute;inset:0}.pf-dialog{border:1px solid var(--border-subtle);background:var(--surface-card);border-radius:.75rem;padding:1rem;box-shadow:0 24px 60px -24px #00000073}.pf-bell{z-index:50;border:1px solid var(--border-subtle);background:var(--surface-card);border-radius:.75rem;position:absolute;overflow:hidden;box-shadow:0 18px 40px -18px #0006}.pf-bell--desk{width:340px;top:84px;right:150px}.pf-bell--phone{top:118px;left:12px;right:12px}.pf-note--new{background:#f43f5e12}.pf-finished{z-index:70;background:var(--surface-card);border:1px solid #6ee7b7;border-radius:.5rem;animation:.42s cubic-bezier(.22,1,.36,1) both pf-in;position:absolute;overflow:hidden;box-shadow:0 18px 40px -18px #0006}.dark .pf-finished{border-color:#065f46}.pf-finished--desk{width:384px;top:88px;right:16px}.pf-finished--phone{top:112px;left:12px;right:12px}@keyframes pf-in{0%{translate:0 -12px}}@media (prefers-reduced-motion:reduce){.pf-finished{animation:none}}
