Ordinarily, a page inherits every layout above it, meaning that src/routes/a/b/c/+page.svelte inherits four layouts:

• src/routes/+layout.svelte
• src/routes/a/+layout.svelte
• src/routes/a/b/+layout.svelte
• src/routes/a/b/c/+layout.svelte

Occasionally, it’s useful to break out of the current layout hierarchy. We can do that by adding the @ sign followed by the name of the parent segment to ‘reset’ to — for example +page@b.svelte would put /a/b/c inside src/routes/a/b/+layout.svelte, while +page@a.svelte would put it inside src/routes/a/+layout.svelte.

Let’s reset it all the way to the root layout, by renaming it to +page@.svelte.

The root layout applies to every page of your app, you cannot break out of it.