/*!*************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!../../npm-packages/mintontech-styles/tokens.css ***! \*************************************************************************************************/ /* * @mintontech/styles — design tokens. * * These are the universal constants: colors, type, spacing, radius, shadow, * z-index. Import this once per app. It sets no layout and no component * styles — every page is still free to look different. It just means two * projects that both use `var(--space-4)` and `var(--radius-md)` never have * to re-decide what those numbers are. * * Theme: prefers-color-scheme picks the default; an explicit * data-theme="dark" / data-theme="light" attribute on overrides it * (see theme.js). Same convention used for Claude Artifacts, so it carries * over if tokens ever get reused there. */ :root { color-scheme: light dark; /* ---- color: light (default) ---- */ --color-bg: #f4f5f7; --color-surface: #ffffff; --color-surface-raised: #ecedf0; --color-border: #e2e4e8; --color-text: #1a1d21; --color-text-muted: #6b7280; --color-accent: #4f7cff; --color-accent-contrast: #ffffff; --color-link: #3d68e8; --color-ok: #2fbf71; --color-warn: #b98900; --color-danger: #e5484d; /* ---- type ---- */ --font-sans: -apple-system, BlinkMacSystemFont, "Segoe UI", system-ui, Roboto, sans-serif; --font-mono: ui-monospace, "SF Mono", Menlo, Consolas, monospace; --text-xs: 11px; --text-sm: 13px; --text-base: 15px; --text-md: 16px; --text-lg: 18px; --text-xl: 22px; --text-2xl: 28px; --text-3xl: 36px; --font-weight-normal: 400; --font-weight-medium: 500; --font-weight-semibold: 600; --font-weight-bold: 700; --leading-tight: 1.2; --leading-normal: 1.5; --leading-relaxed: 1.7; /* ---- spacing (padding, gap, and margin all draw from this one scale) ---- */ --space-0: 0; --space-1: 4px; --space-2: 8px; --space-3: 12px; --space-4: 16px; --space-5: 20px; --space-6: 24px; --space-8: 32px; --space-10: 40px; --space-12: 48px; --space-16: 64px; /* ---- radius ---- */ --radius-sm: 6px; --radius-md: 8px; --radius-lg: 12px; --radius-xl: 16px; --radius-full: 999px; /* ---- shadow ---- */ --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.12); --shadow-md: 0 6px 24px rgba(0, 0, 0, 0.18); --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.28); /* ---- z-index scale — pick from here instead of inventing a number ---- */ --z-dropdown: 10; --z-sticky: 20; --z-overlay: 100; --z-modal: 200; --z-toast: 300; --z-max: 2147483000; /* "always on top of everything" — matches the comms widget convention */ } /* ---- color: dark, via OS preference ---- */ @media (prefers-color-scheme: dark) { :root { --color-bg: #0d1117; --color-surface: #161b22; --color-surface-raised: #21262d; --color-border: #30363d; --color-text: #e6edf3; --color-text-muted: #8b949e; --color-accent: #2f81f7; --color-accent-contrast: #ffffff; --color-link: #58a6ff; --color-ok: #3fb950; --color-warn: #d29922; --color-danger: #f85149; --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.35); --shadow-md: 0 6px 24px rgba(0, 0, 0, 0.45); --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.5); } } /* ---- explicit override — wins over the OS preference either direction ---- */ :root[data-theme="dark"] { --color-bg: #0d1117; --color-surface: #161b22; --color-surface-raised: #21262d; --color-border: #30363d; --color-text: #e6edf3; --color-text-muted: #8b949e; --color-accent: #2f81f7; --color-accent-contrast: #ffffff; --color-link: #58a6ff; --color-ok: #3fb950; --color-warn: #d29922; --color-danger: #f85149; --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.35); --shadow-md: 0 6px 24px rgba(0, 0, 0, 0.45); --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.5); } :root[data-theme="light"] { --color-bg: #f4f5f7; --color-surface: #ffffff; --color-surface-raised: #ecedf0; --color-border: #e2e4e8; --color-text: #1a1d21; --color-text-muted: #6b7280; --color-accent: #4f7cff; --color-accent-contrast: #ffffff; --color-link: #3d68e8; --color-ok: #2fbf71; --color-warn: #b98900; --color-danger: #e5484d; --shadow-sm: 0 1px 3px rgba(0, 0, 0, 0.12); --shadow-md: 0 6px 24px rgba(0, 0, 0, 0.18); --shadow-lg: 0 8px 30px rgba(0, 0, 0, 0.28); } /*!************************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!../../npm-packages/mintontech-styles/reset.css ***! \************************************************************************************************/ /* * @mintontech/styles — minimal reset. Optional: import this before your own * styles if you want a clean baseline. Skip it if a project already has one * it likes (e.g. claude-remote's existing body/button rules) — tokens.css * works fine on its own. */ * { box-sizing: border-box; } html, body { margin: 0; height: 100%; } body { background: var(--color-bg); color: var(--color-text); font-family: var(--font-sans); font-size: var(--text-base); line-height: var(--leading-normal); -webkit-font-smoothing: antialiased; } a { color: var(--color-link); } button, input, select, textarea { font: inherit; color: inherit; } /*!************************************************************************************!*\ !*** css ./node_modules/css-loader/dist/cjs.js!./pages/coming-soon/src/styles.css ***! \************************************************************************************/ .wrap { min-height: 100vh; display: flex; align-items: center; justify-content: center; background: var(--color-bg); padding: var(--space-6); } .card { text-align: center; } .domain { font-family: var(--font-mono); font-size: var(--text-sm); color: var(--color-text-muted); letter-spacing: .02em; margin-bottom: var(--space-4); } h1 { font-size: var(--text-3xl); font-weight: var(--font-weight-semibold); color: var(--color-text); } /*# sourceMappingURL=bundle.css.map*/