rimecms 1.0.1 → 1.1.0

package/dist/panel/components/sections/live/LiveFloatingUI.svelte

@@ -87,7 +87,7 @@
   </Button>
 </div>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 
@@ -112,7 +112,7 @@
     background-color: var(--rz-bg-float);
     box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-float);
+    var(--rz-shadow-float, 0 0 transparent);
     padding: var(--rz-size-2);
     border-radius: var(--rz-radius-md);
     z-index: 1000;

package/dist/panel/components/ui/breadcrumb/BreadCrumb.svelte

@@ -23,7 +23,7 @@
   {/each}
 </nav>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/components/ui/button/button.svelte

@@ -61,7 +61,7 @@
   </button>
 {/if}
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 
@@ -203,9 +203,8 @@
 
   /** Default */
   .rz-button--default {
-    background: var(--rz-gradient-primary);
+    background-color: var(--rz-bg-inverse);
     color: var(--rz-fg-inverse);
-    box-shadow: var(--rz-shadow-primary);
     &:hover:not(:disabled) {
       filter: brightness(1.12);
     }
@@ -256,7 +255,7 @@
     background-color: var(--rz-bg-raised);
     box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-raised);
+    var(--rz-shadow-raised, 0 0 transparent);
     background-color: var(--rz-button-secondary-bg);
     color: var(--rz-button-secondary-fg);
 

package/dist/panel/components/ui/card/card.svelte

@@ -16,7 +16,7 @@
   {@render children?.()}
 </div>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 
@@ -39,7 +39,7 @@
     background-color: var(--rz-bg-raised);
     box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-raised);
+    var(--rz-shadow-raised, 0 0 transparent);
     background-color: var(--rz-card-color-bg);
     border-radius: var(--rz-radius-lg);
   }

package/dist/panel/components/ui/card-document/card-document.svelte

@@ -37,7 +37,7 @@
   </div>
 </div>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 
@@ -58,7 +58,7 @@
     background-color: var(--rz-bg-raised);
     box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-raised);
+    var(--rz-shadow-raised, 0 0 transparent);
     border-radius: var(--rz-radius-lg);
     aspect-ratio: 4 / 5;
     width: 100%;

package/dist/panel/components/ui/card-resource/card-resource.svelte

@@ -55,7 +55,7 @@
   </button>
 </div>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 
@@ -82,7 +82,7 @@
     background-color: var(--rz-bg-raised);
     box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-raised);
+    var(--rz-shadow-raised, 0 0 transparent);
     background-color: var(--rz-ressource-card-bg);
     position: relative;
     display: flex;

package/dist/panel/components/ui/command/command-input.svelte

@@ -26,7 +26,7 @@
   {@render end?.()}
 </div>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/components/ui/context-menu/context-menu.css

@@ -3,7 +3,7 @@
   background-color: var(--rz-bg-float);
   box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-float);
+    var(--rz-shadow-float, 0 0 transparent);
   outline: none;
   /* Over the sidebar (300) and a dialog (1010), which a menu can open from. */
   z-index: 1100;

package/dist/panel/components/ui/dialog/dialog-content.css

@@ -3,7 +3,7 @@
   background-color: var(--rz-bg-float);
   box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-float);
+    var(--rz-shadow-float, 0 0 transparent);
   position: fixed;
   left: calc(50% - var(--gutter));
   top: 40%;

package/dist/panel/components/ui/dropdown-menu/dropdown-menu-checkbox-item.svelte

@@ -35,7 +35,7 @@
   {/snippet}
 </DropdownMenuPrimitive.CheckboxItem>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/components/ui/dropdown-menu/dropdown-menu-content.css

@@ -2,7 +2,7 @@
   background-color: var(--rz-bg-float);
   box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-float);
+    var(--rz-shadow-float, 0 0 transparent);
   /* Over the sidebar (300) and a dialog (1010), which a menu can open from. */
   z-index: 1100;
   min-width: var(--min-width, 8rem);

package/dist/panel/components/ui/input/input.svelte

@@ -25,7 +25,7 @@
   <input bind:this={ref} class="rz-input" bind:value {...restProps} />
 </div>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/components/ui/nav/Nav.svelte

@@ -95,7 +95,7 @@
   <UserButton navCollapsed={isCollapsed} />
 </aside>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 
@@ -174,9 +174,8 @@
     border-radius: var(--rz-radius-sm);
     font-size: var(--rz-text-xs);
     text-transform: uppercase;
-    background: var(--rz-gradient-primary);
+    background-color: var(--rz-bg-inverse);
     color: var(--rz-fg-inverse);
-    box-shadow: var(--rz-shadow-primary);
   }
 
   .rz-nav__brand-name {

package/dist/panel/components/ui/nav/NavGroup.svelte

@@ -45,7 +45,7 @@
   </div>
 </div>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/components/ui/nav/NavItemButton.svelte

@@ -24,7 +24,7 @@
   {/if}
 </a>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/components/ui/nav/UserButton.svelte

@@ -75,7 +75,7 @@
   </DropdownMenu.Portal>
 </DropdownMenu.Root>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/components/ui/page-header/PageHeader.svelte

@@ -76,7 +76,7 @@
   {/if}
 {/if}
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/components/ui/popover/popover-content.css

@@ -5,6 +5,6 @@
   background-color: var(--rz-bg-float);
   box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-float);
+    var(--rz-shadow-float, 0 0 transparent);
   outline: none;
 }

package/dist/panel/components/ui/radio-row-group/radio-row-group.css

@@ -43,6 +43,5 @@
 
 .rz-radio-row-group-item[data-state='checked'] {
   background-color: var(--rz-bg-knob);
-  box-shadow: var(--rz-shadow-knob);
   color: var(--rz-fg);
 }

package/dist/panel/components/ui/sheet/sheet.css

@@ -10,7 +10,7 @@
   background-color: var(--rz-bg-float);
   box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-float);
+    var(--rz-shadow-float, 0 0 transparent);
   padding: var(--rz-size-6);
   overflow-y: auto;
 

package/dist/panel/components/ui/sonner/sonner.css

@@ -2,7 +2,7 @@
   background-color: var(--rz-bg-float);
   box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-float);
+    var(--rz-shadow-float, 0 0 transparent);
   border: 0;
   color: var(--rz-fg);
 

package/dist/panel/components/ui/switch/switch.css

@@ -13,7 +13,6 @@
   align-items: center;
   border-radius: var(--rz-radius-full);
   border: 2px solid transparent;
-  box-shadow: var(--rz-shadow-raised);
   transition: all 0.1s ease;
   outline: none;
 }
@@ -47,7 +46,6 @@
   display: block;
   transition: translate 0.25s ease;
   border-radius: var(--rz-radius-full);
-  box-shadow: var(--rz-shadow-knob);
   background-color: var(--rz-switch-color-thumb);
 }
 

package/dist/panel/components/ui/tabs/tabs.css

@@ -16,6 +16,7 @@
   color: var(--rz-fg-muted);
   font-variation-settings: 'wght' 380;
   font-weight: 380;
+  border: 1px solid transparent;
 }
 
 .rz-tabs-trigger:hover {
@@ -37,7 +38,7 @@
 
 .rz-tabs-trigger[data-state='active'] {
   background-color: var(--rz-bg-knob);
-  box-shadow: var(--rz-shadow-knob);
+  border: 1px solid var(--rz-border);
   position: relative;
   font-variation-settings: 'wght' 450;
   font-weight: 450;

package/dist/panel/components/ui/tag/tag.svelte

@@ -20,7 +20,7 @@
   </button>
 </div>
 
-<style global>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style global>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/components/ui/tree/tree-rows.css

@@ -21,7 +21,7 @@
   background-color: var(--rz-bg-raised);
   box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-raised);
+    var(--rz-shadow-raised, 0 0 transparent);
   border-radius: var(--rz-radius-xl);
   overflow: hidden;
 
@@ -31,8 +31,8 @@
   }
 }
 
-/* Inside a group, a block, a tree item or a stage card: a hairline, no second fill. */
-:is(.rz-group-field__content, .rz-block__fields, .rz-tree-item__fields, .rz-stage__fields)
+/* Inside a group, a block, a tree item or the inspector: a hairline, no second fill. */
+:is(.rz-group-field__content, .rz-block__fields, .rz-tree-item__fields, .rz-inspector__fields)
   .rz-tree-card:not([data-empty]) {
   background-color: transparent;
   box-shadow: 0 0 0 1px var(--rz-border);

package/dist/panel/index.d.ts

@@ -5,6 +5,7 @@ import type { Snippet } from 'svelte';
 import { Field } from './components/fields/index.js';
 import RelationInline from '../fields/relation/component/RelationInline.svelte';
 import RichTextInline from '../fields/rich-text/component/RichTextInline.svelte';
+import TextInline from '../fields/text/component/TextInline.svelte';
 import RenderFields from './components/fields/RenderFields.svelte';
 import Panel from './components/Root.svelte';
 import Doc from './components/sections/document/Document.svelte';
@@ -19,7 +20,7 @@ import Live from './pages/live/Live.svelte';
 import type { Route } from './types.js';
 import { populate } from '../fields/relation/populate.js';
 import { useCommands } from './context/commands.svelte.js';
-export { Area, Button, Collection, CollectionDoc, Dashboard, Doc, Field, Input, Live, Panel, RelationInline, RenderFields, RichTextInline, SpinLoader, populate, useCommands };
+export { Area, Button, Collection, CollectionDoc, Dashboard, Doc, Field, Input, Live, Panel, RelationInline, RenderFields, RichTextInline, TextInline, SpinLoader, populate, useCommands };
 export declare const CONTEXT: {
     COLLECTION: symbol;
     LIVE: symbol;

package/dist/panel/index.js

@@ -1,6 +1,7 @@
 import { Field } from './components/fields/index.js';
 import RelationInline from '../fields/relation/component/RelationInline.svelte';
 import RichTextInline from '../fields/rich-text/component/RichTextInline.svelte';
+import TextInline from '../fields/text/component/TextInline.svelte';
 import RenderFields from './components/fields/RenderFields.svelte';
 import Panel from './components/Root.svelte';
 import Doc from './components/sections/document/Document.svelte';
@@ -22,7 +23,7 @@ import { populate } from '../fields/relation/populate.js';
 import { useCommands } from './context/commands.svelte.js';
 export { 
 // Components
-Area, Button, Collection, CollectionDoc, Dashboard, Doc, Field, Input, Live, Panel, RelationInline, RenderFields, RichTextInline, SpinLoader, 
+Area, Button, Collection, CollectionDoc, Dashboard, Doc, Field, Input, Live, Panel, RelationInline, RenderFields, RichTextInline, TextInline, SpinLoader, 
 // A block render's relations, resolved as the API answers them
 populate, 
 // The commands a component offers while mounted: palette lines, keys

package/dist/panel/pages/auth/forgot-password/ForgotPassword.svelte

@@ -52,7 +52,7 @@
   {/if}
 </AuthForm>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/pages/dashboard/Dashboard.svelte

@@ -125,7 +125,7 @@
   {/snippet}
 </Page>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/pages/dashboard/DashboardCard.svelte

@@ -38,7 +38,7 @@
   {@render children()}
 </section>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 
@@ -58,7 +58,7 @@
     background-color: var(--rz-bg-raised);
     box-shadow:
     0 0 0 1px var(--rz-border),
-    var(--rz-shadow-raised);
+    var(--rz-shadow-raised, 0 0 transparent);
     border-radius: var(--rz-radius-lg);
     overflow: hidden;
   }

package/dist/panel/pages/dashboard/DashboardCollection.svelte

@@ -125,7 +125,7 @@
   <BulkUploadDialog target={uploadTarget} bind:open={uploadOpen} />
 {/if}
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/pages/dashboard/DashboardRow.svelte

@@ -33,7 +33,7 @@
   </a>
 </li>
 
-<style>/* A level: its fill, a hairline, its shadow. raised, float. */
+<style>/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/style/index.css

@@ -524,9 +524,9 @@ video {
   --rz-gray-14: oklch(0.865 var(--rz-gray-chroma) var(--rz-gray-hue));
   --rz-gray-15: oklch(0.905 var(--rz-gray-chroma) var(--rz-gray-hue));
   --rz-gray-16: oklch(0.94 var(--rz-gray-chroma) var(--rz-gray-hue));
-  --rz-gray-17: oklch(0.965 var(--rz-gray-chroma) var(--rz-gray-hue));
-  --rz-gray-18: oklch(0.982 var(--rz-gray-chroma) var(--rz-gray-hue));
-  --rz-gray-19: oklch(0.996 var(--rz-gray-chroma) var(--rz-gray-hue));
+  --rz-gray-17: oklch(0.968 var(--rz-gray-chroma) var(--rz-gray-hue));
+  --rz-gray-18: oklch(0.986 var(--rz-gray-chroma) var(--rz-gray-hue));
+  --rz-gray-19: oklch(0.992 var(--rz-gray-chroma) var(--rz-gray-hue));
 
   --rz-accent-hue: 268;
   --rz-accent-chroma: 0.19;
@@ -549,16 +549,16 @@ video {
   color-scheme: light dark;
 
   /* levels */
-  --rz-bg-base: var(--rz-gray-17);
-  --rz-bg-page: var(--rz-gray-19);
-  --rz-bg-raised: var(--rz-gray-19);
-  --rz-bg-float: var(--rz-gray-19);
-  --rz-bg-knob: var(--rz-gray-19);
+  --rz-bg-base: var(--rz-gray-15);
+  --rz-bg-page: var(--rz-gray-16);
+  --rz-bg-raised: var(--rz-gray-17);
+  --rz-bg-float: var(--rz-gray-17);
+  --rz-bg-knob: var(--rz-gray-17);
   --rz-bg-inverse: var(--rz-gray-2);
 
   /* tints */
-  --rz-bg-well: oklch(from var(--rz-gray-0) l c h / 0.035);
-  --rz-bg-hover: oklch(from var(--rz-gray-0) l c h / 0.035);
+  --rz-bg-well: oklch(from var(--rz-gray-0) l c h / 0.032);
+  --rz-bg-hover: oklch(from var(--rz-gray-0) l c h / 0.021);
   --rz-bg-active: oklch(from var(--rz-gray-0) l c h / 0.06);
   --rz-bg-overlay: oklch(from var(--rz-gray-0) l c h / 0.2);
 
@@ -580,24 +580,10 @@ video {
   --rz-accent-border: oklch(from var(--rz-accent-solid) l c h / 0.5);
   --rz-ring: oklch(from var(--rz-accent-solid) l c h / 0.16);
 
-  /* shadows: light mode lifts with a shadow, dark mode with a lit top edge */
-  --rz-shadow-raised: 0 1px 2px oklch(from var(--rz-gray-0) l c h / 0.035);
-  --rz-shadow-float:
-    0 4px 12px -2px oklch(from var(--rz-gray-0) l c h / 0.06),
-    0 16px 36px -12px oklch(from var(--rz-gray-0) l c h / 0.16);
-  --rz-shadow-knob:
-    0 0 0 1px oklch(from var(--rz-gray-0) l c h / 0.06),
-    0 1px 2px oklch(from var(--rz-gray-0) l c h / 0.08);
+  /* shadows: only what floats over the page casts one */
+  --rz-shadow-float: 0 16px 36px -12px oklch(from var(--rz-gray-0) l c h / 0.16);
 
   /* gradients */
-  --rz-gradient-primary: linear-gradient(
-    180deg,
-    oklch(from var(--rz-bg-inverse) calc(l + 0.08) c h),
-    var(--rz-bg-inverse)
-  );
-  --rz-shadow-primary:
-    inset 0 1px 0 oklch(from var(--rz-gray-19) l c h / 0.12),
-    0 1px 2px oklch(from var(--rz-gray-0) l c h / 0.18);
   --rz-glow: radial-gradient(
     70% 38% at 50% 0%,
     oklch(from var(--rz-accent-solid) l c h / 0.035),
@@ -632,17 +618,7 @@ video {
     --rz-accent-border: oklch(from var(--rz-accent-soft) l c h / 0.45);
     --rz-ring: oklch(from var(--rz-accent-soft) l c h / 0.2);
 
-    --rz-shadow-raised: inset 0 1px 0 oklch(from var(--rz-gray-19) l c h / 0.03);
-    --rz-shadow-float:
-      inset 0 1px 0 oklch(from var(--rz-gray-19) l c h / 0.05),
-      0 16px 40px -12px oklch(from var(--rz-gray-0) l c h / 0.6);
-    --rz-shadow-knob:
-      inset 0 1px 0 oklch(from var(--rz-gray-19) l c h / 0.07),
-      0 1px 2px oklch(from var(--rz-gray-0) l c h / 0.5);
-
-    --rz-shadow-primary:
-      inset 0 1px 0 oklch(from var(--rz-gray-19) l c h / 0.5),
-      0 1px 2px oklch(from var(--rz-gray-0) l c h / 0.4);
+    --rz-shadow-float: 0 16px 40px -12px oklch(from var(--rz-gray-0) l c h / 0.6);
     --rz-glow: radial-gradient(
       70% 38% at 50% 0%,
       oklch(from var(--rz-accent-solid) l c h / 0.07),

package/dist/panel/style/mixins/index.css

@@ -1,4 +1,4 @@
-/* A level: its fill, a hairline, its shadow. raised, float. */
+/* A level: its fill, a hairline, and its shadow when it has one. raised has none, float does. */
 
 /* A well: an input, a track, a dropzone. Its edge shows on hover. */
 

package/dist/panel/style/palette.css

@@ -22,9 +22,9 @@
   --rz-gray-14: oklch(0.865 var(--rz-gray-chroma) var(--rz-gray-hue));
   --rz-gray-15: oklch(0.905 var(--rz-gray-chroma) var(--rz-gray-hue));
   --rz-gray-16: oklch(0.94 var(--rz-gray-chroma) var(--rz-gray-hue));
-  --rz-gray-17: oklch(0.965 var(--rz-gray-chroma) var(--rz-gray-hue));
-  --rz-gray-18: oklch(0.982 var(--rz-gray-chroma) var(--rz-gray-hue));
-  --rz-gray-19: oklch(0.996 var(--rz-gray-chroma) var(--rz-gray-hue));
+  --rz-gray-17: oklch(0.968 var(--rz-gray-chroma) var(--rz-gray-hue));
+  --rz-gray-18: oklch(0.986 var(--rz-gray-chroma) var(--rz-gray-hue));
+  --rz-gray-19: oklch(0.992 var(--rz-gray-chroma) var(--rz-gray-hue));
 
   --rz-accent-hue: 268;
   --rz-accent-chroma: 0.19;

package/dist/panel/style/scheme.css

@@ -8,16 +8,16 @@
   color-scheme: light dark;
 
   /* levels */
-  --rz-bg-base: var(--rz-gray-17);
-  --rz-bg-page: var(--rz-gray-19);
-  --rz-bg-raised: var(--rz-gray-19);
-  --rz-bg-float: var(--rz-gray-19);
-  --rz-bg-knob: var(--rz-gray-19);
+  --rz-bg-base: var(--rz-gray-15);
+  --rz-bg-page: var(--rz-gray-16);
+  --rz-bg-raised: var(--rz-gray-17);
+  --rz-bg-float: var(--rz-gray-17);
+  --rz-bg-knob: var(--rz-gray-17);
   --rz-bg-inverse: var(--rz-gray-2);
 
   /* tints */
-  --rz-bg-well: oklch(from var(--rz-gray-0) l c h / 0.035);
-  --rz-bg-hover: oklch(from var(--rz-gray-0) l c h / 0.035);
+  --rz-bg-well: oklch(from var(--rz-gray-0) l c h / 0.032);
+  --rz-bg-hover: oklch(from var(--rz-gray-0) l c h / 0.021);
   --rz-bg-active: oklch(from var(--rz-gray-0) l c h / 0.06);
   --rz-bg-overlay: oklch(from var(--rz-gray-0) l c h / 0.2);
 
@@ -39,24 +39,10 @@
   --rz-accent-border: oklch(from var(--rz-accent-solid) l c h / 0.5);
   --rz-ring: oklch(from var(--rz-accent-solid) l c h / 0.16);
 
-  /* shadows: light mode lifts with a shadow, dark mode with a lit top edge */
-  --rz-shadow-raised: 0 1px 2px oklch(from var(--rz-gray-0) l c h / 0.035);
-  --rz-shadow-float:
-    0 4px 12px -2px oklch(from var(--rz-gray-0) l c h / 0.06),
-    0 16px 36px -12px oklch(from var(--rz-gray-0) l c h / 0.16);
-  --rz-shadow-knob:
-    0 0 0 1px oklch(from var(--rz-gray-0) l c h / 0.06),
-    0 1px 2px oklch(from var(--rz-gray-0) l c h / 0.08);
+  /* shadows: only what floats over the page casts one */
+  --rz-shadow-float: 0 16px 36px -12px oklch(from var(--rz-gray-0) l c h / 0.16);
 
   /* gradients */
-  --rz-gradient-primary: linear-gradient(
-    180deg,
-    oklch(from var(--rz-bg-inverse) calc(l + 0.08) c h),
-    var(--rz-bg-inverse)
-  );
-  --rz-shadow-primary:
-    inset 0 1px 0 oklch(from var(--rz-gray-19) l c h / 0.12),
-    0 1px 2px oklch(from var(--rz-gray-0) l c h / 0.18);
   --rz-glow: radial-gradient(
     70% 38% at 50% 0%,
     oklch(from var(--rz-accent-solid) l c h / 0.035),
@@ -91,17 +77,7 @@
     --rz-accent-border: oklch(from var(--rz-accent-soft) l c h / 0.45);
     --rz-ring: oklch(from var(--rz-accent-soft) l c h / 0.2);
 
-    --rz-shadow-raised: inset 0 1px 0 oklch(from var(--rz-gray-19) l c h / 0.03);
-    --rz-shadow-float:
-      inset 0 1px 0 oklch(from var(--rz-gray-19) l c h / 0.05),
-      0 16px 40px -12px oklch(from var(--rz-gray-0) l c h / 0.6);
-    --rz-shadow-knob:
-      inset 0 1px 0 oklch(from var(--rz-gray-19) l c h / 0.07),
-      0 1px 2px oklch(from var(--rz-gray-0) l c h / 0.5);
-
-    --rz-shadow-primary:
-      inset 0 1px 0 oklch(from var(--rz-gray-19) l c h / 0.5),
-      0 1px 2px oklch(from var(--rz-gray-0) l c h / 0.4);
+    --rz-shadow-float: 0 16px 40px -12px oklch(from var(--rz-gray-0) l c h / 0.6);
     --rz-glow: radial-gradient(
       70% 38% at 50% 0%,
       oklch(from var(--rz-accent-solid) l c h / 0.07),

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "rimecms",
-  "version": "1.0.1",
+  "version": "1.1.0",
   "homepage": "https://github.com/bienbiendev/rime",
   "packageManager": "bun@1.3.0",
   "scripts": {