/* ===================================================== chat-tokens.css Import ONCE in your app.css or index.html . Provides the shared CSS custom properties used by all scoped chat component stylesheets. ===================================================== */ :root { /* Brand */ --brand: #674E34; --brand-light: #C4AC91; --brand-pale: #F4EDE5; --brand-dark: #3D2E1E; /* Surfaces */ --surface: #FFFFFF; --surface-alt: #F9F7F5; /* Borders */ --border: #EDE9E4; --border-strong: #D9D1C7; /* Text */ --text-primary: #1A1208; --text-secondary: #7A6C5D; --text-muted: #B0A090; /* Shadows */ --shadow-sm: 0 1px 3px rgba(103, 78, 52, 0.08); --shadow-md: 0 4px 16px rgba(103, 78, 52, 0.12); --shadow-lg: 0 8px 32px rgba(103, 78, 52, 0.16); /* Radii */ --radius-sm: 8px; --radius-md: 14px; --radius-lg: 20px; --radius-xl: 28px; /* Font */ --font: 'DM Sans', system-ui, sans-serif; } /* Base reset for chat pages */ .chat-shell, .chat-shell * { box-sizing: border-box; } /* Utility */ .pointer { cursor: pointer; }