.xfam-demo-player{--top-bar-height: 0px;display:grid;grid-template-columns:minmax(0,1fr);gap:var(--space-12);max-width:1440px;margin:0 auto;padding:var(--space-12) var(--space-16) 0}.xfam-demo-player__screen{display:grid;grid-template-columns:minmax(0,1fr);grid-template-rows:auto minmax(0,1fr) auto auto auto;gap:var(--space-12);height:calc(100dvh - var(--space-12));min-height:420px}.xfam-demo-player__head{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-8) var(--space-16);min-height:40px}.xfam-demo-player__back{display:inline-flex;align-items:center;gap:var(--space-8);font-size:var(--text-14);color:var(--color-text-muted);text-decoration:none;white-space:nowrap;transition:color var(--duration-fast) var(--ease-smooth)}.xfam-demo-player__back:hover{color:var(--color-text)}.xfam-demo-player__title{flex:1 1 16ch;min-width:0;margin:0;font-family:var(--font-serif),serif;font-weight:var(--font-weight-semibold);font-size:var(--text-20);line-height:1.2;letter-spacing:-.01em;text-wrap:balance;transition:opacity var(--duration-enter) var(--ease-enter)}.xfam-demo-player.is-starting .xfam-demo-player__title{opacity:0;transition:none}.xfam-demo-player.is-ending .xfam-demo-player__title{opacity:0;transition:opacity var(--duration-slower) var(--ease-exit)}.xfam-demo-player__tools{display:inline-flex;align-items:center;gap:var(--space-4)}.xfam-demo-player__pickers{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-12)}.xfam-demo-player__stage{--demo-stage-pad: var(--space-20);position:relative;transition:height var(--duration-travel) var(--ease-travel);overflow:hidden;border-radius:var(--radius-lg);background:var(--stage-ground);box-shadow:0 0 0 1px var(--color-border-faint)}.xfam-demo-player__replay .replayer-wrapper{width:fit-content;border-radius:calc(var(--radius-md) / var(--demo-zoom, 1));box-shadow:0 0 0 calc(1px / var(--demo-zoom, 1)) var(--color-border-faint),0 calc(12px / var(--demo-zoom, 1)) calc(40px / var(--demo-zoom, 1)) #00000024}.xfam-demo-player__replay .replayer-wrapper>iframe{border-radius:inherit}.xfam-demo-player__replay,.xfam-demo-player__ring,.xfam-demo-player__keys.is-live{transition:opacity var(--duration-enter) var(--ease-enter)}.xfam-demo-player__stage:not(.is-ready) .xfam-demo-player__replay{opacity:0}.xfam-demo-player__stage.is-swapping .xfam-demo-player__replay,.xfam-demo-player__stage.is-swapping .xfam-demo-player__ring,.xfam-demo-player__stage.is-swapping .xfam-demo-player__keys.is-live{opacity:0;transition:opacity var(--duration-exit) var(--ease-exit)}.xfam-demo-player__replay.is-arriving{position:absolute;inset:0;opacity:0;pointer-events:none}.xfam-demo-player__replay.is-arriving.is-in{opacity:1;transition:opacity var(--duration-base) var(--ease-smooth)}@starting-style{.xfam-demo-player__ring{opacity:0}}.xfam-demo-player__stage iframe{border:0;display:block}.xfam-demo-player__replay iframe{pointer-events:none}.xfam-demo-player__over{position:absolute;inset:0;z-index:2;display:grid;place-content:center;justify-items:center;gap:var(--space-12);padding:var(--space-24);text-align:center;background:color-mix(in srgb,var(--color-bg) 90%,transparent);animation:xfam-demo-over-in var(--duration-enter) var(--ease-enter)}.xfam-demo-player__over[hidden]{display:none}.xfam-demo-player__over-eyebrow{font-family:var(--font-mono);font-size:var(--text-12);letter-spacing:.2em;text-transform:uppercase;color:var(--color-text-muted)}.xfam-demo-player__over-title{max-width:22ch;font-family:var(--font-serif),serif;font-weight:var(--font-weight-semibold);font-size:clamp(var(--text-24),3.4vw,var(--text-40));line-height:1.1;letter-spacing:-.015em;text-wrap:balance}.xfam-demo-player__over--start,.xfam-demo-player__over--end,.xfam-demo-player__over--fork{background:color-mix(in srgb,var(--color-bg) 70%,transparent);backdrop-filter:blur(8px);-webkit-backdrop-filter:blur(8px)}.xfam-demo-player__over-lede{max-width:46ch;color:var(--color-text-muted);font-size:var(--text-16);line-height:1.45;text-wrap:balance}.xfam-demo-player__over-next{display:grid;justify-items:center;gap:var(--space-4);margin-block-start:var(--space-8)}.xfam-demo-player__over-actions{display:flex;flex-wrap:wrap;justify-content:center;gap:var(--space-8);margin-block-start:var(--space-12)}.xfam-demo-player__over--fork .xfam-demo-player__over-actions{display:grid;grid-template-columns:repeat(2,minmax(0,1fr));width:min(100%,30rem)}.xfam-demo-player__over--fork .xfam-pill-btn{flex-direction:column;justify-content:center;height:auto;gap:var(--space-8);padding:var(--space-16) var(--space-20);border:1px solid var(--color-border);border-radius:var(--radius-lg);background-color:var(--color-bg-card);box-shadow:var(--shadow-card);color:var(--color-text);text-align:center;white-space:normal;transition:transform var(--duration-base) var(--ease-smooth)}.xfam-demo-player__over--fork .xfam-pill-btn i{color:inherit}.xfam-demo-player__over--fork .xfam-btn__label{text-align:center}.xfam-demo-player__over.is-leaving{opacity:0;transition:opacity var(--duration-exit) var(--ease-exit)}.xfam-demo-player__over--end{animation-duration:var(--duration-slower)}@keyframes xfam-demo-over-in{0%{opacity:0}}@media(prefers-reduced-motion:reduce){.xfam-demo-player__over{animation:none}}.xfam-demo-player__paths{margin-inline-start:auto}.xfam-demo-player__paths .xfam-dropdown__section-label{font-family:var(--font-body);font-size:var(--text-13);font-weight:var(--font-weight-bold);letter-spacing:normal;text-transform:none;color:var(--color-text-muted)}.xfam-demo-player__keys{position:absolute;width:1px;height:1px;padding:0;border:0;opacity:0;pointer-events:none}.xfam-demo-player__keys.is-live{opacity:1;pointer-events:auto;margin:0;background:transparent;outline:0;resize:none;overflow:auto;caret-color:currentColor}.xfam-demo-player__ring{position:absolute;margin:0;padding:0;border:2px solid var(--demo-turn);background:transparent;cursor:pointer;animation:xfam-demo-ring-breathe 1.6s var(--ease-smooth) infinite alternate}.xfam-demo-player__ring[hidden]{display:none}.xfam-demo-player__ring.is-through{pointer-events:none}.xfam-demo-player__ring.is-nudge{animation:xfam-demo-ring-nudge var(--duration-spring) var(--ease-spring)}@keyframes xfam-demo-ring-breathe{0%{box-shadow:0 0 color-mix(in srgb,var(--demo-turn) 30%,transparent)}to{box-shadow:0 0 0 6px color-mix(in srgb,var(--demo-turn) 18%,transparent)}}@keyframes xfam-demo-ring-nudge{40%{scale:1.06}}.xfam-demo-player__caption{display:grid;align-content:safe center;justify-items:center;gap:var(--space-6);height:calc(var(--text-12) * 1.4 + var(--space-6) + 3 * 1.3 * var(--text-22));overflow:hidden;text-align:center;transition:height var(--duration-travel) var(--ease-travel),margin var(--duration-travel) var(--ease-travel),opacity var(--duration-enter) var(--ease-enter)}.xfam-demo-player.is-starting .xfam-demo-player__caption,.xfam-demo-player.is-asking .xfam-demo-player__caption,.xfam-demo-player.is-ending .xfam-demo-player__caption,.xfam-demo-player.is-failed .xfam-demo-player__caption{height:0;margin-block-end:calc(-1 * var(--space-12));opacity:0}.xfam-demo-player__count{min-height:1.4em;font-family:var(--font-mono);font-size:var(--text-12);line-height:1.4;letter-spacing:.14em;color:var(--color-text-muted);direction:ltr;unicode-bidi:isolate}.xfam-demo-player__script{width:100%;max-width:44ch;margin:0;font-family:var(--font-body);font-weight:var(--font-weight-semibold);font-size:var(--text-22);line-height:1.3;letter-spacing:-.01em;text-wrap:balance}.xfam-demo-player__script.is-long{max-width:60ch;font-size:var(--text-18)}.xfam-demo-player__secret{margin:var(--space-6) 0 0;font-size:var(--text-14);color:var(--color-warning-text)}.xfam-demo-player__secret[hidden]{display:none}.xfam-demo-player__caption{position:relative}.xfam-demo-player__say{transition:color var(--duration-fast) var(--ease-smooth)}.xfam-demo-player__script.is-leaving{position:absolute;pointer-events:none;animation:xfam-demo-words-out var(--duration-exit) var(--ease-exit) forwards}@keyframes xfam-demo-words-out{to{opacity:0}}.xfam-demo-player__script.is-arriving,.xfam-demo-player__count.is-arriving{animation:xfam-demo-words-in var(--duration-enter) var(--ease-enter) var(--duration-exit) backwards}@keyframes xfam-demo-words-in{0%{opacity:0}}.xfam-demo-player__script.is-voiced .xfam-demo-player__say:not(.is-said){color:color-mix(in srgb,var(--say-ink, var(--color-text)) 32%,transparent)}.xfam-demo-player__script.is-voiced .xfam-demo-player__say:not(.is-said) .xfam-brand-mark__dot{fill-opacity:.32}.xfam-demo-player__say.is-strong,.xfam-demo-player__link{font-weight:var(--font-weight-bolder)}.xfam-demo-player__link{--say-ink: var(--color-accent);color:var(--color-accent);text-decoration:none}.xfam-demo-player__track{position:relative}.xfam-demo-player__line{position:relative;height:20px;cursor:pointer;touch-action:none}.xfam-demo-player__line:focus-visible{outline:var(--xfi-focus-ring) solid var(--color-accent);outline-offset:var(--xfi-focus-offset-loose);border-radius:var(--radius-full)}.xfam-demo-player__chapter{position:absolute;inset-block-start:50%;height:5px;translate:0 -50%;overflow:hidden;border-radius:var(--radius-full);background:color-mix(in srgb,var(--color-text) 14%,transparent);transition:height var(--duration-fast) var(--ease-smooth)}.xfam-demo-player.is-turn-on .xfam-demo-player__chapter.is-turn{background:color-mix(in srgb,var(--demo-turn) 26%,transparent)}.xfam-demo-player__chapter.is-hover{height:9px}.xfam-demo-player__chapter-fill{position:absolute;inset-block:0;inset-inline-start:0;width:0;background:var(--color-accent)}.xfam-demo-player__peek{position:absolute;inset-block-end:calc(100% + var(--float-gap));z-index:3;display:grid;justify-items:center;gap:var(--space-6);max-width:280px;padding:var(--space-6);pointer-events:none}.xfam-demo-player__peek[hidden]{display:none}.xfam-demo-player__peek-screen{position:relative;display:block;overflow:hidden;border-radius:calc(var(--radius-float) - var(--space-6));background:var(--stage-ground)}.xfam-demo-player__peek-screen iframe{border:0;display:block;pointer-events:none}.xfam-demo-player__peek-caption{max-width:260px;padding-inline:var(--space-4);font-size:var(--text-12);line-height:1.35;text-align:center;text-wrap:balance}.xfam-demo-player__peek-caption:empty{display:none}.xfam-demo-player__peek-time,.xfam-demo-player__time{font-family:var(--font-mono);font-variant-numeric:tabular-nums;font-size:var(--text-12);color:var(--color-text-muted);white-space:nowrap;direction:ltr;unicode-bidi:isolate}.xfam-demo-player__time{font-size:var(--text-13)}.xfam-demo-player__controls{display:flex;flex-wrap:wrap;align-items:center;gap:var(--space-12) var(--space-16);min-height:40px;padding-block-end:var(--space-12)}.xfam-demo-player__words{display:inline-grid;justify-items:center}.xfam-demo-player__word{grid-area:1 / 1;opacity:0;visibility:hidden;transition:opacity var(--duration-fast) var(--ease-smooth),visibility var(--duration-fast) var(--ease-smooth)}.xfam-demo-player__word.is-on{opacity:1;visibility:visible}.xfam-demo-player__transport{display:inline-flex;align-items:center;gap:var(--space-4)}.xfam-demo-player__settings-btn{display:none}.xfam-demo-player:fullscreen{max-width:none;overflow:auto;padding-inline:var(--space-24);background:var(--color-bg)}@media(hover:none)and (pointer:coarse){.xfam-demo-keys-btn{display:none}}@media(max-width:767px){.xfam-demo-player__stage{--demo-stage-pad: var(--space-8)}.xfam-demo-player__head{flex-wrap:nowrap;gap:var(--space-8)}.xfam-demo-player__back-words{display:none}.xfam-demo-player__title{flex:1 1 0;font-size:var(--text-16);white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.xfam-demo-player__pickers{flex:none}.xfam-demo-player__device{display:none}.xfam-demo-player__controls{gap:var(--space-8) var(--space-12)}.xfam-demo-player__controls>.xfam-demo-player__time{margin-inline-start:auto}.xfam-demo-player__controls>.xfam-demo-player__turn,.xfam-demo-player__controls>.xfam-demo-player__voice,.xfam-demo-player__controls>.xfam-demo-player__speed,.xfam-demo-player__controls>.xfam-demo-player__full,.xfam-demo-player__controls>.xfam-demo-player__paths{display:none}.xfam-demo-player__controls>.xfam-demo-player__settings-btn{display:inline-flex}.xfam-demo-player__caption{height:calc(var(--text-12) * 1.4 + var(--space-6) + 3 * 1.3 * var(--text-18))}.xfam-demo-player__script{font-size:var(--text-18)}.xfam-demo-player__script.is-long{font-size:var(--text-16)}}@media(prefers-reduced-motion:reduce){.xfam-demo-player__caption,.xfam-demo-player__chapter,.xfam-demo-player__title,.xfam-demo-player__word,.xfam-demo-player__say,.xfam-demo-player__replay,.xfam-demo-player__ring,.xfam-demo-player__keys.is-live,.xfam-demo-player__stage.is-swapping .xfam-demo-player__replay,.xfam-demo-player__stage.is-swapping .xfam-demo-player__ring,.xfam-demo-player__stage.is-swapping .xfam-demo-player__keys.is-live,.xfam-demo-player__replay.is-arriving.is-in{transition:none}.xfam-demo-player__script.is-arriving,.xfam-demo-player__count.is-arriving{animation:none}.xfam-demo-player__script.is-leaving{display:none}.xfam-demo-player__ring,.xfam-demo-player__ring.is-nudge{animation:none}}