@almadar/shell-web 0.0.0-stage → 0.1.0

package/themes/aqua.css

@@ -0,0 +1,455 @@
+/**
+ * GENERATED — do not edit by hand.
+ * Source: packages/almadar-core/themes/aqua.json
+ * Regenerate: node tools/almadar-pattern-sync/dist/index.js themes (or `almadar-sync themes`)
+ */
+
+[data-theme="aqua-light"] {
+    --color-primary: #1f6fe0;
+    --color-primary-hover: #1859b8;
+    --color-primary-foreground: #ffffff;
+    --color-secondary: #dde5f0;
+    --color-secondary-hover: #cbd6e6;
+    --color-secondary-foreground: #1c2a3a;
+    --color-accent: #56657a;
+    --color-accent-foreground: #ffffff;
+    --color-muted: #e4e9f1;
+    --color-muted-foreground: #4a5a70;
+    --color-background: #e8ecf2;
+    --color-foreground: #1c2a3a;
+    --color-card: #f8fafd;
+    --color-card-foreground: #1c2a3a;
+    --color-surface: #eef2f8;
+    --color-border: #6b7f9c;
+    --color-input: #8a9bb4;
+    --color-ring: #3b8cff;
+    --color-table-header: #eef2f8;
+    --color-table-border: #6b7f9c;
+    --color-table-row-hover: #dfe6f1;
+    --color-surface-hover: #dfe6f1;
+    --color-border-hover: #1f6fe0;
+    --color-placeholder: #6b7a90;
+    --color-error: #c4271b;
+    --color-error-foreground: #ffffff;
+    --color-success: #1b7a34;
+    --color-success-foreground: #ffffff;
+    --color-warning: #f5b301;
+    --color-warning-foreground: #2a1c00;
+    --color-info: #1f6fe0;
+    --color-info-foreground: #ffffff;
+    --color-scrim: rgba(0, 0, 0, 0.6);
+    --color-series-1: #1990fd;
+    --color-series-2: #c4631b;
+    --color-series-3: #1b7a8a;
+    --color-series-4: #8a3fc0;
+    --color-series-5: #63780a;
+    --color-series-6: #c4306b;
+    --color-series-7: #8a6a1b;
+    --color-series-8: #71738c;
+    --color-diagram-ink: #1c2a3a;
+    --color-diagram-label: #2a3a50;
+    --color-diagram-guide: #8896ab;
+    --color-diagram-axis: #56657a;
+    --color-diagram-grid: #d4dce8;
+    --color-diagram-highlight: #1f6fe0;
+    --color-diagram-fill: #1f6fe0;
+    --radius-none: 0px;
+    --radius-sm: 6px;
+    --radius-md: 9px;
+    --radius-lg: 11px;
+    --radius-xl: 16px;
+    --radius-full: 9999px;
+    --border-width: 1px;
+    --border-width-thin: 1px;
+    --border-width-thick: 2px;
+    --font-family: "Noto Sans", "Lucida Grande", system-ui, sans-serif;
+    --font-weight-normal: 400;
+    --font-weight-medium: 500;
+    --font-weight-bold: 700;
+    --letter-spacing: 0em;
+    --line-height: 1.5;
+    --icon-color: #1f6fe0;
+    --transition-fast: 150ms;
+    --transition-normal: 250ms;
+    --transition-slow: 400ms;
+    --transition-timing: cubic-bezier(0.22, 1, 0.36, 1);
+    --hover-scale: 1.0;
+    --hover-translate-y: -1px;
+    --hover-translate-x: 0px;
+    --active-scale: 0.98;
+    --active-translate-y: 1px;
+    --focus-ring-width: 3px;
+    --focus-ring-offset: 1px;
+    --focus-ring-color: #3b8cff;
+    --shadow-main: 0 4px 12px rgba(20,50,100,.28), 0 1px 2px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.7);
+    --shadow-sm: 0 2px 5px rgba(20,50,100,.25), 0 1px 1px rgba(0,0,0,.3), inset 0 1px 0 rgba(255,255,255,.7);
+    --shadow-lg: 0 10px 28px rgba(20,50,100,.35), 0 2px 4px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.7);
+    --shadow-inner: inset 0 2px 4px rgba(20,50,100,.3);
+    --shadow-none: none;
+    --shadow-hover: 0 4px 10px rgba(0,60,160,.45), 0 1px 2px rgba(0,0,0,.35), inset 0 1px 0 rgba(255,255,255,.85);
+    --shadow-active: inset 0 2px 5px rgba(0,30,90,.5);
+    --space-0: 0px;
+    --space-1: 4px;
+    --space-2: 8px;
+    --space-3: 12px;
+    --space-4: 16px;
+    --space-5: 20px;
+    --space-6: 24px;
+    --space-7: 28px;
+    --space-8: 32px;
+    --space-9: 36px;
+    --space-10: 40px;
+    --space-11: 44px;
+    --space-12: 48px;
+    --button-height-sm: 26px;
+    --button-height-md: 34px;
+    --button-height-lg: 44px;
+    --input-height-sm: 26px;
+    --input-height-md: 34px;
+    --input-height-lg: 44px;
+    --row-height-compact: 32px;
+    --row-height-normal: 40px;
+    --row-height-spacious: 48px;
+    --card-padding-sm: 12px;
+    --card-padding-md: 16px;
+    --card-padding-lg: 24px;
+    --dialog-padding: 24px;
+    --section-gap: 32px;
+    --font-family-display: "Noto Sans", "Lucida Grande", system-ui, sans-serif;
+    --font-family-body: var(--font-family);
+    --font-family-mono: "Noto Sans Mono", Monaco, ui-monospace, monospace;
+    --heading-weight: 800;
+    --heading-transform: none;
+    --heading-tracking: -0.01em;
+    --heading-style: normal;
+    --text-xs: 11px;
+    --leading-xs: 16px;
+    --text-sm: 13px;
+    --leading-sm: 18px;
+    --text-base: 14px;
+    --leading-base: 20px;
+    --text-lg: 16px;
+    --leading-lg: 24px;
+    --text-xl: 18px;
+    --leading-xl: 26px;
+    --text-2xl: 22px;
+    --leading-2xl: 28px;
+    --text-3xl: 28px;
+    --leading-3xl: 34px;
+    --text-4xl: 34px;
+    --leading-4xl: 40px;
+    --text-display-1: 44px;
+    --leading-display-1: 48px;
+    --text-display-2: 56px;
+    --leading-display-2: 60px;
+    --intent-heading-major-size: var(--text-2xl);
+    --intent-heading-major-weight: var(--font-weight-bold);
+    --intent-heading-major-leading: var(--leading-2xl);
+    --intent-heading-minor-size: var(--text-lg);
+    --intent-heading-minor-weight: var(--font-weight-bold);
+    --intent-heading-minor-leading: var(--leading-lg);
+    --intent-body-emphasis-size: var(--text-base);
+    --intent-body-emphasis-weight: var(--font-weight-medium);
+    --intent-body-emphasis-leading: var(--leading-base);
+    --intent-body-default-size: var(--text-sm);
+    --intent-body-default-weight: var(--font-weight-normal);
+    --intent-body-default-leading: var(--leading-sm);
+    --intent-body-quiet-size: var(--text-sm);
+    --intent-body-quiet-weight: var(--font-weight-normal);
+    --intent-body-quiet-leading: var(--leading-sm);
+    --intent-caption-size: var(--text-xs);
+    --intent-caption-weight: var(--font-weight-normal);
+    --intent-caption-leading: var(--leading-xs);
+    --intent-numeric-size: var(--text-sm);
+    --intent-numeric-weight: var(--font-weight-medium);
+    --intent-numeric-leading: var(--leading-sm);
+    --duration-instant: 0ms;
+    --duration-fast: 150ms;
+    --duration-normal: 250ms;
+    --duration-slow: 400ms;
+    --duration-dramatic: 600ms;
+    --easing-linear: linear;
+    --easing-standard: cubic-bezier(0.22, 1, 0.36, 1);
+    --easing-emphasized: cubic-bezier(0.2, 0, 0, 1);
+    --easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
+    --motion-modal-enter-from-transform: scale(0.9);
+    --motion-modal-exit-to-transform: scale(0.9);
+    --motion-popover-enter-from-transform: scale(0.95);
+    --motion-popover-exit-to-transform: scale(0.95);
+    --motion-toast-enter-from-transform: translateY(-16px);
+    --motion-toast-exit-to-transform: translateY(-16px);
+    --motion-page-enter-from-transform: translateY(8px);
+    --icon-family: phosphor-fill;
+    --icon-stroke-width: 1.5;
+    --icon-default-size: 16px;
+    --elevation-card: var(--shadow-main);
+    --elevation-popover: var(--shadow-lg);
+    --elevation-dialog: var(--shadow-lg);
+    --elevation-toast: var(--shadow-lg);
+    --elevation-interactive: var(--shadow-hover);
+    --elevation-pressed: var(--shadow-active);
+    --radius-container: 11px;
+    --radius-interactive: var(--radius-full);
+    --radius-pill: var(--radius-full);
+    --border-hairline: 1px;
+    --border-standard: var(--border-width);
+    --border-heavy: var(--border-width-thick);
+    --corner-shape: round;
+    --corner-shape-pill: round;
+    --border-style: solid;
+    --border-style-interactive: solid;
+    --surface-card-image: linear-gradient(180deg, rgba(255,255,255,.65), rgba(255,255,255,0) 50%);
+    --surface-page-image: repeating-linear-gradient(90deg, rgba(255,255,255,.5) 0px, rgba(255,255,255,.5) 2px, rgba(150,170,200,.10) 2px, rgba(150,170,200,.10) 4px);
+    --surface-page-image-size: auto;
+    --diagram-stroke-thin: 1px;
+    --diagram-stroke-normal: 1.5px;
+    --diagram-stroke-bold: 2.5px;
+    --diagram-line-cap: round;
+    --diagram-line-join: round;
+    --diagram-dash: 5 3;
+    --diagram-dot: 1 3;
+    --diagram-fill-style: tint;
+    --diagram-fill-opacity: 0.3;
+    --diagram-roughness: 0;
+    --diagram-glow: 0;
+    --diagram-shadow: 0 2px 3px rgba(20, 50, 100, 0.35);
+    --diagram-marker: triangle;
+    --diagram-label-font: body;
+    --diagram-label-size: sm;
+    --diagram-label-weight: 500;
+    --diagram-label-case: none;
+    --diagram-corner: 9px;
+    --material-roughness: 0.2;
+    --material-metalness: 0.15;
+    --material-flat: 0;
+    --material-outline: 0;
+    --light-ambient: 0.6;
+    --light-key: 1.2;
+    --light-key-color: #f2f8ff;
+    --scene-fog: 0.1;
+}
+
+[data-theme="aqua-dark"] {
+    --color-primary: #4a9bff;
+    --color-primary-hover: #2f82ea;
+    --color-primary-foreground: #001a3a;
+    --color-secondary: #343c49;
+    --color-secondary-hover: #414b5b;
+    --color-secondary-foreground: #e8eef8;
+    --color-accent: #9aa7b8;
+    --color-accent-foreground: #10161f;
+    --color-muted: #2a313c;
+    --color-muted-foreground: #b4c0d2;
+    --color-background: #1a1f27;
+    --color-foreground: #e8eef8;
+    --color-card: #262d38;
+    --color-card-foreground: #e8eef8;
+    --color-surface: #20262f;
+    --color-border: #56647a;
+    --color-input: #56647a;
+    --color-ring: #7db4ff;
+    --color-table-header: #20262f;
+    --color-table-border: #56647a;
+    --color-table-row-hover: #313a47;
+    --color-surface-hover: #313a47;
+    --color-border-hover: #4a9bff;
+    --color-placeholder: #8494ac;
+    --color-error: #ff6b5e;
+    --color-error-foreground: #2a0500;
+    --color-success: #4ed97a;
+    --color-success-foreground: #032010;
+    --color-warning: #ffc933;
+    --color-warning-foreground: #2a1c00;
+    --color-info: #4a9bff;
+    --color-info-foreground: #001a3a;
+    --color-scrim: rgba(0, 0, 0, 0.7);
+    --color-series-1: #657ecc;
+    --color-series-2: #d87d3a;
+    --color-series-3: #2ea1b4;
+    --color-series-4: #af82cf;
+    --color-series-5: #79a02d;
+    --color-series-6: #d5759c;
+    --color-series-7: #b8912f;
+    --color-series-8: #8996a8;
+    --color-diagram-ink: #e8eef8;
+    --color-diagram-label: #c3cddd;
+    --color-diagram-guide: #7f8da3;
+    --color-diagram-axis: #9aa7b8;
+    --color-diagram-grid: #3a4452;
+    --color-diagram-highlight: #4a9bff;
+    --color-diagram-fill: #4a9bff;
+    --radius-none: 0px;
+    --radius-sm: 6px;
+    --radius-md: 9px;
+    --radius-lg: 11px;
+    --radius-xl: 16px;
+    --radius-full: 9999px;
+    --border-width: 1px;
+    --border-width-thin: 1px;
+    --border-width-thick: 2px;
+    --font-family: "Noto Sans", "Lucida Grande", system-ui, sans-serif;
+    --font-weight-normal: 400;
+    --font-weight-medium: 500;
+    --font-weight-bold: 700;
+    --letter-spacing: 0em;
+    --line-height: 1.5;
+    --icon-color: #6fb0ff;
+    --transition-fast: 150ms;
+    --transition-normal: 250ms;
+    --transition-slow: 400ms;
+    --transition-timing: cubic-bezier(0.22, 1, 0.36, 1);
+    --hover-scale: 1.0;
+    --hover-translate-y: -1px;
+    --hover-translate-x: 0px;
+    --active-scale: 0.98;
+    --active-translate-y: 1px;
+    --focus-ring-width: 3px;
+    --focus-ring-offset: 1px;
+    --focus-ring-color: #7db4ff;
+    --shadow-main: 0 4px 14px rgba(0,0,0,.6), 0 1px 2px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.14);
+    --shadow-sm: 0 2px 6px rgba(0,0,0,.55), inset 0 1px 0 rgba(255,255,255,.14);
+    --shadow-lg: 0 12px 32px rgba(0,0,0,.7), 0 2px 4px rgba(0,0,0,.7), inset 0 1px 0 rgba(255,255,255,.14);
+    --shadow-inner: inset 0 2px 4px rgba(0,0,0,.6);
+    --shadow-none: none;
+    --shadow-hover: 0 4px 12px rgba(40,120,255,.5), inset 0 1px 0 rgba(255,255,255,.35);
+    --shadow-active: inset 0 2px 5px rgba(0,0,0,.65);
+    --space-0: 0px;
+    --space-1: 4px;
+    --space-2: 8px;
+    --space-3: 12px;
+    --space-4: 16px;
+    --space-5: 20px;
+    --space-6: 24px;
+    --space-7: 28px;
+    --space-8: 32px;
+    --space-9: 36px;
+    --space-10: 40px;
+    --space-11: 44px;
+    --space-12: 48px;
+    --button-height-sm: 26px;
+    --button-height-md: 34px;
+    --button-height-lg: 44px;
+    --input-height-sm: 26px;
+    --input-height-md: 34px;
+    --input-height-lg: 44px;
+    --row-height-compact: 32px;
+    --row-height-normal: 40px;
+    --row-height-spacious: 48px;
+    --card-padding-sm: 12px;
+    --card-padding-md: 16px;
+    --card-padding-lg: 24px;
+    --dialog-padding: 24px;
+    --section-gap: 32px;
+    --font-family-display: "Noto Sans", "Lucida Grande", system-ui, sans-serif;
+    --font-family-body: var(--font-family);
+    --font-family-mono: "Noto Sans Mono", Monaco, ui-monospace, monospace;
+    --heading-weight: 800;
+    --heading-transform: none;
+    --heading-tracking: -0.01em;
+    --heading-style: normal;
+    --text-xs: 11px;
+    --leading-xs: 16px;
+    --text-sm: 13px;
+    --leading-sm: 18px;
+    --text-base: 14px;
+    --leading-base: 20px;
+    --text-lg: 16px;
+    --leading-lg: 24px;
+    --text-xl: 18px;
+    --leading-xl: 26px;
+    --text-2xl: 22px;
+    --leading-2xl: 28px;
+    --text-3xl: 28px;
+    --leading-3xl: 34px;
+    --text-4xl: 34px;
+    --leading-4xl: 40px;
+    --text-display-1: 44px;
+    --leading-display-1: 48px;
+    --text-display-2: 56px;
+    --leading-display-2: 60px;
+    --intent-heading-major-size: var(--text-2xl);
+    --intent-heading-major-weight: var(--font-weight-bold);
+    --intent-heading-major-leading: var(--leading-2xl);
+    --intent-heading-minor-size: var(--text-lg);
+    --intent-heading-minor-weight: var(--font-weight-bold);
+    --intent-heading-minor-leading: var(--leading-lg);
+    --intent-body-emphasis-size: var(--text-base);
+    --intent-body-emphasis-weight: var(--font-weight-medium);
+    --intent-body-emphasis-leading: var(--leading-base);
+    --intent-body-default-size: var(--text-sm);
+    --intent-body-default-weight: var(--font-weight-normal);
+    --intent-body-default-leading: var(--leading-sm);
+    --intent-body-quiet-size: var(--text-sm);
+    --intent-body-quiet-weight: var(--font-weight-normal);
+    --intent-body-quiet-leading: var(--leading-sm);
+    --intent-caption-size: var(--text-xs);
+    --intent-caption-weight: var(--font-weight-normal);
+    --intent-caption-leading: var(--leading-xs);
+    --intent-numeric-size: var(--text-sm);
+    --intent-numeric-weight: var(--font-weight-medium);
+    --intent-numeric-leading: var(--leading-sm);
+    --duration-instant: 0ms;
+    --duration-fast: 150ms;
+    --duration-normal: 250ms;
+    --duration-slow: 400ms;
+    --duration-dramatic: 600ms;
+    --easing-linear: linear;
+    --easing-standard: cubic-bezier(0.22, 1, 0.36, 1);
+    --easing-emphasized: cubic-bezier(0.2, 0, 0, 1);
+    --easing-spring: cubic-bezier(0.34, 1.56, 0.64, 1);
+    --motion-modal-enter-from-transform: scale(0.9);
+    --motion-modal-exit-to-transform: scale(0.9);
+    --motion-popover-enter-from-transform: scale(0.95);
+    --motion-popover-exit-to-transform: scale(0.95);
+    --motion-toast-enter-from-transform: translateY(-16px);
+    --motion-toast-exit-to-transform: translateY(-16px);
+    --motion-page-enter-from-transform: translateY(8px);
+    --icon-family: phosphor-fill;
+    --icon-stroke-width: 1.5;
+    --icon-default-size: 16px;
+    --elevation-card: var(--shadow-main);
+    --elevation-popover: var(--shadow-lg);
+    --elevation-dialog: var(--shadow-lg);
+    --elevation-toast: var(--shadow-lg);
+    --elevation-interactive: var(--shadow-hover);
+    --elevation-pressed: var(--shadow-active);
+    --radius-container: 11px;
+    --radius-interactive: var(--radius-full);
+    --radius-pill: var(--radius-full);
+    --border-hairline: 1px;
+    --border-standard: var(--border-width);
+    --border-heavy: var(--border-width-thick);
+    --corner-shape: round;
+    --corner-shape-pill: round;
+    --border-style: solid;
+    --border-style-interactive: solid;
+    --surface-card-image: linear-gradient(180deg, rgba(255,255,255,.18), rgba(255,255,255,0) 50%);
+    --surface-page-image: repeating-linear-gradient(90deg, rgba(255,255,255,.04) 0px, rgba(255,255,255,.04) 2px, rgba(0,0,0,.10) 2px, rgba(0,0,0,.10) 4px);
+    --surface-page-image-size: auto;
+    --diagram-stroke-thin: 1px;
+    --diagram-stroke-normal: 1.5px;
+    --diagram-stroke-bold: 2.5px;
+    --diagram-line-cap: round;
+    --diagram-line-join: round;
+    --diagram-dash: 5 3;
+    --diagram-dot: 1 3;
+    --diagram-fill-style: tint;
+    --diagram-fill-opacity: 0.3;
+    --diagram-roughness: 0;
+    --diagram-glow: 0;
+    --diagram-shadow: 0 2px 3px rgba(20, 50, 100, 0.35);
+    --diagram-marker: triangle;
+    --diagram-label-font: body;
+    --diagram-label-size: sm;
+    --diagram-label-weight: 500;
+    --diagram-label-case: none;
+    --diagram-corner: 9px;
+    --material-roughness: 0.2;
+    --material-metalness: 0.15;
+    --material-flat: 0;
+    --material-outline: 0;
+    --light-ambient: 0.6;
+    --light-key: 1.2;
+    --light-key-color: #f2f8ff;
+    --scene-fog: 0.1;
+}