*, *::before, *::after { box-sizing: border-box; margin: 0; padding: 0; }
body { font-family: -apple-system, 'PingFang SC', 'Helvetica Neue', Arial, sans-serif; background: #f0f2f5; }
#root { min-height: 100vh; }

.page-container { padding: 24px; }
.stat-card { border-radius: 12px; }
.model-card { border-radius: 12px; transition: all 0.2s; cursor: pointer; }
.model-card:hover { box-shadow: 0 8px 24px rgba(0,0,0,0.12); transform: translateY(-2px); }
.tag-hot { background: #fff1f0; color: #cf1322; border-color: #ffa39e; }
.tag-new { background: #f6ffed; color: #389e0d; border-color: #b7eb8f; }
.tag-beta { background: #e6f7ff; color: #0958d9; border-color: #91caff; }
.quota-bar { height: 6px; border-radius: 4px; background: #f0f0f0; overflow: hidden; }
.quota-fill { height: 100%; border-radius: 4px; transition: width 0.3s; }
.logo-text { font-size: 18px; font-weight: 700; color: #1677ff; letter-spacing: -0.5px; }
.logo-sub { font-size: 11px; color: #8c8c8c; margin-top: 2px; }
.sider-logo { display: flex; flex-direction: column; align-items: center; padding: 20px 16px 16px; border-bottom: 1px solid #f0f0f0; margin-bottom: 8px; }
.header-stats { display: flex; gap: 24px; }
.header-stat-item { display: flex; flex-direction: column; }
.ant-layout-sider { box-shadow: 2px 0 8px rgba(0,0,0,0.06); }
.ant-layout-sider-children { display: flex !important; flex-direction: column !important; height: 100% !important; overflow: hidden !important; }
.playground-chat { display: flex; flex-direction: column; height: calc(100vh - 200px); }
.chat-messages { flex: 1; overflow-y: auto; padding: 16px; background: #fafafa; border-radius: 8px; margin-bottom: 16px; }
.chat-msg { margin-bottom: 16px; display: flex; gap: 12px; }
.chat-msg.user { flex-direction: row-reverse; }
.chat-bubble { max-width: 70%; padding: 10px 14px; border-radius: 12px; line-height: 1.6; font-size: 14px; }
.chat-bubble.assistant { background: #fff; border: 1px solid #e8e8e8; }
.chat-bubble.user { background: #1677ff; color: #fff; }
.role-badge-admin { background: linear-gradient(135deg, #667eea 0%, #764ba2 100%); color: #fff; padding: 2px 10px; border-radius: 10px; font-size: 12px; }
.role-badge-tenant_admin { background: linear-gradient(135deg, #f093fb 0%, #f5576c 100%); color: #fff; padding: 2px 10px; border-radius: 10px; font-size: 12px; }
.role-badge-user { background: linear-gradient(135deg, #4facfe 0%, #00f2fe 100%); color: #fff; padding: 2px 10px; border-radius: 10px; font-size: 12px; }