Spaces:
Running
Running
| CSS = """ | |
| /* Claude's exact font stack */ | |
| *, *::before, *::after { | |
| font-family: ui-sans-serif, -apple-system, BlinkMacSystemFont, "Segoe UI", | |
| Helvetica, Arial, sans-serif !important; | |
| box-sizing: border-box; | |
| } | |
| footer { display: none !important; } | |
| /* Full-page warm dark background */ | |
| .gradio-container { | |
| max-width: 100% !important; | |
| width: 100% !important; | |
| padding: 12px !important; | |
| margin: 0 !important; | |
| min-height: 100vh; | |
| background: #1c1917 !important; | |
| } | |
| /* Gradio theme token overrides — warm stone palette */ | |
| .gradio-container, .wrap, .prose { | |
| --body-background-fill: #1c1917 !important; | |
| --background-fill-primary: #28211e !important; | |
| --background-fill-secondary: #1c1917 !important; | |
| --border-color-primary: #44403c !important; | |
| --color-accent: #a78bfa !important; | |
| --button-primary-background-fill: #7c3aed !important; | |
| --button-primary-background-fill-hover: #6d28d9 !important; | |
| --button-primary-text-color: #ffffff !important; | |
| --input-background-fill: #28211e !important; | |
| --block-background-fill: #28211e !important; | |
| --block-border-color: #44403c !important; | |
| --body-text-color: #e7e5e4 !important; | |
| --body-text-color-subdued: #a8a29e !important; | |
| } | |
| /* ── Bordered section boxes ── */ | |
| /* Every top-level gr.Group or gr.Column block */ | |
| .section-box { | |
| border: 1px solid #44403c !important; | |
| border-radius: 12px !important; | |
| background: #211e1b !important; | |
| padding: 16px !important; | |
| margin-bottom: 10px !important; | |
| } | |
| /* Override Gradio's own block borders to match our style */ | |
| .block { | |
| border-radius: 12px !important; | |
| border: 1px solid #44403c !important; | |
| background: #211e1b !important; | |
| } | |
| /* Don't double-border inner elements */ | |
| .block .block { border: none !important; background: transparent !important; } | |
| /* Chatbot window itself */ | |
| .chatbot-block { border: 1px solid #44403c !important; border-radius: 12px !important; overflow: hidden !important; } | |
| /* Chat bubbles */ | |
| .message.user { | |
| background: #3b1f6b !important; | |
| border: 1px solid #5b21b6 !important; | |
| color: #ede9fe !important; | |
| border-radius: 18px 18px 4px 18px !important; | |
| font-size: 15px !important; | |
| line-height: 1.65 !important; | |
| } | |
| .message.bot, .message.assistant { | |
| background: #2a2420 !important; | |
| border: 1px solid #44403c !important; | |
| color: #e7e5e4 !important; | |
| border-radius: 4px 18px 18px 18px !important; | |
| font-size: 15px !important; | |
| line-height: 1.65 !important; | |
| } | |
| .avatar-container { display: none !important; } | |
| /* Input textarea */ | |
| textarea { | |
| font-size: 15px !important; | |
| line-height: 1.5 !important; | |
| } | |
| /* HITL warning box */ | |
| .hitl-box { | |
| border: 1px solid #92400e !important; | |
| border-radius: 12px !important; | |
| background: #1c1007 !important; | |
| padding: 14px 16px !important; | |
| } | |
| """ |