.sidebar-container>div>div>div>div{padding:0!important}#storybook-explorer-menu{padding:8px}.sidebar-header{background-color:var(--colour-black);padding-left:16px!important;padding-right:16px;padding-top:8px;padding-bottom:8px;div{max-width:120px;width:auto}}.sidebar-header:after{content:"Design System";color:#fff;font-weight:600;font-size:22px}.sidebar-header button,.sidebar-header img{height:40px;order:1;max-width:120px;width:auto;color:#fff;fill:#fff}.sidebar-header button{order:3;margin-left:auto}:root{--colour-white: #ffffff;--colour-black: #000000;--colour-grey-0: #f1f1f1;--colour-grey-50: #edebec;--colour-grey-100: #e0e0e0;--colour-grey-150: #9ca3af;--colour-grey-200: #cccccc;--colour-grey-300: #999999;--colour-grey-350: #8a8a8a;--colour-grey-400: #666666;--colour-grey-450: #4d4d4d;--colour-grey-500: #333333;--colour-grey-550: #282828;--colour-grey-600: #121212;--colour-red-50: #f8dcdc;--colour-red-300: #ff5667;--colour-red-500: #e60000;--colour-red-600: #c20017;--colour-red-900: #800000;--colour-green-50: #d9f3e5;--colour-green-100: #5de5b5;--colour-green-400: #2f9d6a;--colour-green-600: #008a3a;--colour-green-900: #024f19;--colour-blue-50: #e1f0ff;--colour-blue-100: #9eecff;--colour-blue-400: #0077d6;--colour-blue-500: #0a8acb;--colour-blue-900: #064666;--colour-yellow-50: #fffae5;--colour-yellow-400: #ffd200;--colour-pink: #f45395;--colour-dark-pink: #97054e;--colour-light-pink: #ffa2d0;--colour-teal-50: #d7f3f6;--colour-teal-400: #0098a7;--colour-dark-grey: #333333;--colour-light-grey: #cccccc;--colour-ultra-light-grey: #edebec}:root{--brand-primary: var(--colour-red-500);--brand-secondary: var(--colour-white);--stories-surface: var(--colour-white);--stories-text: var(--colour-black);--surface-default: var(--colour-black);--surface-primary: var(--colour-black);--surface-secondary: var(--colour-grey-0);--surface-default-text: var(--colour-white);--surface-primary-text: var(--colour-white);--surface-secondary-text: var(--colour-black);--surface-primary-active: var(--colour-grey-500);--surface-secondary-active: var(--colour-black);--surface-primary-active-text: var(--colour-white);--surface-secondary-active-text: var(--colour-black);--surface-primary-hover: var(--colour-grey-500);--surface-secondary-hover: var(--colour-grey-50);--surface-primary-hover-text: var(--colour-white);--surface-secondary-hover-text: var(--colour-black);--surface-primary-disabled-text: var(--colour-black);--surface-primary-disabled: var(--colour-grey-200);--surface-secondary-disabled-text: var(--colour-grey-300);--surface-secondary-disabled: var(--colour-grey-200);--surface-tertiary-disabled-text: var(--colour-grey-300);--border-default: var(--colour-grey-300);--border-primary: var(--colour-black);--border-primary-disabled: var(--colour-grey-300);--border-secondary-disabled: var(--colour-grey-300);--focus-primary-outline: var(--colour-black);--status-success: var(--colour-green-600);--status-success-bg: var(--colour-green-50);--status-warning: var(--colour-yellow-400);--status-warning-bg: var(--colour-yellow-50);--status-information: var(--colour-yellow-400);--status-information-bg: var(--colour-yellow-50);--status-error: var(--colour-yellow-600);--status-error-bg: var(--colour-yellow-50);--status-offline: var(--colour-yellow-400);--status-offline-bg: var(--colour-yellow-50);--status-fastest: var(--colour-teal-400);--status-fastest-bg: var(--colour-teal-50)}:root{--elevation-lg: 0 10px 15px -3px rgb(0 0 0 / .1), 0 4px 6px -4px rgb(0 0 0 / .1)}:root{--spacing-0: 0rem;--spacing-25: 1px;--spacing-50: 2px;--spacing-100: .25rem;--spacing-150: 6px;--spacing-200: .5rem;--spacing-250: 10px;--spacing-300: .75rem;--spacing-400: 1rem;--spacing-450: 1.25rem;--spacing-500: 1.5rem;--spacing-550: 1.75rem;--spacing-600: 2rem;--spacing-650: 2.25rem;--spacing-700: 2.5rem;--spacing-750: 2.75rem;--spacing-800: 3rem;--spacing-825: 4rem;--spacing-850: 5rem;--spacing-875: 6rem;--spacing-900: 7rem;--spacing-925: 8rem;--spacing-950: 9rem;--spacing-975: 10rem;--spacing-1000: 11rem}:root{--space-component-gap: var(--spacing-450);--space-component-gap-lg: var(--spacing-600);--space-component-gap-xl: var(--spacing-800);--space-content-gap: var(--spacing-300);--space-content-gap-sm: var(--spacing-200);--space-content-gap-lg: var(--spacing-550);--space-content-gap-xl: var(--spacing-700);--space-content-gap-1xl: var(--spacing-900);--space-block: var(--spacing-500)}:root{--Tfw-sans: "TfW Sans", "Wales Sans Body", sans-serif}:root{--font-size-h1: 32px;--font-size-h2: 28px;--font-size-h3: 24px;--font-size-h4: 20px;--font-size-h5: 18px;--font-size-h6: 16px;--font-size-body: 1rem;--font-size-small: .875rem;--font-size-xsm: .75rem}@media(min-width:992px){:root{--font-size-h1: 48px;--font-size-h2: 40px;--font-size-h3: 32px;--font-size-h4: 24px;--font-size-h5: 20px;--font-size-h6: 16px}}:root{--weight-regular: 400;--weight-medium: 500;--weight-bold: 700}:root{--text-meta: var(--font-size-small)}:root{--base-tfw: "Wales Sans Body", sans-serif}:root{--radius-xs: 2px;--radius-sm: 4px;--radius-m: 8px;--radius-l: 10px;--radius-xl: 24px;--radius-xxl: 40px;--radius-full: 999px}:root{--radius-chip: var(--radius-m);--radius-card: var(--radius-m);--radius-image: var(--radius-l)}:root{--overlay-0: linear-gradient( 180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, 0) 100% );--overlay-100: linear-gradient( 180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .1) 100% );--overlay-200: linear-gradient( 180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .2) 100% );--overlay-300: linear-gradient( 180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .3) 100% );--overlay-400: linear-gradient( 180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .4) 100% );--overlay-500: linear-gradient( 180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .5) 100% );--overlay-600: linear-gradient( 180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .6) 100% );--overlay-700: linear-gradient( 180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .7) 100% );--overlay-800: linear-gradient( 180deg, rgba(0, 0, 0, 0) 0%, rgba(0, 0, 0, 0) 45%, rgba(0, 0, 0, .8) 100% );--overlay-900: linear-gradient( 180deg, rgba(0, 0, 0, .1) 0%, rgba(0, 0, 0, .3) 45%, rgba(0, 0, 0, .9) 100% )}:root{--overlay-light: var(--overlay-300);--overlay-medium: var(--overlay-600);--overlay-strong: var(--overlay-800)}.grid{display:grid;gap:8px;row-gap:40px}.grid--3{grid-template-columns:repeat(3,1fr)}@media(max-width:835px){.grid{grid-template-columns:repeat(2,1fr)}}@media(max-width:768px){.grid{grid-template-columns:1fr}}
