/* Career companion workspace: shell, navigation, hero, and responsive layout. */
.app-container { grid-template-rows: 74px minmax(0, 1fr); }
.header { padding: 0 clamp(16px, 1.6vw, 28px); background: #0d0d0e; border-bottom-color: rgba(239, 68, 68, .22); }
.header::after { background: rgba(239, 68, 68, .24); }
.brand { gap: 12px; min-width: 0; white-space: nowrap; }
.brand-logo { display: none; }
.brand-coordinate-logo { display: block; width: 138px; height: auto; object-fit: contain; }
.brand-coordinate-logo-light { display: none; }
.brand-text { color: #ef3035; background: none; -webkit-text-fill-color: currentColor; font-size: 24px; line-height: 1; letter-spacing: 0; }
.brand-agent-tag { display: inline-flex; align-items: center; height: 25px; padding: 0 9px; border-radius: 13px; background: #ef3035; color: #fff; font-size: 11px; font-weight: 800; letter-spacing: .5px; }
.header-actions { gap: 8px; }
.theme-toggle-btn, .header-btn, .token-quota-balance { min-height: 36px; border-radius: 7px; background: #1a1a1b; border-color: #29292b; }
.theme-toggle-btn { width: 40px; height: 36px; }
.token-quota-balance { padding: 7px 12px; font-size: 13px; }
.header-btn { padding: 7px 13px; }
.sidebar { padding: 18px 0 32px; background: var(--workspace-sidebar-bg); border-right-color: var(--workspace-border); scrollbar-gutter: auto; scrollbar-width: none; -ms-overflow-style: none; }
.sidebar::-webkit-scrollbar { display: none; width: 0; height: 0; }
.nav-workspace { padding-top: 0; }
.nav-workspace-title { padding: 0 24px 17px; color: var(--workspace-muted); font-size: 14px; font-weight: 500; }
.nav-workspace-body, .nav-section-body { display: flex; flex-direction: column; gap: 3px; }
.nav-workspace-body { padding-bottom: 34px; }
.nav-history-sidebar { margin: -18px 0 56px; padding: 0 12px; }
.nav-history-sidebar-header { display: flex; align-items: center; padding: 0 10px 8px; color: var(--workspace-muted); font-size: 13px; }
.nav-history-sidebar-list { display: flex; flex-direction: column; gap: 2px; }
.nav-history-sidebar-item { display: flex; align-items: center; width: 100%; min-height: 36px; padding: 5px 8px; gap: 8px; overflow: hidden; border: 0; border-radius: 6px; color: var(--workspace-muted); background: transparent; font: inherit; font-size: 13px; text-align: left; cursor: pointer; }
.nav-history-sidebar-item:hover, .nav-history-sidebar-item.active { color: #f1f1f2; background: rgba(255,255,255,.06); }
.nav-history-sidebar-item.active { color: #ef3035; }
.nav-history-sidebar-icon { display: inline-flex; flex: 0 0 auto; color: currentColor; }
.nav-history-sidebar-title { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.nav-history-sidebar-empty { padding: 4px 10px; color: var(--workspace-muted); font-size: 13px; }
.nav-history-sidebar-footer { padding: 8px 0 0; }
.nav-history-sidebar-footer button { width: 100%; padding: 6px 10px; border: 1px solid var(--workspace-border); border-radius: 6px; color: var(--workspace-muted); background: transparent; font: inherit; font-size: 13px; cursor: pointer; }
.nav-history-sidebar-footer button:hover { color: #ef3035; border-color: rgba(239,48,53,.55); }
.nav-applications-title { margin: 0 24px; padding: 0 0 16px; border-bottom: 1px solid var(--workspace-border); color: var(--workspace-muted); font-size: 13px; font-weight: 500; }
.nav-application-groups { padding-top: 22px; }
.nav-application-group { margin: 0 0 24px; }
.nav-application-title { padding: 0 24px 13px; color: var(--workspace-muted); font-size: 14px; font-weight: 600; }
.nav-item { min-height: 48px; margin-bottom: 0; padding: 9px 22px; gap: 14px; border: 0; border-radius: 0; color: var(--workspace-muted); font-size: 15px; font-weight: 500; }
.nav-item:hover { background: #19191a; }
.nav-item.active { color: #fff; background: linear-gradient(90deg, rgba(83, 25, 27, .86), rgba(36, 22, 23, .68)); border: 0; border-radius: 0 0 0 0; outline: 0; box-shadow: none; }
.nav-item::before { width: 4px; border-radius: 0 4px 4px 0; background: #ef3035; }
.nav-item.active .nav-icon { color: #ff4b50; }
.nav-icon { width: 20px; height: 20px; }
.main-content { background: var(--workspace-bg); }
.career-home {
  --workspace-width: min(1280px, 80%);
  --hero-width: var(--workspace-width);
  position: relative;
  display: flex;
  height: 100%;
  flex-direction: column;
  align-items: center;
  justify-content: flex-start;
  gap: 0;
  overflow: auto;
  padding: 14px 0 12px;
  background: linear-gradient(180deg, #191718 0%, #171718 44%, #141415 100%);
  scrollbar-gutter: stable;
}
.career-home::before { content: ''; position: absolute; inset: 0; background: radial-gradient(ellipse at 50% -12%, rgba(239,48,53,.08), transparent 52%); pointer-events: none; }
.career-hero { position: relative; display: grid; grid-template-columns: minmax(0, 1.08fr) minmax(340px, .92fr); align-items: center; width: var(--hero-width); height: clamp(340px, 39vh, 410px); min-height: 340px; margin: 0 auto; overflow: visible; flex: 0 0 auto; }
.career-hero::after { content: ''; position: absolute; right: 7%; bottom: 0; left: 7%; height: 1px; background: linear-gradient(90deg, transparent, rgba(239,48,53,.18), transparent); }
.career-hero-copy { position: relative; z-index: 2; display: flex; align-items: center; justify-content: flex-end; min-width: 0; min-height: 0; height: 100%; overflow: visible; }
.career-hero-art { display: block; width: 90%; height: 90%; object-fit: contain; object-position: center; filter: drop-shadow(0 16px 26px rgba(0,0,0,.18)); }
.career-hero-art-light { display: none; }
.career-hero-visual { position: relative; z-index: 1; align-self: stretch; min-width: 0; min-height: 0; height: 100%; margin-left: -5%; overflow: visible; }
.career-hero-visual img { position: absolute; display: block; object-fit: contain; pointer-events: none; user-select: none; }
.career-hero-person { z-index: 1; top: -5%; right: 1%; width: 94%; height: 112%; }
.career-hero-search { z-index: 2; top: 3%; left: 3%; width: 18%; height: auto; animation: career-float-search 4.2s ease-in-out infinite; }
.career-hero-job { z-index: 2; right: 2%; bottom: 9%; width: 19%; height: auto; animation: career-float-job 3.6s ease-in-out infinite; }
@keyframes career-float-search { 0%, 100% { transform: translateY(0) rotate(-4deg); } 50% { transform: translateY(7px) rotate(1deg); } }
@keyframes career-float-job { 0%, 100% { transform: translateY(0) rotate(6deg); } 50% { transform: translateY(-7px) rotate(2deg); } }
.career-quick-actions { position: relative; z-index: 3; display: grid; grid-template-columns: repeat(2, minmax(0, 1fr)); gap: 12px; width: var(--workspace-width); margin: 12px auto 18px; }
.career-quick-action { min-height: 60px; display: flex; align-items: center; gap: 14px; padding: 12px 20px; color: #b8b8bb; background: #1d1d1e; border: 1px solid #303033; border-radius: 8px; font: inherit; font-size: 15px; font-weight: 600; text-align: left; cursor: pointer; box-shadow: 0 8px 24px rgba(0,0,0,.08); transition: border-color .2s, color .2s, background .2s, transform .2s; }
.career-quick-action svg { flex: 0 0 auto; color: #ef3035; }
.career-quick-action:hover { color: #fff; background: #222224; border-color: rgba(239,48,53,.48); transform: translateY(-1px); }
.career-chat-main-title { display: none; }
.career-chat-panel { position: relative; display: flex; width: var(--workspace-width); height: clamp(300px, 33vh, 350px); min-height: 300px; flex: 0 0 auto; flex-direction: column; overflow: hidden; border: 1px solid rgba(239,48,53,.24); border-radius: 8px; background: var(--workspace-surface); box-shadow: 0 18px 44px rgba(0,0,0,.2); transition: border-color .25s, box-shadow .25s; }
.career-chat-panel:has(.agent-menu.active) { overflow: visible; z-index: 10; }
.career-chat-messages { display: flex; min-height: 0; flex: 1; flex-direction: column; gap: 14px; overflow-y: auto; padding: 24px; background: #1c1c1d; }
.career-chat-messages:empty { display: none; }
.career-home .chat-message.assistant { width: 80%; max-width: 80%; padding: 16px 20px; border-left-color: #ef3035; background: #211b1c; box-shadow: 0 8px 24px rgba(0,0,0,.15); }
.career-home .chat-message,
.career-home .markdown-content { min-width: 0; overflow-wrap: anywhere; word-break: break-word; }
.career-home .markdown-content pre,
.career-home .markdown-content .table-wrap { max-width: 100%; overflow-x: auto; overflow-wrap: normal; word-break: normal; }
.career-home .markdown-content pre code { overflow-wrap: normal; word-break: normal; }
.career-home .chat-message.career-welcome-message { width: 100%; max-width: none; padding: 10px 8px; border: 0; border-radius: 0; color: #77777c; background: transparent; box-shadow: none; }
.career-home .career-welcome-message .markdown-content { color: inherit; font-size: 16px; line-height: 1.7; }
.career-home .career-welcome-message .markdown-content p { margin: 0; }
.career-chat-input-area { display: flex; min-height: 0; flex: 0 0 auto; flex-direction: column; margin: 0; padding: 12px 16px 14px; border: 0; border-top: 1px solid rgba(255,255,255,.07); border-radius: 0; background: rgba(255,255,255,.025); }
.career-chat-input-area:focus-within { background: rgba(255,255,255,.035); }
.career-chat-input-area .chat-input { display: block; min-width: 0; flex: 1; min-height: 36px; max-height: 120px; margin: 0; padding: 6px 4px; border: 0; border-radius: 0; background: transparent; box-shadow: none; }
.career-chat-input-area .chat-input:focus { border: 0; background: transparent; box-shadow: none; }
.career-chat-panel:has(.career-chat-messages:empty) .career-chat-input-area { flex: 1 1 auto; align-items: flex-start; padding: 28px 24px 14px; border-top: 0; }
.career-chat-panel:has(.career-chat-messages:empty) .career-chat-input-row { height: 100%; align-items: flex-end; justify-content: space-between; }
.career-chat-panel:has(.career-chat-messages:empty) .career-chat-input-area .chat-input { min-height: 0; max-height: none; flex: 1 1 100%; order: -1; align-self: flex-start; width: 100%; text-align: left; padding: 0; font-size: 16px; line-height: 1.7; }
.career-chat-input-row { display: flex; width: 100%; align-items: center; gap: 10px; }
.career-chat-panel:has(.career-chat-messages:empty) .career-chat-input-row { width: calc(100% + 48px); margin: 0 -24px -18px; padding: 14px 24px 18px; }
.career-chat-input-shell { display: flex; min-width: 0; flex: 1; align-items: center; gap: 6px; padding: 0; border: 0; background: transparent; }
.ai-disclaimer { width: 100%; padding: 3px 8px 0; color: var(--text-muted); font-size: 12px; line-height: 1.5; text-align: center; }
.career-chat-panel:has(.career-chat-messages:empty) .career-chat-input-shell { flex-wrap: wrap; align-items: flex-end; }
.career-home .send-btn { width: 40px; height: 40px; margin-left: auto; border-radius: 10px; }
.career-home.chat-active { padding: 0; overflow: hidden; }
.career-home.chat-active .career-hero,
.career-home.chat-active .career-quick-actions,
.career-home.chat-active .career-chat-main-title { display: none; }
.career-home.chat-active .career-chat-panel { width: 100%; height: 100%; min-height: 0; flex: 1 1 auto; border: 0; border-radius: 0; background: #18181b; box-shadow: none; }
.career-home.chat-active .career-chat-panel:focus-within { box-shadow: none; }
.career-home.chat-active .career-chat-messages { padding: 28px max(24px, 10%); background: #18181b; }
.career-home.chat-active .career-chat-input-area { display: grid; grid-template-columns: auto minmax(0, 1fr) auto; align-items: center; gap: 10px; width: min(86%, 1740px); margin: 18px auto; padding: 8px 12px; border: 1px solid rgba(239,48,53,.82); border-radius: 20px; background: #202022; box-shadow: 0 0 18px rgba(220,38,38,.18); }
.career-home.chat-active .career-chat-input-row { display: contents; }
.career-home.chat-active .career-chat-input-shell { grid-column: 1; gap: 10px; }
.career-home.chat-active .career-chat-input-area .chat-input { grid-column: 1 / -1; width: 100%; padding-right: 0; padding-left: 0; font-size: 15px; }
.career-home.chat-active .send-btn { grid-column: 3; }
.career-home.chat-active .chat-uploaded-files { grid-column: 1 / -1; }
.career-home.chat-active .ai-disclaimer { grid-column: 1 / -1; }
.career-home .platform-links { display: none; }

/* History sessions: browse on the left, inspect the full conversation on the right. */
#historyChatModule { background: #101011; }
.history-workspace { display: grid; grid-template-columns: 320px minmax(0, 1fr); height: 100%; min-height: 0; }
.history-session-pane { display: flex; min-height: 0; flex-direction: column; background: #151516; border-right: 1px solid #2a2a2c; }
.history-pane-header, .history-preview-header { display: flex; align-items: center; justify-content: space-between; min-height: 62px; padding: 0 20px; border-bottom: 1px solid #29292b; }
.history-pane-title, .history-preview-title { display: inline-flex; align-items: center; gap: 10px; color: #f4f4f5; font-size: 16px; font-weight: 700; }
.history-pane-title .title-dot, .history-preview-title .title-dot { width: 8px; height: 8px; border-radius: 50%; background: #ef3035; box-shadow: 0 0 0 3px rgba(239,48,53,.12); }
.history-refresh-btn { display: inline-flex; align-items: center; justify-content: center; width: 32px; height: 32px; border: 1px solid #333336; border-radius: 6px; color: #9b9ba0; background: transparent; cursor: pointer; }
.history-refresh-btn:hover { color: #fff; border-color: rgba(239,48,53,.55); }
.history-search { display: flex; align-items: center; gap: 8px; margin: 14px 14px 10px; padding: 0 10px; height: 38px; color: #85858b; border: 1px solid #303033; border-radius: 7px; background: #1d1d1f; }
.history-search:focus-within { border-color: rgba(239,48,53,.55); }
.history-search input { min-width: 0; width: 100%; border: 0; outline: 0; color: #e9e9eb; background: transparent; font: inherit; font-size: 13px; }
.history-search input::placeholder { color: #77777d; }
.history-session-list { min-height: 0; overflow-y: auto; padding: 4px 12px 16px; }
.history-session-list .empty-state { padding: 48px 12px; font-size: 13px; }
.history-session-item { display: grid; width: 100%; gap: 7px; margin: 0 0 8px; padding: 14px; overflow: hidden; border: 1px solid #29292b; border-radius: 9px; color: #b3b3b7; background: #1c1c1e; font: inherit; text-align: left; cursor: pointer; transition: border-color .18s ease, background .18s ease; }
.history-session-item:hover { border-color: #48484d; background: #202022; }
.history-session-item.active { border-color: rgba(239,48,53,.78); background: linear-gradient(125deg, rgba(126,19,22,.42), rgba(31,24,25,.85)); }
.history-session-row { display: flex; align-items: center; gap: 10px; min-width: 0; }
.history-session-row strong { overflow: hidden; color: #efeff1; font-size: 14px; line-height: 1.35; text-overflow: ellipsis; white-space: nowrap; }
.history-session-row time { flex: 0 0 auto; margin-left: auto; color: #818187; font-size: 11px; white-space: nowrap; }
.history-session-preview { display: -webkit-box; overflow: hidden; color: #99999f; font-size: 12px; line-height: 1.55; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.history-session-count { color: #696970; font-size: 11px; }
.history-preview-pane { display: flex; min-width: 0; min-height: 0; flex-direction: column; background: #0f0f10; }
.history-preview-header { padding-left: 24px; }
.history-continue-btn { min-height: 36px; padding: 0 15px; border: 1px solid transparent; border-radius: 7px; color: #fff; background: #e7353b; font: inherit; font-size: 13px; font-weight: 700; cursor: pointer; }
.history-continue-btn:hover:not(:disabled) { background: #f04449; }
.history-continue-btn:disabled { color: #7f7f84; background: #29292b; cursor: not-allowed; }
.history-preview-messages { flex: 1; min-height: 0; overflow-y: auto; padding: 28px clamp(24px, 5vw, 84px) 48px; }
.history-preview-messages .empty-state { min-height: 100%; }
.history-preview-message { width: fit-content; max-width: min(860px, 88%); margin: 0 0 20px; padding: 18px 22px; border: 1px solid #303033; border-radius: 12px; color: #dedee1; background: #1d1d1f; font-size: 15px; line-height: 1.8; }
.history-preview-message.user { margin-left: auto; border-color: rgba(239,48,53,.4); background: linear-gradient(135deg, rgba(116,20,23,.66), rgba(59,20,22,.82)); }
.history-preview-message.assistant { border-left: 3px solid #ef3035; }
.history-preview-message .markdown-content > :first-child { margin-top: 0; }
.history-preview-message .markdown-content > :last-child { margin-bottom: 0; }

/* Agent catalog */
#agentExpertModule { background: #0f0f10; }
.agent-catalog-page { height: 100%; overflow-y: auto; padding: 28px 34px 48px; }
.agent-catalog-header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 24px; }
.agent-catalog-header h1 { display: flex; align-items: center; gap: 12px; margin: 0; color: #f4f4f5; font-size: 24px; }
.agent-catalog-header p { margin: 8px 0 0; color: #77777d; font-size: 13px; }
.agent-catalog-chip-icon { display: inline-flex; width: 26px; height: 26px; color: #ef3b40; }
.agent-catalog-chip-icon svg { width: 100%; height: 100%; stroke-width: 1.8; }
.agent-catalog-toolbar { display: flex; align-items: center; justify-content: space-between; gap: 18px; margin-bottom: 25px; }
.agent-category-filters { display: flex; flex-wrap: wrap; gap: 9px; }
.agent-category-filter { min-height: 38px; padding: 0 17px; border: 1px solid #333336; border-radius: 20px; color: #8f8f94; background: #1d1d1f; font: inherit; font-size: 13px; cursor: pointer; }
.agent-category-filter:hover { color: #e6e6e8; border-color: #4a4a4e; }
.agent-category-filter.active { color: #fff; border-color: #ef353a; background: #ef353a; font-weight: 700; }
.agent-catalog-search { display: flex; align-items: center; gap: 9px; width: min(310px, 100%); height: 40px; padding: 0 13px; border: 1px solid #303033; border-radius: 8px; color: #818187; background: #1d1d1f; }
.agent-catalog-search:focus-within { border-color: rgba(239,53,58,.65); }
.agent-catalog-search svg { width: 17px; height: 17px; flex: 0 0 auto; }
.agent-catalog-search input { min-width: 0; width: 100%; border: 0; outline: 0; color: #e8e8ea; background: transparent; font: inherit; font-size: 13px; }
.agent-catalog-status { min-height: 20px; color: #85858a; font-size: 13px; }
.agent-catalog-section { margin-top: 8px; padding-bottom: 40px; }
.agent-catalog-section + .agent-catalog-section { padding-top: 4px; }
.agent-catalog-section-head { display: flex; align-items: center; justify-content: space-between; gap: 18px; padding-bottom: 17px; border-bottom: 1px solid #29292b; }
.agent-catalog-section-head h2 { margin: 0; color: #f2f2f3; font-size: 18px; }
.agent-catalog-section-head p { margin: 7px 0 0; color: #77777d; font-size: 13px; }
.agent-catalog-section-head > span { flex: 0 0 auto; padding: 6px 13px; border: 1px solid #303033; border-radius: 18px; color: #77777d; background: #1b1b1d; font-size: 12px; }
.agent-catalog-grid { display: grid; grid-template-columns: repeat(4, minmax(0, 1fr)); gap: 16px; padding-top: 18px; }
.agent-catalog-card { position: relative; display: flex; min-width: 0; min-height: 170px; flex-direction: column; align-items: flex-start; padding: 18px; overflow: hidden; border: 1px solid #303033; border-radius: 8px; color: #eeeef0; background: #202021; font: inherit; text-align: left; cursor: pointer; transition: border-color .18s, background .18s, transform .18s; }
.agent-catalog-card:hover { border-color: rgba(239,53,58,.72); background: #292728; transform: translateY(-1px); }
.agent-card-icon { display: flex; align-items: center; justify-content: center; width: 46px; height: 46px; margin-bottom: 18px; border: 1px solid rgba(239,53,58,.32); border-radius: 8px; color: #f04449; background: rgba(106,28,31,.24); }
.agent-card-icon svg { width: 24px; height: 24px; }
.agent-card-title-row { display: flex; align-items: center; gap: 9px; max-width: 100%; }
.agent-card-title-row strong { min-width: 0; overflow: hidden; font-size: 17px; text-overflow: ellipsis; white-space: nowrap; }
.agent-card-title-row em { flex: 0 0 auto; padding: 1px 8px; border-radius: 10px; font-size: 10px; font-style: normal; }
.agent-card-title-row em.public { color: #8bc34a; border: 1px solid rgba(139,195,74,.45); background: rgba(139,195,74,.1); }
.agent-card-title-row em.internal { color: #f87171; border: 1px solid rgba(239,68,68,.45); background: rgba(239,68,68,.1); }
.agent-card-description { display: -webkit-box; margin-top: 10px; overflow: hidden; color: #818187; font-size: 12px; line-height: 1.6; -webkit-box-orient: vertical; -webkit-line-clamp: 2; }
.agent-card-action { position: absolute; top: 18px; right: 18px; display: none; padding: 6px 10px; border-radius: 15px; color: #fff; background: #ef353a; font-size: 11px; font-weight: 700; }
.agent-catalog-card:hover .agent-card-action { display: block; }

body.theme-light .header { background: #fff; }
body.theme-light .brand-coordinate-logo-dark { display: none; }
body.theme-light .brand-coordinate-logo-light { display: block; }
body.theme-light .theme-toggle-btn, body.theme-light .header-btn, body.theme-light .token-quota-balance { background: #f7f7f8; border-color: #e3e3e4; }
body.theme-light .sidebar { background: #f8f8f8; border-right-color: #e2e2e3; }
body.theme-light .main-content, body.theme-light .career-home { background: #f5f5f6; }
body.theme-light .career-home::before { background: radial-gradient(ellipse at 50% -12%, rgba(239,68,68,.08), transparent 52%); }
body.theme-light .career-hero-art-dark { display: none; }
body.theme-light .career-hero-art-light { display: block; }
body.theme-light .nav-workspace-title,
body.theme-light .nav-application-title,
body.theme-light .nav-applications-title { color: #55565d; }
body.theme-light .nav-applications-title { border-bottom-color: #d8d8dc; }
body.theme-light .nav-item { color: #55565d; }
body.theme-light .nav-item:hover { color: #242428; background: #ededf0; }
body.theme-light .nav-item.active { color: #242428; background: linear-gradient(90deg, rgba(239,68,68,.13), rgba(239,68,68,.035)); }
body.theme-light .nav-item-disabled { color: #777980; }
body.theme-light .nav-history-sidebar-item:hover,
body.theme-light .nav-history-sidebar-item.active { color: #55565d; background: rgba(0,0,0,.05); }
body.theme-light .nav-history-sidebar-item.active { color: #ef3035; }
body.theme-light .nav-icon { color: #73757d; }
body.theme-light .career-quick-action { color: #4b4d55; border-color: #d9d9de; box-shadow: 0 8px 24px rgba(15,23,42,.06); }
body.theme-light .career-quick-action:hover { color: #242428; background: #fffafa; }
body.theme-light .career-chat-panel { border-color: rgba(220,38,38,.24); box-shadow: 0 18px 44px rgba(15,23,42,.08); }
body.theme-light .career-home .career-welcome-message { color: #5f626b; }
body.theme-light .career-quick-action, body.theme-light .career-chat-panel, body.theme-light .career-chat-messages { background: #fff; }
body.theme-light .career-chat-input-area { border-color: rgba(15,23,42,.09); background: #fff; }
body.theme-light .career-chat-input-shell { border-color: rgba(220,38,38,.18); background: #fff; }
body.theme-light .career-chat-input-area:focus-within { background: #fff; }
body.theme-light .career-chat-input-area .chat-input,
body.theme-light .career-chat-input-area .chat-input:focus { background: transparent; }
body.theme-light .career-home.chat-active .career-chat-messages { background: #f5f5f6; }
body.theme-light .career-home.chat-active .career-chat-panel { background: #f5f5f6; }
body.theme-light .career-home.chat-active .career-chat-input-area { background: #fff; box-shadow: 0 0 18px rgba(220,38,38,.12), 0 8px 20px rgba(15,23,42,.06); }
body.theme-light #historyChatModule { background: #f5f5f6; }
body.theme-light .history-session-pane { background: #fff; border-right-color: #e3e3e4; }
body.theme-light .history-pane-header, body.theme-light .history-preview-header { border-bottom-color: #e4e4e5; }
body.theme-light .history-pane-title, body.theme-light .history-preview-title { color: #242428; }
body.theme-light .history-search, body.theme-light .history-session-item { border-color: #e1e1e3; background: #fafafb; }
body.theme-light .history-search input { color: #28282c; }
body.theme-light .history-session-row strong { color: #303034; }
body.theme-light .history-preview-pane { background: #f7f7f8; }
body.theme-light .history-preview-message { border-color: #e1e1e3; color: #343438; background: #fff; }
body.theme-light .history-preview-message.user { border-color: rgba(220,38,38,.26); background: #fff1f1; }
body.theme-light #agentExpertModule { background: #f7f7f8; }
body.theme-light .agent-catalog-header h1, body.theme-light .agent-catalog-section-head h2 { color: #242428; }
body.theme-light .agent-catalog-section-head { border-bottom-color: #dedee0; }
body.theme-light .agent-category-filter, body.theme-light .agent-catalog-search, body.theme-light .agent-catalog-section-head > span { border-color: #dedee0; background: #fff; }
body.theme-light .agent-category-filter.active { color: #fff; border-color: #ef353a; background: #ef353a; }
body.theme-light .agent-catalog-search input { color: #29292d; }
body.theme-light .agent-catalog-card { border-color: #e1e1e3; color: #29292d; background: #fff; }
body.theme-light .agent-catalog-card:hover { border-color: rgba(220,38,38,.45); background: #fffafa; }
body.theme-light .agent-card-icon { border-color: #fecaca; background: #fff1f2; }

@media (max-width: 900px) {
  .app-container { grid-template-rows: 60px minmax(0, 1fr); }
  .brand-coordinate-logo { width: 92px; }
  .brand-text { font-size: 25px; }
  .brand-agent-tag { display: none; }
  .header-actions { gap: 7px; }
  .token-quota-balance { padding: 8px 10px; }
  .career-home { --workspace-width: calc(100% - 36px); --hero-width: var(--workspace-width); padding-top: 10px; }
  .career-hero { grid-template-columns: minmax(0, 1.08fr) minmax(250px, .92fr); width: var(--workspace-width); height: 265px; min-height: 245px; overflow: hidden; }
  .career-hero-art { width: 90%; height: 90%; }
  .career-quick-actions { margin-top: 14px; }
  .agent-catalog-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 760px) {
  .history-workspace { grid-template-columns: 1fr; overflow-y: auto; }
  .history-session-pane { min-height: 285px; max-height: 42vh; border-right: 0; border-bottom: 1px solid #2a2a2c; }
  .history-preview-pane { min-height: 520px; }
  .history-pane-header, .history-preview-header { min-height: 52px; padding: 0 14px; }
  .history-preview-messages { padding: 18px 14px 36px; }
  .history-preview-message { max-width: 94%; padding: 14px 16px; font-size: 14px; }
  .agent-catalog-page { padding: 20px 16px 36px; }
  .agent-catalog-toolbar { align-items: stretch; flex-direction: column; }
  .agent-catalog-search { width: 100%; }
  .agent-catalog-section-head { align-items: flex-start; }
  .agent-catalog-grid { grid-template-columns: 1fr; }
}

@media (max-width: 640px) {
  .app-container { grid-template-rows: 60px 1fr; }
  .header { padding: 0 12px; }
  .brand { gap: 8px; }
  .brand-coordinate-logo,
  body.theme-light .brand-coordinate-logo-light { display: none; }
  .brand-text { font-size: 24px; }
  .theme-toggle-btn { width: 38px; height: 38px; }
  .token-quota-balance { min-height: 38px; padding: 6px 8px; }
  .token-quota-balance span, .header-btn span { display: none; }
  .header-btn { min-height: 38px; padding: 8px 10px; }
  .career-home { --workspace-width: calc(100% - 24px); padding: 6px 0 18px; }
  .career-hero { grid-template-columns: minmax(0, 1fr) 126px; width: var(--workspace-width); height: clamp(205px, 30vh, 235px); min-height: 205px; padding: 0; }
  .career-hero::after { right: 4%; left: 4%; }
  .career-hero-art { width: 100%; height: 100%; object-position: center; }
  .career-hero-visual { margin-left: -10%; overflow: visible; }
  .career-hero-person { top: 3%; right: -7%; width: 112%; height: 104%; }
  .career-hero-search { top: 4%; left: 3%; width: 28%; }
  .career-hero-job { right: 1%; bottom: 11%; width: 29%; }
  .career-quick-actions { grid-template-columns: 1fr; gap: 8px; width: var(--workspace-width); margin: 10px auto 12px; }
  .career-quick-action { min-height: 54px; padding: 10px 14px; border-radius: 9px; font-size: 14px; }
  .career-quick-action svg { width: 20px; height: 20px; }
  .career-chat-panel { width: var(--workspace-width); height: clamp(310px, 48vh, 420px); min-height: 310px; }
  .career-chat-messages { padding: 15px; }
  .career-home .chat-message.assistant { width: 94%; max-width: 94%; }
  .career-home .career-welcome-message { width: 100%; max-width: none; }
  .career-home .career-welcome-message .markdown-content { font-size: 14px; }
  .career-chat-input-area .chat-input { min-height: 36px; }
  .career-chat-input-shell { flex-wrap: wrap; align-items: center; gap: 6px; padding: 0; }
  .career-chat-input-area { margin: 0; padding: 10px 12px 12px; }
  .career-chat-panel:has(.career-chat-messages:empty) .career-chat-input-area { padding: 28px 22px 12px; }
  .career-chat-panel:has(.career-chat-messages:empty) .career-chat-input-area .chat-input { min-height: 0; font-size: 14px; }
  .career-chat-input-row { margin: 0 -12px -12px; padding: 10px 12px 12px; }
  .career-chat-panel:has(.career-chat-messages:empty) .career-chat-input-row { width: calc(100% + 44px); margin: 0 -22px -14px; padding: 10px 22px 14px; }
  .career-home.chat-active .career-chat-messages { padding: 22px 15px; }
  .career-home.chat-active .career-chat-input-area { width: calc(100% - 24px); margin: 12px auto; padding: 7px 9px; border-radius: 14px; }
  .career-home.chat-active .career-chat-input-area .chat-input { min-width: 0; order: initial; }
  .career-home .chat-input { min-width: 100%; }
  .career-home .agent-menu-btn { width: auto; min-width: 68px; padding: 0 10px; font-size: 12px; }
  .career-home .agent-menu-btn::before { content: none; }
  .career-home .send-btn { width: 40px; height: 40px; }
}

@media (min-width: 1024px) and (max-height: 820px) {
  .career-home { padding-top: 8px; }
  .career-hero { height: clamp(285px, 36vh, 310px); min-height: 285px; }
  .career-quick-actions { margin-top: 10px; margin-bottom: 12px; }
  .career-quick-action { min-height: 56px; }
  .career-chat-panel { height: 290px; min-height: 270px; }
}