.align.svelte-ljbkov{border-radius:var(--radius-surface);background:var(--raised);flex-direction:column;gap:20px;padding:24px 28px 28px;display:flex}.top.svelte-ljbkov{flex-wrap:wrap;align-items:center;gap:14px;display:flex}.title.svelte-ljbkov{flex-direction:column;gap:2px;margin-inline-end:auto;display:flex}.play.svelte-ljbkov{background:var(--brand);width:44px;height:44px;color:var(--on-brand);cursor:pointer;border:0;border-radius:999px;flex:none;place-items:center;display:grid}.play.svelte-ljbkov:hover{background:var(--brand-hover)}.ayah-nav.svelte-ljbkov{border-radius:var(--radius-control);background:var(--surface);gap:2px;padding:3px;display:flex}.ayah-nav.svelte-ljbkov button:where(.svelte-ljbkov){width:34px;height:34px;color:var(--ink-muted);cursor:pointer;background:0 0;border:0;border-radius:7px;font-size:13px;font-weight:500}.ayah-nav.svelte-ljbkov button.on:where(.svelte-ljbkov){background:var(--raised);color:var(--ink);box-shadow:0 1px 2px var(--shadow-soft);font-weight:600}.scroller.svelte-ljbkov{overscroll-behavior-x:contain;scrollbar-width:thin;padding-bottom:4px;overflow-x:auto}.grid.svelte-ljbkov{min-width:max(100%, calc(var(--span) * 110px));padding-inline-end:44px;padding-top:2px;position:relative}.axis.svelte-ljbkov{grid-template-columns:1fr;gap:6px;display:grid;position:relative}.tier-label.svelte-ljbkov{text-align:end;direction:ltr}.tier.svelte-ljbkov{position:relative}.words.svelte-ljbkov{height:92px}.phones.svelte-ljbkov{height:44px}.word.svelte-ljbkov,.ph.svelte-ljbkov{position:absolute;top:0;bottom:0}.word.svelte-ljbkov{border:0;border-inline-start:1px solid var(--raised);border-radius:var(--radius-word);background:var(--surface);cursor:pointer;min-width:0;transition:background-color var(--dur-instant) var(--ease-out);flex-direction:column;justify-content:center;align-items:center;gap:2px;padding:0 4px;display:flex;overflow:hidden}.word.svelte-ljbkov:hover{background:var(--surface-hover)}.word.on.svelte-ljbkov{background:var(--state-reading)}.w.svelte-ljbkov{white-space:nowrap;font-size:clamp(20px,2.1vw,30px);line-height:1.7}.dur.svelte-ljbkov{color:var(--ink-muted);direction:ltr;font-size:11px}.ph.svelte-ljbkov{border-inline-start:2px solid var(--raised);background:var(--surface);border-radius:6px;place-items:center;display:grid;overflow:hidden}.ph.rule.svelte-ljbkov{background:var(--brand-tint)}.ph.rule.svelte-ljbkov .ar:where(.svelte-ljbkov){color:var(--brand)}.ph.on.svelte-ljbkov{background:var(--brand)}.ph.on.svelte-ljbkov .ar:where(.svelte-ljbkov){color:var(--on-brand)}.ph.svelte-ljbkov .ar:where(.svelte-ljbkov){white-space:nowrap;font-size:17px;line-height:1}.ruler.svelte-ljbkov{border-top:1px solid var(--line-strong);height:22px;margin-top:2px;position:relative}.ruler.svelte-ljbkov span:where(.svelte-ljbkov){background:var(--line-strong);width:1px;height:6px;position:absolute;top:0}.ruler.svelte-ljbkov em:where(.svelte-ljbkov){color:var(--ink-muted);direction:ltr;font-size:11px;font-style:normal;position:absolute;top:7px;transform:translate(50%)}.ruler.svelte-ljbkov span:where(.svelte-ljbkov):first-child em:where(.svelte-ljbkov){transform:translate(-100%)}.head.svelte-ljbkov{background:var(--brand);pointer-events:none;border-radius:1px;width:2px;margin-inline-start:-1px;position:absolute;top:18px;bottom:22px}.end.svelte-ljbkov{inset-inline-end:0;font-size:26px;position:absolute;top:34px}@media (width<=599px){.align.svelte-ljbkov{gap:16px;padding:16px 14px 18px}.top.svelte-ljbkov{gap:10px}.ayah-nav.svelte-ljbkov{justify-content:space-between;width:100%}.ayah-nav.svelte-ljbkov button:where(.svelte-ljbkov){flex:1;width:auto;height:44px}.w.svelte-ljbkov{font-size:21px;line-height:1.5}.tier-label.svelte-ljbkov{display:none}.words.svelte-ljbkov{height:68px}.phones.svelte-ljbkov{height:38px}.grid.svelte-ljbkov{padding-inline-end:0}.end.svelte-ljbkov{display:none}.align.svelte-ljbkov .notice{padding:12px}.align.svelte-ljbkov .notice .keys li{height:26px;font-size:12px}}@media (prefers-reduced-motion:reduce){.word.svelte-ljbkov{transition:none}}