:root, [data-site-library-family='shadcn']:not([data-projection-family='brutalist']), [data-projection-family='shadcn'] { --site-startup-code-frame-border-radius: var(--pui-radius-xl); --site-startup-code-frame-border-width: 1px; --site-startup-code-frame-border-style: solid; --site-startup-code-frame-border-color: var(--pui-border); --site-startup-code-frame-background-color: var(--pui-muted); --site-startup-code-frame-color: var(--pui-foreground); }
[data-site-code-surface='frame']::before { border-radius: var(--site-startup-code-frame-border-radius); border-width: var(--site-startup-code-frame-border-width); border-style: var(--site-startup-code-frame-border-style); border-color: var(--site-startup-code-frame-border-color); background-color: var(--site-startup-code-frame-background-color); color: var(--site-startup-code-frame-color); }
:root, [data-site-library-family='shadcn']:not([data-projection-family='brutalist']), [data-projection-family='shadcn'] { --site-startup-code-toolbar-border-radius: 0; --site-startup-code-toolbar-border-bottom-width: 1px; --site-startup-code-toolbar-border-bottom-style: solid; --site-startup-code-toolbar-border-color: var(--pui-border); --site-startup-code-toolbar-background-color: transparent; --site-startup-code-toolbar-color: var(--pui-foreground); }
[data-site-code-surface='toolbar']::before { border-radius: var(--site-startup-code-toolbar-border-radius); border-bottom-width: var(--site-startup-code-toolbar-border-bottom-width); border-bottom-style: var(--site-startup-code-toolbar-border-bottom-style); border-color: var(--site-startup-code-toolbar-border-color); background-color: var(--site-startup-code-toolbar-background-color); color: var(--site-startup-code-toolbar-color); }
[data-site-library-family='brutalist']:not([data-projection-family='shadcn']), [data-projection-family='brutalist'], .brutalist-demo-frame:not([data-projection-family='shadcn']):not([data-site-library-family='shadcn']) { --site-startup-code-frame-border-radius: var(--site-brutalist-radius); --site-startup-code-frame-border-width: 2px; --site-startup-code-frame-border-style: solid; --site-startup-code-frame-border-color: #000; --site-startup-code-frame-background-color: var(--site-brutalist-background); --site-startup-code-frame-color: var(--site-brutalist-foreground); }
[data-site-code-surface='frame']::before { border-radius: var(--site-startup-code-frame-border-radius); border-width: var(--site-startup-code-frame-border-width); border-style: var(--site-startup-code-frame-border-style); border-color: var(--site-startup-code-frame-border-color); background-color: var(--site-startup-code-frame-background-color); color: var(--site-startup-code-frame-color); }
[data-site-library-family='brutalist']:not([data-projection-family='shadcn']), [data-projection-family='brutalist'], .brutalist-demo-frame:not([data-projection-family='shadcn']):not([data-site-library-family='shadcn']) { --site-startup-code-toolbar-border-radius: 0; --site-startup-code-toolbar-border-bottom-width: 2px; --site-startup-code-toolbar-border-bottom-style: solid; --site-startup-code-toolbar-border-color: #000; --site-startup-code-toolbar-background-color: transparent; --site-startup-code-toolbar-color: var(--site-brutalist-foreground); }
[data-site-code-surface='toolbar']::before { border-radius: var(--site-startup-code-toolbar-border-radius); border-bottom-width: var(--site-startup-code-toolbar-border-bottom-width); border-bottom-style: var(--site-startup-code-toolbar-border-bottom-style); border-color: var(--site-startup-code-toolbar-border-color); background-color: var(--site-startup-code-toolbar-background-color); color: var(--site-startup-code-toolbar-color); }