import{S as X,i as Z,s as ee,g as u,m as p,t as h,h as $,j as d,y as v,d as g,f as b,l as k,b as w,n as I,C,e as F}from"./index-99a30af8.js";import{g as te,a as ne}from"./spread-8a54911c.js";import{p as ae,M as le,T as me,S as P}from"./collect-stories-1e0d20c7.js";import{A as ie}from"./Article-cb12a248.js";import{H as se}from"./Headline-3eded5d7.js";import{B as W}from"./BodyText-b6660f02.js";import{G as ce}from"./GraphicBlock-caaf4041.js";import{S as fe}from"./SiteHeader-5eb355f9.js";import{T,t as x}from"./Theme-03c0bd40.js";import{b as A,w as ue}from"./withParams-47e2ab71.js";import"./Block-a09d61d3.js";import"./Byline-1358d74f.js";import"./each-e59479a4.js";import"./_commonjsHelpers-de833af9.js";import"./journalize-07958dc6.js";import"./Markdown-2a6fc77f.js";import"./PaddingReset-79b11107.js";import"./ReutersLogo-b424df32.js";import"./index-2224dbf5.js";import"./time-8562ae1b.js";import"./advancedFormat-ebff0a45.js";import"./dayjs.min-1b995edc.js";import"./light-fcb352a5.js";const pe=`The \`Theme\` component wraps your page content and uses [CSS variables](../?path=/docs/scss-css-variables--page) to set major colour and typography styles for your page. All of the components in this library will use those CSS variables for styling by default. Use our [theme builder](../?path=/docs/theming-theme-builder--docs) to customise your page's theme. \`\`\`svelte