import{S as X,i as Z,s as ee,c as u,m as f,t as h,a as $,d,o as k,h as g,k as b,q as T,f as v,n as I,l as C,j as F}from"./index-C9aKRT5A.js";import{g as te,a as ne}from"./spread-CgU5AtxT.js";import{p as ae,M as le,T as ie,S as P,a as A,w as me}from"./collect-stories-ceFdpR5E.js";import{A as ce}from"./Article-CRhGnXa0.js";import{H as se}from"./Headline-B2xktHpB.js";import{B as W}from"./BodyText-DOLlE-fm.js";import{G as pe}from"./GraphicBlock-Dy6mUqc4.js";import{S as ue}from"./SiteHeader-BUoMF9WI.js";import{T as w,t as x}from"./Theme-D2CRvq-y.js";import"./Block-C7biTRWl.js";import"./Byline-CgwnbxHA.js";import"./each-D6YF6ztN.js";import"./_commonjsHelpers-BosuxZz1.js";import"./journalize-K6hK94UL.js";import"./Markdown-BNYiGaXJ.js";import"./PaddingReset-CiOBBFtT.js";import"./ReutersLogo-CDQ5t4Ty.js";import"./index-TQx7jkZs.js";import"./time-Dt9E6jI9.js";import"./advancedFormat-D5cdT3Ux.js";import"./dayjs.min-BIwLhz4I.js";import"./flatten-9xFT-BQ8.js";const fe=`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