:root{color-scheme: light;--bg: #f5f6fb;--surface: #ffffff;--well: #f3f4fa;--ink: #0f1226;--ink-2: #393d5a;--muted: #5d6280;--line: #e2e4ef;--line-strong: #cdd1e3;--accent: #3a45f5;--accent-hover: #2934d6;--accent-ink: #ffffff;--accent-wash: #eef0ff;--accent-line: #c7cbfd;--grad-a: #4450f5;--grad-b: #7646f5;--ok: #067a53;--ok-wash: #e2f6ed;--ok-line: #a6e0c6;--bad: #c42f47;--bad-wash: #fdecef;--bad-line: #f3bfc9;--warn: #9a5800;--warn-wash: #fff3df;--warn-line: #f2d3a0;--sky-a: rgb(80 92 255 / 0.22);--sky-b: rgb(140 90 255 / 0.18);--sky-c: rgb(0 190 220 / 0.12);--grid: rgb(58 69 245 / 0.07);--shadow-sm: 0 1px 2px rgb(15 18 38 / 0.06),0 2px 8px -2px rgb(15 18 38 / 0.06);--shadow: 0 1px 2px rgb(15 18 38 / 0.05),0 24px 56px -28px rgb(40 48 150 / 0.35),0 8px 24px -16px rgb(40 48 150 / 0.2);--shadow-btn: 0 1px 1px rgb(15 18 38 / 0.1),0 10px 24px -10px rgb(68 80 245 / 0.65);--latin: "Geist",system-ui,-apple-system,"Segoe UI",Roboto,sans-serif;--mono: "Geist Mono",ui-monospace,SFMono-Regular,Menlo,Consolas,monospace;--font: "Geist","Vazirmatn","Heebo",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;--font-prose: var(--font);--tight: -0.035em;--wrap: 1160px;--gutter: 20px;--r-xl: 28px;--r-lg: 20px;--r-md: 14px;--r-sm: 10px;--body: 16px;--lh: 1.6;--lh-prose: 1.75;--lh-head: 1.08;--ease: cubic-bezier(0.22,1,0.36,1);--spring: cubic-bezier(0.34,1.56,0.64,1);--dirx: 1;interpolate-size: allow-keywords}@media (prefers-color-scheme: dark){:root:not([data-theme="light"]){color-scheme: dark;--bg: #090b17;--surface: #11142a;--well: #181b36;--ink: #eef0ff;--ink-2: #c4c8e4;--muted: #979cbd;--line: #232747;--line-strong: #343a62;--accent: #8f98ff;--accent-hover: #aab0ff;--accent-ink: #0b0d1c;--accent-wash: #1d2150;--accent-line: #3b4199;--grad-a: #4c58f7;--grad-b: #7a4cf2;--ok: #4ad8a3;--ok-wash: #0e3326;--ok-line: #1d6b4e;--bad: #ff8497;--bad-wash: #3a1722;--bad-line: #74303f;--warn: #ffc670;--warn-wash: #33260f;--warn-line: #6b5120;--sky-a: rgb(80 92 255 / 0.3);--sky-b: rgb(140 90 255 / 0.24);--sky-c: rgb(0 190 220 / 0.12);--grid: rgb(143 152 255 / 0.07);--shadow-sm: 0 1px 2px rgb(0 0 0 / 0.4);--shadow: 0 1px 2px rgb(0 0 0 / 0.5),0 30px 60px -30px rgb(0 0 0 / 0.8),0 0 0 1px rgb(143 152 255 / 0.06);--shadow-btn: 0 1px 1px rgb(0 0 0 / 0.3),0 12px 28px -12px rgb(100 90 255 / 0.7)}}:root[data-theme="dark"]{color-scheme: dark;--bg: #090b17;--surface: #11142a;--well: #181b36;--ink: #eef0ff;--ink-2: #c4c8e4;--muted: #979cbd;--line: #232747;--line-strong: #343a62;--accent: #8f98ff;--accent-hover: #aab0ff;--accent-ink: #0b0d1c;--accent-wash: #1d2150;--accent-line: #3b4199;--grad-a: #4c58f7;--grad-b: #7a4cf2;--ok: #4ad8a3;--ok-wash: #0e3326;--ok-line: #1d6b4e;--bad: #ff8497;--bad-wash: #3a1722;--bad-line: #74303f;--warn: #ffc670;--warn-wash: #33260f;--warn-line: #6b5120;--sky-a: rgb(80 92 255 / 0.3);--sky-b: rgb(140 90 255 / 0.24);--sky-c: rgb(0 190 220 / 0.12);--grid: rgb(143 152 255 / 0.07);--shadow-sm: 0 1px 2px rgb(0 0 0 / 0.4);--shadow: 0 1px 2px rgb(0 0 0 / 0.5),0 30px 60px -30px rgb(0 0 0 / 0.8),0 0 0 1px rgb(143 152 255 / 0.06);--shadow-btn: 0 1px 1px rgb(0 0 0 / 0.3),0 12px 28px -12px rgb(100 90 255 / 0.7)}html[lang="fa"],html[lang="ar"],html[lang="ur"]{--font: "Vazirmatn","Geist","Heebo",system-ui,-apple-system,"Segoe UI",Tahoma,sans-serif;--body: 17px;--lh: 1.85;--lh-prose: 2;--lh-head: 1.45;--tight: 0}html[lang="he"]{--font: "Heebo","Geist","Vazirmatn",system-ui,-apple-system,"Segoe UI",Arial,sans-serif;--body: 17px;--lh: 1.7;--lh-prose: 1.8;--lh-head: 1.2;--tight: -0.01em}html[lang="ur"]{--font-prose: "Nastaliq","Vazirmatn","Geist",serif;--lh-prose: 2.35}[dir="rtl"]{--dirx: -1}*,*::before,*::after{box-sizing: border-box}html{-webkit-text-size-adjust: 100%;text-size-adjust: 100%;scroll-padding-top: 84px}body{margin: 0;background: var(--bg);color: var(--ink);font-family: var(--font);font-size: var(--body);line-height: var(--lh);-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;text-rendering: optimizeLegibility;overflow-x: clip}img,svg{display: block;max-width: 100%}button,input,textarea,select{font: inherit;color: inherit}button{-webkit-tap-highlight-color: transparent}a{color: var(--accent);text-underline-offset: 0.2em;text-decoration-thickness: 1px}a:hover{color: var(--accent-hover)}:focus-visible{outline: 2px solid var(--accent);outline-offset: 2px;border-radius: 8px}code,.mono{font-family: var(--mono),var(--font);font-size: 0.9em}code{unicode-bidi: isolate;padding: 1px 7px;border-radius: 7px;background: var(--well);border: 1px solid var(--line)}bdi{unicode-bidi: isolate}[hidden]{display: none !important}h1,h2,h3{text-wrap: balance}p{text-wrap: pretty}.wrap{width: 100%;max-width: var(--wrap);margin-inline: auto;padding-inline: var(--gutter)}.sr-only{position: absolute !important;width: 1px;height: 1px;padding: 0;margin: -1px;overflow: hidden;clip: rect(0 0 0 0);white-space: nowrap;border: 0}.muted{color: var(--muted)}.skip{position: absolute;inset-inline-start: 12px;top: -60px;z-index: 60;background: var(--ink);color: var(--bg);padding: 10px 14px;border-radius: 10px;text-decoration: none}.skip:focus{top: 12px;color: var(--bg)}.top{position: sticky;top: 0;z-index: 30;border-bottom: 1px solid transparent;transition: border-color 0.3s,background-color 0.3s}.top.is-stuck{border-bottom-color: var(--line);background: color-mix(in srgb,var(--bg) 78%,transparent);-webkit-backdrop-filter: saturate(1.6) blur(14px);backdrop-filter: saturate(1.6) blur(14px)}.top__in{display: flex;align-items: center;justify-content: space-between;gap: 12px;min-height: 64px}.brand{display: inline-flex;align-items: center;gap: 10px;min-height: 44px;color: var(--ink);text-decoration: none;font-family: var(--latin);font-weight: 700;font-size: 19px;letter-spacing: -0.02em}.brand:hover{color: var(--ink)}.logo{display: grid;place-items: center;width: 32px;height: 32px;border-radius: 9px;color: #fff;background: linear-gradient(135deg,var(--grad-a),var(--grad-b));box-shadow: inset 0 1px 0 rgb(255 255 255 / 0.25),0 4px 12px -4px rgb(68 80 245 / 0.6)}.logo svg{width: 32px;height: 32px}.top__tools{display: flex;align-items: center;gap: 6px}.icon-btn{display: grid;place-items: center;width: 44px;height: 44px;padding: 0;border: 1px solid var(--line);border-radius: 12px;background: var(--surface);color: var(--ink-2);cursor: pointer;transition: background-color 0.2s,border-color 0.2s,color 0.2s,transform 0.2s var(--spring)}.icon-btn:hover{border-color: var(--line-strong);color: var(--ink)}.icon-btn:active{transform: scale(0.92)}.icon-btn svg{width: 20px;height: 20px}#theme .i-sun{display: none}:root[data-theme="dark"] #theme .i-moon{display: none}:root[data-theme="dark"] #theme .i-sun{display: block}@media (prefers-color-scheme: dark){:root:not([data-theme="light"]) #theme .i-moon{display: none}:root:not([data-theme="light"]) #theme .i-sun{display: block}}#sound .i-off{display: none}#sound[aria-pressed="false"] .i-on{display: none}#sound[aria-pressed="false"] .i-off{display: block}#sound[aria-pressed="false"]{color: var(--muted)}.lang{position: relative}.lang summary{display: flex;align-items: center;gap: 8px;height: 44px;padding-inline: 12px;list-style: none;cursor: pointer;border: 1px solid var(--line);border-radius: 12px;background: var(--surface);color: var(--ink-2);font-size: 15px;transition: border-color 0.2s,color 0.2s}.lang summary::-webkit-details-marker{display: none}.lang summary:hover{border-color: var(--line-strong);color: var(--ink)}.lang summary svg{width: 18px;height: 18px}.lang .chev{width: 14px;height: 14px;transition: transform 0.25s var(--ease)}.lang[open] .chev{transform: rotate(180deg)}.lang__menu{position: absolute;inset-inline-end: 0;top: calc(100% + 8px);z-index: 40;min-width: 184px;margin: 0;padding: 6px;list-style: none;background: var(--surface);border: 1px solid var(--line);border-radius: 16px;box-shadow: var(--shadow);transform-origin: top var(--menu-origin,right)}[dir="rtl"] .lang__menu{--menu-origin: left}.lang__menu a{display: flex;align-items: center;min-height: 44px;padding: 6px 12px;border-radius: 10px;color: var(--ink);text-decoration: none}.lang__menu a:hover{background: var(--well)}.lang__menu a[aria-current="page"]{background: var(--accent-wash);color: var(--accent);font-weight: 600}.hero{position: relative;isolation: isolate;padding-block: 36px 40px}.hero__sky{position: absolute;inset: -64px 0 0;z-index: -1;overflow: hidden;pointer-events: none;-webkit-mask-image: linear-gradient(to bottom,#000 55%,transparent);mask-image: linear-gradient(to bottom,#000 55%,transparent)}.hero__sky::before{content: "";position: absolute;inset: 0;background-image: linear-gradient(var(--grid) 1px,transparent 1px),linear-gradient(90deg,var(--grid) 1px,transparent 1px);background-size: 44px 44px;background-position: center top;-webkit-mask-image: radial-gradient(ellipse 70% 60% at 50% 20%,#000,transparent 75%);mask-image: radial-gradient(ellipse 70% 60% at 50% 20%,#000,transparent 75%)}.orb{position: absolute;border-radius: 50%}.orb--a{width: 720px;height: 720px;top: -340px;inset-inline-start: calc(50% - 640px);background: radial-gradient(closest-side,var(--sky-a),transparent)}.orb--b{width: 640px;height: 640px;top: -260px;inset-inline-start: calc(50% - 40px);background: radial-gradient(closest-side,var(--sky-b),transparent)}.orb--c{width: 520px;height: 520px;top: 180px;inset-inline-start: calc(50% - 300px);background: radial-gradient(closest-side,var(--sky-c),transparent)}.hero__head{max-width: 920px;text-align: center;padding-top: 28px}.pill{display: inline-flex;align-items: center;gap: 8px;margin: 0 0 22px;padding: 6px 14px 6px 10px;border: 1px solid var(--accent-line);border-radius: 999px;background: color-mix(in srgb,var(--surface) 75%,transparent);color: var(--ink-2);font-size: 14px;line-height: 1.5}[dir="rtl"] .pill{padding: 6px 10px 6px 14px}[dir="rtl"] .pill,[dir="rtl"] .chips li,[dir="rtl"] .chip{line-height: 1.75}.pill svg{width: 16px;height: 16px;color: var(--ok)}h1{margin: 0 auto;max-width: 15em;font-size: clamp(34px,5.6vw,64px);line-height: var(--lh-head);font-weight: 750;letter-spacing: var(--tight)}html[lang="fa"] h1,html[lang="ar"] h1,html[lang="ur"] h1{font-size: clamp(30px,4.8vw,54px);font-weight: 800}html[lang="ur"] h1{line-height: 1.6}.lede{margin: 20px auto 0;max-width: 40em;color: var(--ink-2);font-size: clamp(17px,1.6vw,20px);line-height: var(--lh)}.tool{max-width: 940px;margin-top: 40px}.card{position: relative;border-radius: var(--r-xl);box-shadow: var(--shadow);background: linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(135deg,var(--line),var(--line)) border-box;border: 1px solid transparent;transition: background 0.4s,box-shadow 0.4s}.card:focus-within{background: linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(135deg,var(--grad-a),var(--grad-b)) border-box}.card.is-fixed{background: linear-gradient(var(--surface),var(--surface)) padding-box,linear-gradient(135deg,var(--ok),var(--grad-a)) border-box}.card__bar{display: flex;align-items: center;justify-content: space-between;gap: 12px;flex-wrap: wrap;padding: 12px 12px 0}.tabs{position: relative;display: inline-flex;padding: 4px;border-radius: 14px;background: var(--well);border: 1px solid var(--line)}.tabs button{position: relative;z-index: 1;min-height: 40px;padding: 7px 14px;border: 0;border-radius: 10px;background: none;color: var(--muted);font-size: 15px;font-weight: 550;line-height: 1.5;cursor: pointer;white-space: nowrap;transition: color 0.25s}.tabs button:hover{color: var(--ink)}.tabs button[aria-selected="true"]{color: var(--ink)}.tabs__ind{position: absolute;top: 4px;bottom: 4px;left: 0;width: var(--ind-w,0);border-radius: 10px;background: var(--surface);box-shadow: var(--shadow-sm);border: 1px solid var(--line);transform: translateX(var(--ind-x,0));transition: transform 0.45s var(--spring),width 0.45s var(--spring)}.tabs:not(.is-ready) button[aria-selected="true"]{background: var(--surface);box-shadow: var(--shadow-sm)}.status{display: flex;flex-wrap: wrap;gap: 6px;margin: 0;min-height: 30px;align-items: center}.chip{display: inline-flex;align-items: center;gap: 5px;padding: 3px 11px;border-radius: 999px;background: var(--well);border: 1px solid var(--line);color: var(--ink-2);font-size: 13.5px;line-height: 1.6;white-space: nowrap}.chip svg{width: 14px;height: 14px}.chip--ok{background: var(--ok-wash);border-color: var(--ok-line);color: var(--ok);font-weight: 600}.card__body{position: relative;overflow: hidden}.view{padding: 8px 20px 4px}.ed{display: block;width: 100%;min-height: 230px;max-height: 62vh;padding: 10px 2px;resize: vertical;border: 0;outline: 0;background: transparent;color: var(--ink);font-size: 19px;line-height: 1.8;overflow-wrap: anywhere}html[lang="ur"] .ed{font-family: var(--font-prose);line-height: 2.2}.ed:focus-visible{outline: 2px solid color-mix(in srgb,var(--accent) 45%,transparent);outline-offset: 5px;border-radius: 10px}.ed::placeholder{color: var(--muted);opacity: 0.85}.scan{position: absolute;inset-block: 0;left: 0;width: 38%;pointer-events: none;opacity: 0;background: linear-gradient(90deg,transparent,color-mix(in srgb,var(--accent) 16%,transparent) 55%,color-mix(in srgb,var(--ok) 22%,transparent) 70%,transparent)}.pv{display: grid;gap: 12px;padding-block: 8px}.pv__item{margin: 0;padding: 14px 16px;border-radius: var(--r-md);border: 1px solid var(--line);background: var(--well)}.pv__item figcaption{display: flex;align-items: center;gap: 8px;margin-bottom: 8px;font-size: 13.5px;font-weight: 650;color: var(--muted)}.pv__item figcaption svg{width: 18px;height: 18px;padding: 3px;border-radius: 50%;flex: none}.pv__item--bad{background: var(--bad-wash);border-color: var(--bad-line)}.pv__item--bad figcaption{color: var(--bad)}.pv__item--bad figcaption svg{background: var(--bad);color: var(--surface)}.pv__item--ok{background: var(--ok-wash);border-color: var(--ok-line)}.pv__item--ok figcaption{color: var(--ok)}.pv__item--ok figcaption svg{background: var(--ok);color: var(--surface)}.pv__box{white-space: pre-wrap;overflow-wrap: anywhere;text-align: left;font-size: 17px;line-height: 1.85;color: var(--ink)}.pv__box.is-empty{color: var(--muted);font-size: 15px}html[dir="rtl"] .pv__box.is-empty{text-align: right}.pv__note{margin: 4px 0 12px;font-size: 14px;color: var(--muted)}.marks{display: grid;gap: 4px;padding-block: 10px;font-size: 17px;line-height: 2;max-height: 60vh;overflow: auto}.marks__line{white-space: pre-wrap;overflow-wrap: anywhere;min-height: 1em}.mk{display: inline-block;margin-inline: 3px;padding: 0 6px;border-radius: 6px;vertical-align: 0.1em;font-family: var(--mono);font-size: 11px;font-weight: 600;line-height: 1.75;letter-spacing: 0.02em;color: var(--accent);background: var(--accent-wash);border: 1px dashed var(--accent-line);unicode-bidi: isolate;direction: ltr}.marks .empty{margin: 0;color: var(--muted);font-size: 15px}.marks__foot{display: flex;align-items: center;justify-content: space-between;gap: 12px;flex-wrap: wrap;padding-block: 6px 12px;border-top: 1px dashed var(--line)}.marks__note{margin: 0;font-size: 14px;color: var(--muted)}.card__foot{display: flex;align-items: center;justify-content: space-between;gap: 12px;flex-wrap: wrap;margin: 0 12px 12px;padding: 10px 12px;border-radius: 16px;background: var(--well);font-size: 14.5px}.switch{display: inline-flex;align-items: center;gap: 10px;min-height: 44px;cursor: pointer;color: var(--ink-2);user-select: none}.switch input{position: absolute;opacity: 0;width: 1px;height: 1px}.switch__track{position: relative;flex: none;width: 42px;height: 24px;border-radius: 999px;background: var(--line-strong);transition: background-color 0.25s}.switch__knob{position: absolute;top: 3px;inset-inline-start: 3px;width: 18px;height: 18px;border-radius: 50%;background: #fff;box-shadow: 0 1px 3px rgb(0 0 0 / 0.25);transition: transform 0.35s var(--spring),width 0.2s var(--ease)}.switch input:checked + .switch__track{background: var(--accent)}.switch input:checked + .switch__track .switch__knob{transform: translateX(calc(18px * var(--dirx)))}.switch:active .switch__knob{width: 22px}.switch input:focus-visible + .switch__track{outline: 2px solid var(--accent);outline-offset: 2px}.switch.is-off{opacity: 0.5;cursor: not-allowed}.switch b{font-weight: 600;color: var(--ink)}.count{display: flex;gap: 14px;margin: 0;color: var(--muted);font-variant-numeric: tabular-nums}.actions{display: flex;flex-wrap: wrap;align-items: center;gap: 10px;margin-top: 18px}.btn{position: relative;display: inline-flex;align-items: center;justify-content: center;gap: 9px;min-height: 48px;padding: 10px 18px;border-radius: 14px;cursor: pointer;border: 1px solid var(--line-strong);background: var(--surface);color: var(--ink);font-size: 16px;font-weight: 600;line-height: 1.3;text-decoration: none;white-space: nowrap;transition: transform 0.25s var(--spring),background-color 0.2s,border-color 0.2s,box-shadow 0.25s,color 0.2s}.btn:hover{border-color: var(--ink-2)}.btn:active{transform: scale(0.96)}.btn svg{width: 20px;height: 20px;flex: none}.btn .i-check{display: none}.btn.is-done .i-main{display: none}.btn.is-done .i-check{display: block}.btn--primary{min-height: 54px;padding-inline: 24px;border: 0;color: #fff;font-size: 17px;background: linear-gradient(135deg,var(--grad-a),var(--grad-b));box-shadow: var(--shadow-btn)}.btn--primary::before{content: "";position: absolute;inset: 0;border-radius: inherit;pointer-events: none;background: linear-gradient(180deg,rgb(255 255 255 / 0.22),transparent 55%)}.btn--primary:hover{color: #fff;box-shadow: 0 1px 1px rgb(15 18 38 / 0.1),0 16px 32px -12px rgb(68 80 245 / 0.75);transform: translateY(-1px)}.btn--primary:active{transform: scale(0.96)}.btn--primary.is-done{background: linear-gradient(135deg,#06825a,#0a9d6c)}.btn--ghost{border-color: transparent;background: transparent;color: var(--muted)}.btn--ghost:hover{background: var(--well);border-color: transparent;color: var(--ink)}.btn--quiet{min-height: 44px;padding: 6px 14px;font-size: 14.5px}.btn--light{border: 0;background: #fff;color: #2a2f9c;box-shadow: 0 10px 24px -12px rgb(0 0 0 / 0.5)}.btn--light:hover{color: #1c2080}.btn--light.is-done{background: #e2f6ed;color: #06603f}.btn:disabled{cursor: default}.burst{position: absolute;inset: 0;pointer-events: none;border-radius: inherit}.examples{display: flex;flex-wrap: wrap;align-items: center;gap: 8px 12px;margin-top: 20px;color: var(--muted);font-size: 14.5px}.examples ul{display: flex;flex-wrap: wrap;gap: 8px;margin: 0;padding: 0;list-style: none}.examples button{min-height: 40px;padding: 5px 16px;border-radius: 999px;border: 1px solid var(--line);background: var(--surface);color: var(--ink-2);font-family: "Vazirmatn","Heebo",var(--font);font-size: 15px;line-height: 1.7;cursor: pointer;transition: transform 0.25s var(--spring),border-color 0.2s,color 0.2s,background-color 0.2s}.examples button:hover{border-color: var(--accent-line);color: var(--accent);background: var(--accent-wash);transform: translateY(-2px)}.examples button:active{transform: scale(0.94)}.examples button[lang="he"]{font-family: "Heebo",var(--font)}.noscript{margin-top: 16px;padding: 12px 16px;border-radius: 12px;background: var(--warn-wash);color: var(--warn)}.dock{position: fixed;inset-inline: 0;bottom: 0;z-index: 35;padding: 12px var(--gutter) calc(12px + env(safe-area-inset-bottom));background: color-mix(in srgb,var(--bg) 80%,transparent);-webkit-backdrop-filter: blur(14px);backdrop-filter: blur(14px);border-top: 1px solid var(--line)}.dock .btn{width: 100%}.content{padding-bottom: 40px}.sec{padding-block: clamp(56px,8vw,104px) 0}.sec__title{margin: 0 0 16px;font-size: clamp(27px,3.4vw,42px);line-height: var(--lh-head);font-weight: 750;letter-spacing: var(--tight)}html[lang="fa"] .sec__title,html[lang="ar"] .sec__title,html[lang="ur"] .sec__title{font-weight: 800;font-size: clamp(25px,3vw,38px)}.sec__head{max-width: 720px;margin-bottom: 32px}.sec__intro{margin: 0;color: var(--ink-2);font-size: 18px}h3{margin: 0 0 6px;font-size: 19px;line-height: 1.4;font-weight: 700}.prose p{font-family: var(--font-prose);line-height: var(--lh-prose);color: var(--ink-2);font-size: 17.5px}.steps{display: grid;grid-template-columns: repeat(3,1fr);gap: 18px;margin: 24px 0 0;padding: 0;list-style: none;counter-reset: s}.step{position: relative;padding: 22px 22px 24px;border-radius: var(--r-lg);background: var(--surface);border: 1px solid var(--line);box-shadow: var(--shadow-sm);transition: transform 0.4s var(--ease),box-shadow 0.4s var(--ease),border-color 0.3s}.step:hover{transform: translateY(-4px);box-shadow: var(--shadow);border-color: var(--accent-line)}.step__art{display: grid;place-items: center;height: 132px;margin-bottom: 16px;border-radius: var(--r-md);background: var(--well)}.step__art .il{width: 176px;height: auto}.step__num{display: inline-grid;place-items: center;width: 30px;height: 30px;margin-bottom: 10px;border-radius: 9px;background: linear-gradient(135deg,var(--grad-a),var(--grad-b));color: #fff;font-family: var(--latin);font-weight: 700;font-size: 15px}.step p{margin: 0;color: var(--ink-2)}.il{overflow: visible}.il text{font-family: var(--mono);font-size: 11px;font-weight: 600;fill: var(--accent)}.f-acc{fill: var(--accent)}.f-ln{fill: var(--line-strong)}.f-surf{fill: var(--surface)}.f-well{fill: var(--well)}.f-wash{fill: var(--accent-wash)}.f-ok{fill: var(--ok)}.f-bad{fill: var(--bad)}.f-none{fill: none}.f-white{fill: #fff}.f-ink{fill: var(--ink)}.s-ln{stroke: var(--line-strong)}.s-acc{stroke: var(--accent);fill: none}.s-ok{stroke: var(--ok)}.s-bg{stroke: var(--surface);fill: none}.s-ink{stroke: var(--ink);fill: none}.s-2{stroke-width: 2;stroke-linecap: round;stroke-linejoin: round}rect.s-acc{fill: var(--surface)}rect.f-wash.s-acc{fill: var(--accent-wash)}.dash{stroke-dasharray: 2.5 2}.a-sweep{fill: var(--accent);opacity: 0}.install{position: relative;overflow: hidden;isolation: isolate;display: grid;grid-template-columns: 1.15fr 0.85fr;align-items: center;gap: 24px;padding: clamp(28px,5vw,56px);border-radius: 32px;color: #eef0ff;background: radial-gradient(ellipse at 85% 0%,rgb(140 100 255 / 0.55),transparent 60%),radial-gradient(ellipse at 0% 100%,rgb(0 190 220 / 0.25),transparent 55%),linear-gradient(140deg,#141a5c,#2a2190 55%,#3b1f8f);box-shadow: 0 40px 80px -40px rgb(40 30 140 / 0.6)}.install::after{content: "";position: absolute;inset: 0;z-index: -1;opacity: 0.5;background-image: linear-gradient(rgb(255 255 255 / 0.05) 1px,transparent 1px),linear-gradient(90deg,rgb(255 255 255 / 0.05) 1px,transparent 1px);background-size: 36px 36px}.install h2{margin: 0 0 12px;font-size: clamp(26px,3vw,38px);line-height: var(--lh-head);letter-spacing: var(--tight);color: #fff}.install p{color: #cfd3ff}.install__feats{display: grid;gap: 10px;margin: 20px 0;padding: 0;list-style: none}.install__feats li{display: flex;align-items: center;gap: 12px;font-weight: 600;color: #fff}.install__feats svg{width: 38px;height: 38px;padding: 9px;flex: none;border-radius: 11px;background: rgb(255 255 255 / 0.1);border: 1px solid rgb(255 255 255 / 0.16)}.install__share{font-size: 15px}.install__cta{margin-top: 18px}.install__how{margin: 0;padding: 12px 16px;border-radius: 14px;background: rgb(255 255 255 / 0.08);border: 1px solid rgb(255 255 255 / 0.14);font-size: 15px;color: #e6e8ff !important}.install__note{margin-bottom: 0;font-size: 14px;color: #aeb3ea !important}.install__art{display: grid;place-items: center}.install__art .il{width: min(320px,100%);height: auto}.install .il{--surface: #1b2066;--well: #232a7a;--line-strong: #3d46a8;--accent: #a5adff;--accent-wash: #2d3590}.split{display: grid;grid-template-columns: 1fr 1fr;gap: clamp(28px,5vw,64px);align-items: start}.split .prose p:last-child{margin-bottom: 0}.demo{margin: 0;padding: 20px;border-radius: var(--r-xl);background: var(--surface);border: 1px solid var(--line);box-shadow: var(--shadow);position: sticky;top: 96px}.demo figcaption{display: flex;align-items: center;justify-content: space-between;gap: 12px;margin-bottom: 14px;font-weight: 700}.demo__replay{display: inline-flex;align-items: center;gap: 6px;min-height: 40px;padding: 5px 14px;border-radius: 999px;border: 1px solid var(--line);background: var(--well);color: var(--ink-2);font-size: 13.5px;font-weight: 600;cursor: pointer;transition: color 0.2s,border-color 0.2s,transform 0.25s var(--spring)}.demo__replay:hover{color: var(--accent);border-color: var(--accent-line)}.demo__replay:active{transform: scale(0.94)}.demo__replay svg{width: 15px;height: 15px;transition: transform 0.5s var(--ease)}.demo__replay:hover svg{transform: rotate(calc(-200deg * var(--dirx)))}.demo__row{position: relative;padding: 12px 16px;border-radius: var(--r-md);border: 1px solid var(--line);background: var(--well)}.demo__row + .demo__row{margin-top: 10px}.demo__label{display: flex;align-items: center;gap: 7px;margin-bottom: 4px;font-size: 13px;font-weight: 650;color: var(--muted)}.demo__label svg{width: 16px;height: 16px;padding: 2px;border-radius: 50%;flex: none;color: var(--surface)}.demo__text{font-family: "Vazirmatn","Heebo",var(--font);font-size: 19px;line-height: 1.8;overflow-wrap: anywhere}.demo__text[lang="he"]{font-family: "Heebo",var(--font)}.demo__row--bad{background: var(--bad-wash);border-color: var(--bad-line)}.demo__row--bad .demo__label{color: var(--bad)}.demo__row--bad .demo__label svg{background: var(--bad)}.demo__row--ok{background: var(--ok-wash);border-color: var(--ok-line)}.demo__row--ok .demo__label{color: var(--ok)}.demo__row--ok .demo__label svg{background: var(--ok)}.bento{display: grid;grid-template-columns: repeat(3,1fr);gap: 14px;margin: 0;padding: 0;list-style: none}.tile{position: relative;display: flex;flex-direction: column;padding: 22px;border-radius: var(--r-lg);background: var(--surface);border: 1px solid var(--line);box-shadow: var(--shadow-sm);transition: transform 0.4s var(--ease),box-shadow 0.4s var(--ease),border-color 0.3s}.tile:hover{transform: translateY(-3px);box-shadow: var(--shadow);border-color: var(--accent-line)}.tile--wide{grid-column: span 2;grid-row: span 2;background: radial-gradient(ellipse at 100% 0%,var(--sky-b),transparent 60%),radial-gradient(ellipse at 0% 100%,var(--sky-a),transparent 55%),var(--surface)}.tile--fill3{grid-column: span 2}.tile--wide h3{font-size: 24px}.tile--wide p{font-size: 17px;max-width: 34em}.tile p{margin: 0;color: var(--ink-2)}.tile__icon{display: grid;place-items: center;width: 44px;height: 44px;margin-bottom: 14px;border-radius: 13px;background: var(--accent-wash);color: var(--accent);border: 1px solid var(--accent-line);transition: transform 0.45s var(--spring)}.tile:hover .tile__icon{transform: rotate(calc(-8deg * var(--dirx))) scale(1.08)}.tile__icon svg{width: 22px;height: 22px}.glyph{font-family: "Vazirmatn",var(--latin);font-size: 23px;font-weight: 700;line-height: 1}.glyph--sm{font-size: 16px}.ex{display: inline-flex;align-items: center;gap: 10px;margin-top: 14px !important;padding: 6px 12px;border-radius: 12px;background: var(--well);width: fit-content;font-size: 18px}.ex s{color: var(--bad);text-decoration-thickness: 2px}.ex ins{color: var(--ok);text-decoration: none;font-weight: 700}.ex .arrow{width: 18px;height: 18px;color: var(--muted);transform: scaleX(var(--dirx))}.lockdemo{display: grid;gap: 10px;margin-top: auto;padding-top: 22px}.lockdemo__row{display: flex;align-items: center;gap: 12px;padding: 14px 16px;border-radius: 16px;background: color-mix(in srgb,var(--surface) 85%,transparent);border: 1px solid var(--line)}.lockdemo__row>svg{width: 22px;height: 22px;padding: 4px;flex: none;border-radius: 50%;color: var(--surface)}.lockdemo__row--bad>svg{background: var(--bad)}.lockdemo__row--ok{border: 1px dashed var(--accent-line)}.lockdemo__row--ok>svg{background: var(--ok)}.tile .lockdemo p{flex: 1;margin: 0;max-width: none;font-family: "Vazirmatn","Heebo",var(--font);font-size: 18px;line-height: 1.8;color: var(--ink)}.lockdemo .mk{font-size: 11.5px;padding: 1px 7px}.note{display: flex;align-items: flex-start;gap: 10px;margin: 18px 0 0;padding: 14px 18px;border-radius: var(--r-md);background: var(--ok-wash);border: 1px solid var(--ok-line);color: var(--ink-2)}.note svg{width: 20px;height: 20px;flex: none;margin-top: 3px;color: var(--ok)}.where{display: grid;grid-template-columns: 1.15fr 1fr;gap: 16px;margin-top: 28px}.panel{padding: clamp(20px,3vw,30px);border-radius: var(--r-lg);border: 1px solid var(--line);background: var(--surface);box-shadow: var(--shadow-sm)}.panel h3{display: flex;align-items: center;gap: 10px;margin-bottom: 16px;font-size: 20px}.panel h3 svg{width: 24px;height: 24px;flex: none}.panel p{color: var(--ink-2)}.panel .muted{margin-bottom: 0;color: var(--muted);font-size: 15px}.panel--warn{background: linear-gradient(var(--warn-wash),var(--surface) 70%);border-color: var(--warn-line)}.panel--warn h3 svg{color: var(--warn)}.chips{display: flex;flex-wrap: wrap;gap: 8px;margin: 0 0 18px;padding: 0;list-style: none}.chips li{display: inline-flex;align-items: center;gap: 7px;padding: 7px 13px;border-radius: 12px;font-size: 15px;line-height: 1.5;background: var(--well);border: 1px solid var(--line);color: var(--ink)}.chips svg{width: 16px;height: 16px;flex: none;color: var(--ok)}.tip{display: flex;gap: 10px;margin-bottom: 0;padding: 14px 16px;border-radius: var(--r-md);background: var(--surface);border: 1px solid var(--warn-line)}.tip svg{width: 20px;height: 20px;flex: none;margin-top: 3px;color: var(--warn)}.table-wrap{overflow-x: auto;border-radius: var(--r-lg);border: 1px solid var(--line);background: var(--surface);box-shadow: var(--shadow-sm)}table{width: 100%;border-collapse: collapse;font-size: 16px}th,td{padding: 14px 18px;text-align: start;vertical-align: top;border-bottom: 1px solid var(--line)}th{font-size: 13.5px;font-weight: 650;color: var(--muted);background: var(--well)}tbody tr:last-child td{border-bottom: 0}tbody tr{transition: background-color 0.2s}tbody tr:hover{background: color-mix(in srgb,var(--accent-wash) 50%,transparent)}td small{display: block;margin-top: 4px;color: var(--muted);font-size: 13.5px}.tag{display: inline-block;padding: 2px 10px;border-radius: 8px;font-family: var(--mono);font-weight: 700;font-size: 14px;color: var(--accent);background: var(--accent-wash);border: 1px dashed var(--accent-line)}.cp{font-family: var(--mono);white-space: nowrap;color: var(--ink-2);direction: ltr;unicode-bidi: isolate}.faq{display: grid;gap: 10px;max-width: 860px;margin-top: 24px}.faq details{border-radius: var(--r-md);border: 1px solid var(--line);background: var(--surface);transition: border-color 0.25s,box-shadow 0.25s}.faq details[open]{border-color: var(--accent-line);box-shadow: var(--shadow-sm)}.faq summary{display: flex;align-items: center;justify-content: space-between;gap: 16px;padding: 16px 20px;cursor: pointer;list-style: none;font-weight: 650;font-size: 17px}.faq summary::-webkit-details-marker{display: none}.faq summary:hover{color: var(--accent)}.pm{position: relative;flex: none;width: 28px;height: 28px;border-radius: 50%;background: var(--well);transition: background-color 0.25s,transform 0.4s var(--spring)}.pm::before,.pm::after{content: "";position: absolute;top: 50%;left: 50%;width: 12px;height: 2px;margin: -1px 0 0 -6px;border-radius: 2px;background: currentColor;transition: transform 0.35s var(--ease)}.pm::after{transform: rotate(90deg)}.faq details[open] .pm{background: var(--accent-wash);color: var(--accent);transform: rotate(180deg)}.faq details[open] .pm::after{transform: rotate(0deg)}.faq__a{padding: 0 20px 18px}.faq__a p{margin: 0;color: var(--ink-2);font-family: var(--font-prose);line-height: var(--lh-prose)}.faq details::details-content{block-size: 0;overflow-y: clip;transition: block-size 0.4s var(--ease),content-visibility 0.4s allow-discrete}.faq details[open]::details-content{block-size: auto}.about{max-width: 760px;padding: clamp(24px,4vw,40px);border-radius: var(--r-xl);background: var(--surface);border: 1px solid var(--line)}.about p{color: var(--ink-2);font-family: var(--font-prose);line-height: var(--lh-prose)}.updated{margin-bottom: 0;font-size: 14px;color: var(--muted) !important}.foot{margin-top: 64px;padding-block: 48px 28px;border-top: 1px solid var(--line);background: var(--surface);font-size: 15px}.foot__in{display: grid;grid-template-columns: 1.4fr 1fr 1fr;gap: 32px}.foot p{margin: 10px 0 0;color: var(--muted);max-width: 32em}.foot h2{margin: 0 0 12px;font-size: 14px;font-weight: 700;color: var(--ink)}.foot ul{display: grid;gap: 2px;margin: 0;padding: 0;list-style: none}.foot ul a{display: inline-flex;align-items: center;min-height: 36px;min-width: 44px;color: var(--ink-2);text-decoration: none}.foot ul a:hover{color: var(--accent)}.foot__legal{margin-top: 36px !important;padding-top: 20px;border-top: 1px solid var(--line);font-size: 13.5px}.toast,.suggest{position: fixed;z-index: 50;left: 50%;bottom: 24px;transform: translateX(-50%);width: max-content;max-width: calc(100% - 32px)}.toast{padding: 12px 18px;border-radius: 14px;background: var(--ink);color: var(--bg);font-size: 15px;box-shadow: var(--shadow)}.suggest__in{display: flex;align-items: center;gap: 12px;flex-wrap: wrap;padding: 10px 10px 10px 18px;border-radius: 18px;background: var(--ink);color: var(--bg);box-shadow: var(--shadow);font-size: 15px}[dir="rtl"].suggest .suggest__in,.suggest[dir="rtl"] .suggest__in{padding: 10px 18px 10px 10px}.suggest p{margin: 0}.suggest a{display: inline-flex;align-items: center;min-height: 44px;padding: 7px 14px;border-radius: 11px;background: var(--bg);color: var(--ink);font-weight: 650;text-decoration: none}.suggest button{display: grid;place-items: center;width: 44px;height: 44px;padding: 0;border: 0;border-radius: 10px;background: transparent;color: var(--bg);cursor: pointer}.suggest button:hover{background: rgb(127 127 127 / 0.25)}.dock:not([hidden]) ~ .suggest,body:has(.dock:not([hidden])) .toast{bottom: 96px}.plain .nf{display: grid;gap: 22px;padding-block: 48px 80px}.nf__code{margin: 0;font-family: var(--latin);font-size: clamp(72px,14vw,140px);font-weight: 800;line-height: 1;letter-spacing: -0.05em;background: linear-gradient(135deg,var(--grad-a),var(--grad-b));-webkit-background-clip: text;background-clip: text;color: transparent}.nf h1,.nf h2{margin: 0;max-width: none;font-size: 22px;line-height: 1.4;letter-spacing: 0}.nf p{margin: 4px 0 0;color: var(--muted)}.nf__langs{display: flex;flex-wrap: wrap;gap: 10px;margin: 0;padding: 0;list-style: none}.nf__langs a{display: inline-block;padding: 10px 18px;border: 1px solid var(--line-strong);border-radius: 999px;background: var(--surface);text-decoration: none}@media (max-width: 960px){.bento{grid-template-columns: repeat(2,1fr)}.tile--wide{grid-row: auto}.tile--fill3{grid-column: auto}.tile--fill2{grid-column: span 2}.split{grid-template-columns: 1fr}.demo{position: relative;top: 0}.where{grid-template-columns: 1fr}}@media (max-width: 800px){.steps{grid-template-columns: 1fr}.install{grid-template-columns: 1fr}.install__art{order: -1}.install__art .il{width: 220px}.foot__in{grid-template-columns: 1fr 1fr}.foot__brand{grid-column: 1 / -1}}@media (max-width: 719px){:root{--gutter: 16px}.top__in{min-height: 58px}.hero{padding-top: 16px}.hero__head{padding-top: 16px}.tool{margin-top: 28px;padding-inline: 10px}.card{border-radius: 22px}.card__bar{padding: 10px 10px 0}.view{padding-inline: 14px}.tabs{width: 100%}.tabs button{flex: 1;min-height: 44px;padding-inline: 8px;font-size: 14px}.examples button,.demo__replay{min-height: 44px}.foot ul a{min-height: 44px}.ed{min-height: 200px;font-size: 18px}.card__foot{margin: 0 8px 8px}.actions .btn--primary{flex: 1 1 100%}.actions .btn:not(.btn--primary){flex: 1}.bento{grid-template-columns: 1fr}.tile--wide,.tile--fill2{grid-column: auto}.lang__name{display: none}.lang summary{width: 44px;padding: 0;justify-content: center}.lang summary .chev{display: none}th,td{padding: 12px}}@media (max-width: 480px){.foot__in{grid-template-columns: 1fr}.count{gap: 10px;font-size: 13px}}@media (prefers-reduced-motion: no-preference){html{scroll-behavior: smooth}.rise{animation: rise 0.9s var(--ease) both;animation-delay: calc(var(--d,0) * 90ms + 60ms)}@keyframes rise{from{opacity: 0;transform: translateY(18px);filter: blur(6px)}}.orb--a{animation: drift-a 11s ease-in-out 2 alternate}.orb--b{animation: drift-b 12s ease-in-out 2 alternate}.orb--c{animation: drift-c 13s ease-in-out 2 alternate}@keyframes drift-a{to{transform: translate(90px,60px) scale(1.08)}}@keyframes drift-b{to{transform: translate(-110px,40px) scale(0.94)}}@keyframes drift-c{to{transform: translate(60px,-50px) scale(1.12)}}.anim .reveal{transition: opacity 0.8s var(--ease),transform 0.8s var(--ease);transition-delay: calc(var(--d,0) * 90ms)}.anim .reveal:not(.is-in){opacity: 0;transform: translateY(28px)}.card.is-fixing .scan{animation: scan 0.9s var(--ease) both}.card[data-flow="rtl"].is-fixing .scan{animation-name: scan-rtl}@keyframes scan{0%{opacity: 1;transform: translateX(-110%)}100%{opacity: 1;transform: translateX(290%)}}@keyframes scan-rtl{0%{opacity: 1;transform: translateX(290%)}100%{opacity: 1;transform: translateX(-110%)}}.chip.is-new{animation: chip-in 0.55s var(--spring) both}@keyframes chip-in{from{opacity: 0;transform: scale(0.6) translateY(4px)}}.chip--ok.is-new svg path{stroke-dasharray: 24;animation: draw 0.5s 0.15s var(--ease) both}@keyframes draw{from{stroke-dashoffset: 24}to{stroke-dashoffset: 0}}.view.is-entering{animation: view-in 0.4s var(--ease) both}@keyframes view-in{from{opacity: 0;transform: translateY(8px)}}.pv__item--ok.is-entering{animation: view-in 0.5s 0.12s var(--ease) both}.marks .mk{animation: chip-in 0.45s var(--spring) both;animation-delay: calc(var(--i,0) * 25ms)}.ed.is-clearing{animation: clear-out 0.28s var(--ease) both}@keyframes clear-out{to{opacity: 0;transform: translateY(-6px);filter: blur(4px)}}.btn.is-done .i-check{animation: pop 0.5s var(--spring) both}.btn.is-done .i-check .draw{stroke-dasharray: 24;animation: draw 0.4s 0.1s var(--ease) both}@keyframes pop{from{transform: scale(0.3) rotate(-25deg);opacity: 0}}.burst.is-on{animation: ring 0.7s var(--ease) both}@keyframes ring{from{box-shadow: 0 0 0 0 color-mix(in srgb,var(--ok) 55%,transparent)}to{box-shadow: 0 0 0 16px transparent}}.burst.is-on::before{content: "";position: absolute;top: 50%;left: 50%;width: 6px;height: 6px;margin: -3px;border-radius: 50%;color: var(--ok);box-shadow: 0 -34px 0 currentColor,30px -18px 0 #8f98ff,30px 18px 0 currentColor,0 34px 0 #b39bff,-30px 18px 0 currentColor,-30px -18px 0 #8f98ff,64px 0 0 currentColor,-64px 0 0 #b39bff;animation: sparks 0.7s var(--ease) both}@keyframes sparks{from{transform: scale(0.2);opacity: 1}70%{opacity: 1}to{transform: scale(1.5);opacity: 0}}.btn.is-shake,.card.is-shake{animation: shake 0.42s var(--ease)}@keyframes shake{20%{transform: translateX(-5px)}40%{transform: translateX(5px)}60%{transform: translateX(-3px)}80%{transform: translateX(2px)}}.lang[open] .lang__menu{animation: menu-in 0.22s var(--ease) both}@keyframes menu-in{from{opacity: 0;transform: translateY(-6px) scale(0.96)}}.icon-btn.is-spin svg{animation: spin 0.6s var(--spring)}@keyframes spin{from{transform: rotate(-120deg) scale(0.4);opacity: 0}}#sound[aria-pressed="true"].is-spin .wave{animation: wave 0.6s var(--ease) both}#sound .w2{animation-delay: 0.1s !important}@keyframes wave{from{opacity: 0;transform: translateX(-3px)}}.toast,.suggest:not([hidden]){animation: toast-in 0.45s var(--spring) both}@keyframes toast-in{from{opacity: 0;transform: translate(-50%,16px) scale(0.96)}}.anim .step.is-in .a-drop{animation: drop 0.7s var(--spring) both;animation-delay: calc(var(--d) * 120ms + 300ms)}@keyframes drop{from{opacity: 0;transform: translateY(-10px)}}.anim .step.is-in .a-nudge{animation: nudge 1.6s 0.6s var(--ease) 2}@keyframes nudge{50%{transform: translateX(5px)}}.anim .step.is-in .a-blink{animation: blink 1.1s 0.6s steps(2,jump-none) 3}@keyframes blink{50%{opacity: 0}}.anim .step.is-in .a-pop{animation: pop-in 0.5s var(--spring) both;animation-delay: calc(var(--d,0) * 110ms + 350ms);transform-box: view-box}.anim .step.is-in .a-late{animation-delay: 1.1s}@keyframes pop-in{from{opacity: 0;transform: scale(0.2)}}.anim .step.is-in .a-draw{stroke-dasharray: 1;animation: draw-1 0.45s 1.35s var(--ease) both}@keyframes draw-1{from{stroke-dashoffset: 1}to{stroke-dashoffset: 0}}.anim .step.is-in .a-sweep{animation: sweep 1.1s 0.2s var(--ease) both}@keyframes sweep{0%{opacity: 0.18;transform: translateX(110px)}100%{opacity: 0;transform: translateX(0)}}.anim .step.is-in .a-fly{animation: fly 2.8s 0.5s var(--ease) 1 both}@keyframes fly{0%{transform: translate(-70px,16px) scale(0.85);opacity: 0}20%{opacity: 1}55%,100%{transform: none;opacity: 1}}.anim .install.is-in .a-float{animation: float 2.4s ease-in-out 2 alternate;animation-delay: calc(var(--d,0) * 0.3s)}@keyframes float{to{transform: translateY(-10px)}}.anim .install.is-in .a-drop{animation: drop 0.8s var(--spring) both;animation-delay: calc(var(--d) * 140ms + 400ms)}.anim .install.is-in .a-ring{transform-box: view-box;animation: ring-pulse 1.6s 1s var(--ease) 2}@keyframes ring-pulse{0%{transform: scale(1);opacity: 1}60%,100%{transform: scale(1.5);opacity: 0}}.anim .demo .demo__row{transition: opacity 0.6s var(--ease),transform 0.6s var(--ease)}.anim .demo:not(.is-playing) .demo__row:not(.demo__row--typed){opacity: 0;transform: translateY(14px)}.anim .demo.is-playing .demo__row--bad{transition-delay: 0.35s}.anim .demo.is-playing .demo__row--bad .demo__text{animation: glitch 0.6s 0.9s var(--ease) both}.anim .demo.is-playing .demo__row--ok{transition-delay: 1.5s}.anim .demo.is-playing .demo__row--ok{animation: settle 0.9s 1.6s var(--ease) both}@keyframes glitch{15%{transform: translateX(-4px)}30%{transform: translateX(4px)}45%{transform: translateX(-3px)}60%{transform: translateX(2px)}100%{transform: none}}@keyframes settle{0%{box-shadow: 0 0 0 0 color-mix(in srgb,var(--ok) 45%,transparent)}100%{box-shadow: 0 0 0 14px transparent}}.anim .demo.is-playing .demo__row--ok .demo__label svg{animation: pop 0.5s 1.7s var(--spring) both}.anim .tile--wide.is-in .lockdemo__row--bad p{animation: glitch 0.6s 0.4s var(--ease) both}.anim .tile--wide.is-in .lockdemo__row--ok .mk:first-child{animation: mk-in-start 0.6s 0.9s var(--spring) both}.anim .tile--wide.is-in .lockdemo__row--ok .mk:last-child{animation: mk-in-end 0.6s 1.1s var(--spring) both}.anim .tile--wide.is-in .lockdemo__row--ok>svg{animation: pop 0.5s 1.3s var(--spring) both}@keyframes mk-in-start{from{opacity: 0;transform: translateX(calc(16px * var(--dirx) * -1)) scale(0.6)}}@keyframes mk-in-end{from{opacity: 0;transform: translateX(calc(16px * var(--dirx))) scale(0.6)}}.anim .panel--ok.is-in .chips li{animation: chip-in 0.5s var(--spring) both;animation-delay: calc(var(--i) * 45ms + 200ms)}.anim .tile.is-in .ex ins{animation: ins-in 0.6s 0.5s var(--spring) both;display: inline-block}@keyframes ins-in{from{opacity: 0;transform: scale(0.5)}}::view-transition-old(root),::view-transition-new(root){animation: none;mix-blend-mode: normal}::view-transition-new(root){animation: reveal-theme 0.6s var(--ease)}@keyframes reveal-theme{from{clip-path: circle(0 at var(--tx,50%) var(--ty,0))}to{clip-path: circle(var(--tr,150vmax) at var(--tx,50%) var(--ty,0))}}}