.hero-demo.svelte-x33fhy{margin:2.4rem auto 0;width:100%;max-width:var(--hero-demo-max-width, min(26rem, 100%));container-type:inline-size}.hero-demo.with-notation-strip.svelte-x33fhy{margin-top:1.8rem}.demo-figure.svelte-x33fhy{margin:0}.demo-media.svelte-x33fhy{width:100%}.stage-shell.svelte-x33fhy{min-width:0;container-type:inline-size}.demo-stage.svelte-x33fhy{position:relative;box-sizing:border-box;aspect-ratio:1;border-radius:18px;overflow:hidden;background:#0a0d1573;border:1px solid oklch(.4 .04 270 / .14);backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.demo-load-error.svelte-x33fhy{position:absolute;inset:0;z-index:2;display:grid;place-content:center;justify-items:center;gap:.85rem;padding:1.5rem;color:#d9deec;text-align:center;background:#05070eeb}.demo-pending.svelte-x33fhy{position:absolute;inset:0;display:grid;place-content:center;justify-items:center;gap:.8rem;color:#949eb8;font-size:var(--font-size-min, .875rem)}.demo-pending.svelte-x33fhy i:where(.svelte-x33fhy){color:#a9a6fa;font-size:1.25rem}.demo-load-error.svelte-x33fhy button:where(.svelte-x33fhy){min-height:44px;padding:0 1rem;font:inherit;font-weight:650;color:#e6ebf9;cursor:pointer;border:1px solid oklch(.62 .1 270 / .55);border-radius:10px;background:#2d3a6780}.demo-stage.rail-attached.svelte-x33fhy{border-bottom:0;border-radius:18px 18px 0 0}.demo-stage.word-header-attached.svelte-x33fhy{aspect-ratio:auto;height:calc(100cqi + clamp(12px,6cqi,28px) + clamp(6px,3cqi,12px) + clamp(6px,3cqi,12px) + 1px)}.word-header-attached.svelte-x33fhy .word-text{line-height:1}.notation-strip.svelte-x33fhy{height:4.125rem;overflow:hidden;border:1px solid oklch(.4 .04 270 / .14);border-top:0;border-radius:0 0 18px 18px;background:#05070e94;backdrop-filter:blur(14px);-webkit-backdrop-filter:blur(14px)}.notation-load-error.svelte-x33fhy{display:flex;align-items:center;justify-content:center;gap:.75rem;height:100%;padding-inline:.75rem;color:#bac3df;font-size:var(--font-size-min, .875rem)}.notation-placeholder.svelte-x33fhy{width:100%;height:100%;background:linear-gradient(90deg,transparent,oklch(.72 .04 270 / .08),transparent);background-size:200% 100%;animation:svelte-x33fhy-notation-placeholder-pulse 1.8s ease-in-out infinite}@keyframes svelte-x33fhy-notation-placeholder-pulse{0%{background-position:100% 0}to{background-position:-100% 0}}.notation-load-error.svelte-x33fhy button:where(.svelte-x33fhy){min-height:44px;padding-inline:.8rem;color:#e6ebf9;font:inherit;font-weight:650;cursor:pointer;border:1px solid oklch(.62 .1 270 / .55);border-radius:9px;background:#2d3a6780}figcaption.svelte-x33fhy{display:flex;align-items:baseline;justify-content:center;gap:.55rem;margin-top:.8rem;font-size:clamp(.85rem,.8rem + .12vw,1rem);color:#7b808d}.demo-word.svelte-x33fhy{font-size:clamp(1.05rem,1rem + .15vw,1.25rem);color:#d0d7ec}.demo-note.svelte-x33fhy{font-style:italic}figcaption.pending.svelte-x33fhy{visibility:hidden}figcaption.notation-caption.svelte-x33fhy{position:absolute;width:1px;height:1px;padding:0;margin:-1px;overflow:hidden;clip:rect(0,0,0,0);clip-path:inset(50%);white-space:nowrap;border:0}.reroll-row.svelte-x33fhy{display:flex;justify-content:center;margin-top:1rem}.with-notation-strip.svelte-x33fhy .reroll-row:where(.svelte-x33fhy){margin-top:.85rem}.reroll-button.svelte-x33fhy{display:inline-flex;align-items:center;gap:.55rem;min-height:44px;padding:0 1.4rem;font-size:clamp(.95rem,.9rem + .12vw,1.08rem);font-weight:650;font-family:inherit;color:#dadee8;border:1px solid oklch(.5 .06 270 / .3);border-radius:12px;background:#262d422e;cursor:pointer;transition:transform .16s ease,border-color .16s ease,background .16s ease,opacity .16s ease}.reroll-button.svelte-x33fhy:hover:not(:disabled){transform:translateY(-2px);background:#2e375242;border-color:#6d7eb180}.reroll-button.svelte-x33fhy:disabled{opacity:.6;cursor:default}.reroll-error.svelte-x33fhy{margin:.55rem 0 0;color:#dc8c85;font-size:var(--font-size-min, .875rem);text-align:center}@media(width>=105rem)and (height>=56.25rem){.hero-demo.svelte-x33fhy{max-width:var(--hero-demo-wide-max-width, min(60vh, 78rem))}.notation-strip.svelte-x33fhy{height:4.6875rem}.reroll-button.svelte-x33fhy{min-height:3.25rem;padding:0 1.8rem}}@media(min-width:601px)and (width<105rem){.notation-strip.svelte-x33fhy{height:4.375rem}}@media(width>=42rem)and (width<105rem)and (height>=500px)and (height<44rem){.with-notation-strip.svelte-x33fhy .notation-strip:where(.svelte-x33fhy){display:none}.with-notation-strip.svelte-x33fhy .demo-stage.rail-attached:where(.svelte-x33fhy){border-bottom:1px solid oklch(.4 .04 270 / .14);border-radius:18px}.with-notation-strip.svelte-x33fhy .reroll-row:where(.svelte-x33fhy){margin-top:.35rem}.with-notation-strip.svelte-x33fhy .reroll-button:where(.svelte-x33fhy){padding-inline:.9rem;font-size:.875rem}}@media(height<500px),(width>=105rem)and (height<64rem){.with-notation-strip.svelte-x33fhy .notation-strip:where(.svelte-x33fhy){display:none}.with-notation-strip.svelte-x33fhy .demo-stage.rail-attached:where(.svelte-x33fhy){border-bottom:1px solid oklch(.4 .04 270 / .14);border-radius:18px}.with-notation-strip.svelte-x33fhy .reroll-row:where(.svelte-x33fhy){margin-top:.25rem}.with-notation-strip.svelte-x33fhy .reroll-button:where(.svelte-x33fhy){padding-inline:.75rem;font-size:var(--font-size-min, .875rem)}}@media(width<42rem)and (height>=500px){.with-notation-strip.svelte-x33fhy .demo-media:where(.svelte-x33fhy){display:grid;grid-template-columns:minmax(0,1fr) 5.25rem;align-items:stretch;gap:.5rem}.with-notation-strip.svelte-x33fhy .demo-stage.rail-attached:where(.svelte-x33fhy){border-bottom:1px solid oklch(.4 .04 270 / .14);border-radius:18px}.with-notation-strip.svelte-x33fhy .notation-strip:where(.svelte-x33fhy){height:auto;border-top:1px solid oklch(.4 .04 270 / .14);border-radius:18px}.with-notation-strip.svelte-x33fhy .reroll-row:where(.svelte-x33fhy){margin-top:.35rem}.with-notation-strip.svelte-x33fhy .reroll-button:where(.svelte-x33fhy){padding-inline:.9rem;font-size:var(--font-size-min, .875rem)}}@media(prefers-reduced-motion:reduce){.notation-placeholder.svelte-x33fhy{animation:none}.reroll-button.svelte-x33fhy{transition:none}.reroll-button.svelte-x33fhy:hover:not(:disabled){transform:none}.reroll-button.svelte-x33fhy .fa-spin{animation:none!important}}