:root {
    --cpp-blue: #246bdb;
    --cpp-blue-dark: #174ea6;
    --cpp-blue-soft: #eef5ff;
    --cpp-bg: #f5f8fc;
    --cpp-surface: #ffffff;
    --cpp-text: #172033;
    --cpp-muted: #667085;
    --cpp-line: #dce6f5;
    --cpp-success: #16856b;
    --cpp-danger: #e25353;
    --cpp-radius: 12px;
    --cpp-shadow: 0 12px 34px rgba(29, 77, 142, .09);
}

* { box-sizing: border-box; }
html { scroll-behavior: smooth; }
body { margin: 0; color: var(--cpp-text); background: var(--cpp-bg); font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", "PingFang SC", "Microsoft YaHei", sans-serif; }
a { color: inherit; text-decoration: none; }
button, input { font: inherit; }
img { display: block; max-width: 100%; }
.portal-shell { width: min(1200px, calc(100% - 40px)); margin: 0 auto; }

.portal-header { position: sticky; top: 0; z-index: 30; height: 68px; background: rgba(255, 255, 255, .96); border-bottom: 1px solid var(--cpp-line); backdrop-filter: blur(12px); }
.portal-header-inner { height: 100%; display: flex; align-items: center; gap: 34px; }
.portal-brand { display: flex; align-items: center; gap: 10px; min-width: 240px; color: var(--cpp-blue-dark); font-size: 22px; font-weight: 750; white-space: nowrap; }
.portal-brand small { padding-left: 10px; border-left: 1px solid var(--cpp-line); color: var(--cpp-muted); font-size: 12px; font-weight: 500; }
.portal-brand-mark { width: 38px; height: 38px; display: inline-grid; place-items: center; flex: 0 0 auto; color: #fff; background: var(--cpp-blue); border-radius: 10px; font-size: 21px; font-weight: 800; }
.portal-nav { display: flex; align-items: center; gap: 30px; height: 100%; }
.portal-nav a { position: relative; height: 100%; display: flex; align-items: center; color: #344054; font-size: 15px; white-space: nowrap; }
.portal-nav a:hover, .portal-nav a.active { color: var(--cpp-blue); }
.portal-nav a.active:after { content: ""; position: absolute; right: 0; bottom: 0; left: 0; height: 3px; background: var(--cpp-blue); border-radius: 3px 3px 0 0; }
.portal-role-actions { margin-left: auto; display: flex; align-items: center; gap: 16px; white-space: nowrap; }
.portal-role-link { color: var(--cpp-blue-dark); font-weight: 650; }
.portal-login-button { min-width: 104px; height: 38px; display: inline-flex; align-items: center; justify-content: center; padding: 0 18px; color: #fff; background: var(--cpp-blue); border: 1px solid var(--cpp-blue); border-radius: 8px; font-weight: 650; }
.portal-login-button:hover { background: var(--cpp-blue-dark); }
.portal-logout-link { color: #667085; font-size: 13px; }
.portal-logout-link:hover { color: var(--cpp-blue); }
.portal-user-menu { position: relative; }
.portal-user-trigger { height: 42px; display: inline-flex; align-items: center; gap: 9px; padding: 0 11px 0 6px; color: #24324a; background: transparent; border: 1px solid transparent; border-radius: 9px; cursor: pointer; font-weight: 700; }
.portal-user-trigger:hover,.portal-user-menu:focus-within .portal-user-trigger,.portal-user-menu.open .portal-user-trigger { color: var(--cpp-blue-dark); background: var(--cpp-blue-soft); border-color: #d8e7fb; }
.portal-user-avatar { width: 32px; height: 32px; display: grid; place-items: center; flex: 0 0 auto; overflow: hidden; color: #fff; background: var(--cpp-blue); border-radius: 50%; font-size: 13px; }
.portal-user-avatar.large { width: 46px; height: 46px; font-size: 17px; }
.portal-user-avatar img { width: 100%; height: 100%; object-fit: cover; }
.portal-user-avatar b { font: inherit; }
.portal-user-name { max-width: 92px; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-user-chevron { width: 7px; height: 7px; border-right: 1.5px solid currentColor; border-bottom: 1.5px solid currentColor; transform: translateY(-2px) rotate(45deg); transition: transform .16s ease; }
.portal-user-menu:hover .portal-user-chevron,.portal-user-menu:focus-within .portal-user-chevron,.portal-user-menu.open .portal-user-chevron { transform: translateY(2px) rotate(225deg); }
.portal-user-dropdown { position: absolute; top: calc(100% + 10px); right: 0; z-index: 80; width: 286px; padding: 18px; visibility: hidden; background: #fff; border: 1px solid #d9e4f2; border-radius: 12px; box-shadow: 0 18px 48px rgba(27,60,105,.18); opacity: 0; pointer-events: none; transform: translateY(-6px); transition: opacity .16s ease,transform .16s ease,visibility .16s; }
.portal-user-dropdown:before { position: absolute; top: -12px; right: 0; left: 0; height: 12px; content: ""; }
.portal-user-menu:hover .portal-user-dropdown,.portal-user-menu:focus-within .portal-user-dropdown,.portal-user-menu.open .portal-user-dropdown { visibility: visible; opacity: 1; pointer-events: auto; transform: translateY(0); }
.portal-user-summary { display: flex; align-items: center; gap: 12px; padding-bottom: 16px; border-bottom: 1px solid #edf1f7; }
.portal-user-summary strong,.portal-user-summary span { display: block; }
.portal-user-summary strong { max-width: 180px; overflow: hidden; color: var(--cpp-text); text-overflow: ellipsis; white-space: nowrap; }
.portal-user-summary div > span { margin-top: 4px; color: var(--cpp-muted); font-size: 12px; }
.portal-user-links { display: grid; gap: 4px; padding-top: 10px; }
.portal-user-links a { padding: 10px 11px; color: #344054; border-radius: 7px; font-size: 14px; }
.portal-user-links a:hover,.portal-user-links a:focus { color: var(--cpp-blue-dark); background: var(--cpp-blue-soft); }
.portal-user-links .portal-user-logout { margin-top: 5px; padding-top: 12px; color: #667085; border-top: 1px solid #edf1f7; border-radius: 0 0 7px 7px; }
.portal-menu-toggle { display: none; border: 0; color: var(--cpp-blue); background: transparent; }

.portal-search-section { padding: 26px 0 18px; background: linear-gradient(180deg, #edf5ff 0%, var(--cpp-bg) 100%); }
.portal-search-section.compact { padding-bottom: 26px; }
.portal-search { max-width: 900px; height: 56px; display: grid; grid-template-columns: 110px 1fr 120px; margin: 0 auto; overflow: hidden; background: #fff; border: 2px solid var(--cpp-blue); border-radius: 10px; box-shadow: 0 8px 24px rgba(36, 107, 219, .1); }
.portal-search-type { display: flex; align-items: center; justify-content: center; color: #344054; border-right: 1px solid var(--cpp-line); font-weight: 650; }
.portal-search input { min-width: 0; padding: 0 20px; color: var(--cpp-text); border: 0; outline: 0; }
.portal-search input::placeholder { color: #98a2b3; }
.portal-search button { color: #fff; background: var(--cpp-blue); border: 0; font-size: 17px; font-weight: 700; cursor: pointer; }
.portal-search button:hover { background: var(--cpp-blue-dark); }
.portal-hot-searches { max-width: 900px; display: flex; align-items: center; gap: 18px; margin: 13px auto 0; color: #667085; font-size: 13px; overflow-x: auto; white-space: nowrap; }
.portal-hot-searches span { color: #98a2b3; }
.portal-hot-searches a:hover { color: var(--cpp-blue); }

.portal-hero { display: grid; grid-template-columns: 300px minmax(0, 1fr); align-items: start; gap: 18px; padding-top: 10px; }
.portal-category-panel, .portal-banner { height: 340px; min-height: 340px; background: var(--cpp-surface); border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); box-shadow: var(--cpp-shadow); }
.portal-category-panel { display: flex; flex-direction: column; padding: 20px 22px 16px; overflow: hidden; }
.portal-category-panel h2 { margin: 0 0 14px; font-size: 18px; }
.portal-category-list { min-height: 0; display: grid; grid-template-columns: 1fr 1fr; column-gap: 12px; overflow-y: auto; }
.portal-category-list a { min-width: 0; display: flex; align-items: center; justify-content: space-between; gap: 8px; padding: 10px 0; color: #344054; border-bottom: 1px solid #edf1f7; font-size: 14px; }
.portal-category-list a span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-category-list a b { color: #a0aec0; font-size: 11px; font-weight: 500; }
.portal-category-list a:hover, .portal-category-list a:hover b { color: var(--cpp-blue); }
.portal-category-toggle { display: none; }
.portal-all-category { display: block; padding-top: 15px; color: var(--cpp-blue); text-align: center; font-size: 13px; font-weight: 650; }
.portal-banner { position: relative; overflow: hidden; background: #dceaff; }
.portal-banner-slide { position: absolute; inset: 0; opacity: 0; transition: opacity .35s ease; }
.portal-banner-slide.active { opacity: 1; }
.portal-banner-slide img { width: 100%; height: 100%; object-fit: contain; background: #dceaff; }
.portal-banner-copy { position: absolute; right: 26px; bottom: 24px; left: 26px; display: flex; align-items: flex-end; justify-content: space-between; gap: 20px; padding: 16px 20px; color: #fff; background: rgba(16, 55, 111, .84); border-radius: 10px; }
.portal-banner-copy strong { font-size: 22px; }
.portal-banner-copy span { font-size: 14px; }

.portal-section { padding-top: 54px; padding-bottom: 58px; }
.portal-section-heading { display: flex; align-items: flex-end; justify-content: space-between; margin-bottom: 22px; }
.portal-section-heading h2 { margin: 0; font-size: 28px; line-height: 1.2; }
.portal-section-heading p { margin: 8px 0 0; color: var(--cpp-muted); font-size: 14px; }
.portal-section-heading > a { color: var(--cpp-blue); font-weight: 650; }
.portal-job-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.portal-job-card { overflow: hidden; background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); transition: transform .18s ease, border-color .18s ease, box-shadow .18s ease; }
.portal-job-card:hover { transform: translateY(-2px); border-color: #a9c8f4; box-shadow: var(--cpp-shadow); }
.portal-job-main { display: block; min-height: 162px; padding: 20px; }
.portal-job-title { display: flex; align-items: flex-start; justify-content: space-between; gap: 16px; }
.portal-job-title h1, .portal-job-title h2, .portal-job-title h3 { min-width: 0; margin: 0; color: #172033; overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-job-title h3 { font-size: 17px; }
.portal-job-title h2 { font-size: 18px; }
.portal-job-title h1 { font-size: 34px; }
.portal-job-title strong { flex: 0 0 auto; color: var(--cpp-danger); font-size: 17px; }
.portal-job-meta { display: flex; flex-wrap: wrap; gap: 0; margin-top: 14px; color: #667085; font-size: 13px; }
.portal-job-meta span + span:before { content: "/"; margin: 0 8px; color: #c0c8d4; }
.portal-job-meta.large { margin-top: 18px; font-size: 15px; }
.portal-job-tags { display: flex; flex-wrap: wrap; align-items: center; gap: 6px; max-height: 54px; margin-top: 14px; min-height: 24px; overflow: hidden; }
.portal-job-tags span { display: inline-flex; align-items: center; max-width: 132px; height: 24px; padding: 0 8px; overflow: hidden; color: #526071; background: #f5f7fa; border: 1px solid #e5e9ef; border-radius: 4px; text-overflow: ellipsis; white-space: nowrap; font-size: 11px; font-weight: 550; line-height: 1; }
.portal-job-company { min-height: 60px; display: flex; align-items: center; gap: 10px; padding: 12px 20px; background: #fbfcfe; border-top: 1px solid #edf1f7; }
.portal-job-company > a:first-child { min-width: 0; display: flex; align-items: center; gap: 9px; color: #475467; font-size: 13px; }
.portal-job-company img { width: 28px; height: 28px; object-fit: cover; border-radius: 6px; }
.portal-job-company span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-job-actions, .portal-job-row-actions { margin-left: auto; display: flex; align-items: center; gap: 7px; flex: 0 0 auto; }
.portal-job-action { height: 32px; display: inline-flex; align-items: center; justify-content: center; padding: 0 10px; color: #475467; background: #fff; border: 1px solid var(--cpp-line); border-radius: 7px; font-size: 12px; font-weight: 650; white-space: nowrap; }
.portal-job-action:hover { color: var(--cpp-blue); border-color: #9bbce9; }
.portal-job-action.primary { color: #fff; background: var(--cpp-blue); border-color: var(--cpp-blue); }
.portal-job-action.primary:hover { color: #fff; background: var(--cpp-blue-dark); border-color: var(--cpp-blue-dark); }
.portal-job-action.own { color: #176b57; background: #edf9f5; border-color: #b9dfd4; }
.portal-message-button { position: relative; padding: 0; color: #475467; background: transparent; border: 0; cursor: pointer; font: inherit; }
.portal-message-button:hover { color: var(--cpp-blue); }
.portal-unread-badge { position: absolute; top: -10px; right: -14px; min-width: 18px; height: 18px; display: grid; place-items: center; padding: 0 5px; color: #fff; background: var(--cpp-danger); border: 2px solid #fff; border-radius: 10px; font-size: 10px; font-weight: 800; }
.portal-unread-badge[hidden] { display: none; }

.portal-chat-backdrop { position: fixed; inset: 0; z-index: 990; background: rgba(16, 24, 40, .36); }
.portal-chat { position: fixed; right: 28px; bottom: 24px; z-index: 991; width: min(430px, calc(100vw - 32px)); height: min(640px, calc(100vh - 92px)); display: grid; grid-template-rows: auto minmax(0, 1fr) auto auto; overflow: hidden; background: #fff; border: 1px solid #d7e1ef; border-radius: 14px; box-shadow: 0 24px 70px rgba(18, 48, 88, .28); transform: translateY(18px); opacity: 0; pointer-events: none; transition: transform .18s ease, opacity .18s ease; }
.portal-chat.open { transform: translateY(0); opacity: 1; pointer-events: auto; }
.portal-chat [hidden] { display: none !important; }
.portal-chat-header { height: 64px; display: flex; align-items: center; justify-content: space-between; padding: 0 18px; color: #fff; background: var(--cpp-blue); }
.portal-chat-header > div { display: flex; align-items: center; gap: 9px; }
.portal-chat-header button { width: 34px; height: 34px; padding: 0; color: #fff; background: transparent; border: 0; border-radius: 6px; cursor: pointer; font-size: 26px; }
.portal-chat-header button:hover { background: rgba(255, 255, 255, .14); }
.portal-chat-header .portal-chat-back { margin-left: -10px; font-size: 32px; }
.portal-chat-status { width: 8px; height: 8px; background: #f5b942; border-radius: 50%; }
.portal-chat-status.online { background: #43d19e; }
.portal-chat-body { overflow-y: auto; padding: 18px; background: #f5f8fc; }
.portal-chat-sessions { overflow-y: auto; background: #fff; }
.portal-chat-session { width: 100%; display: grid; grid-template-columns: 44px minmax(0, 1fr) auto; align-items: center; gap: 12px; padding: 14px 16px; color: var(--cpp-text); background: #fff; border: 0; border-bottom: 1px solid #edf1f7; cursor: pointer; text-align: left; }
.portal-chat-session:hover { background: #f7faff; }
.portal-chat-session-avatar { width: 44px; height: 44px; display: grid; place-items: center; overflow: hidden; color: var(--cpp-blue); background: var(--cpp-blue-soft); border-radius: 10px; font-weight: 800; }
.portal-chat-session-avatar img { width: 100%; height: 100%; object-fit: cover; }
.portal-chat-session-copy { min-width: 0; display: grid; gap: 5px; }
.portal-chat-session-copy strong, .portal-chat-session-copy span { overflow: hidden; text-overflow: ellipsis; white-space: nowrap; }
.portal-chat-session-copy span { color: var(--cpp-muted); font-size: 12px; }
.portal-chat-session > b { min-width: 20px; height: 20px; display: grid; place-items: center; padding: 0 5px; color: #fff; background: var(--cpp-danger); border-radius: 10px; font-size: 10px; }
.portal-chat-empty { margin: 34px 20px; color: #8a98ad; text-align: center; font-size: 13px; line-height: 1.7; }
.portal-chat-message { max-width: 82%; margin-bottom: 12px; }
.portal-chat-message.mine { margin-left: auto; text-align: right; }
.portal-chat-message time { display: block; margin-bottom: 4px; color: #98a2b3; font-size: 11px; }
.portal-chat-bubble { display: inline-block; padding: 10px 12px; color: #344054; background: #fff; border: 1px solid #e0e7f1; border-radius: 4px 12px 12px; text-align: left; line-height: 1.55; overflow-wrap: anywhere; }
.portal-chat-message.mine .portal-chat-bubble { color: #fff; background: var(--cpp-blue); border-color: var(--cpp-blue); border-radius: 12px 4px 12px 12px; }
.portal-chat-job { display: block; min-width: 230px; padding: 13px; color: #344054; background: #fff; border: 1px solid #d8e5f5; border-radius: 9px; text-align: left; }
.portal-chat-job strong { display: block; margin-bottom: 6px; color: #1d2939; }
.portal-chat-job b { color: var(--cpp-danger); }
.portal-chat-job span { display: block; margin-top: 6px; color: #667085; font-size: 12px; }
.portal-chat-error { padding: 8px 16px; color: #a33737; background: #fff1f0; border-top: 1px solid #ffd6d2; font-size: 12px; }
.portal-chat-compose { display: grid; grid-template-columns: minmax(0, 1fr) 72px; gap: 10px; padding: 12px; border-top: 1px solid #e6ebf2; }
.portal-chat-compose textarea { min-width: 0; resize: none; padding: 10px 12px; border: 1px solid #d5deea; border-radius: 7px; outline: none; font: inherit; line-height: 1.5; }
.portal-chat-compose textarea:focus { border-color: var(--cpp-blue); box-shadow: 0 0 0 3px rgba(36, 111, 223, .1); }
.portal-chat-compose button { color: #fff; background: var(--cpp-blue); border: 0; border-radius: 7px; cursor: pointer; font-weight: 700; }
.portal-chat-compose button:hover { background: var(--cpp-blue-dark); }

.portal-company-section { background: #edf4fe; }
.portal-company-grid { display: grid; grid-template-columns: repeat(3, minmax(0, 1fr)); gap: 16px; }
.portal-company-card { min-width: 0; display: grid; grid-template-columns: 52px minmax(0, 1fr) auto; align-items: center; gap: 14px; padding: 20px; background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); }
.portal-company-card:hover { border-color: #a9c8f4; box-shadow: var(--cpp-shadow); }
.portal-company-logo { width: 52px; height: 52px; display: grid; place-items: center; overflow: hidden; color: var(--cpp-blue); background: var(--cpp-blue-soft); border: 1px solid #d6e6fd; border-radius: 10px; font-size: 20px; font-weight: 800; }
.portal-company-logo.large { width: 74px; height: 74px; border-radius: 14px; }
.portal-company-logo img { width: 100%; height: 100%; object-fit: cover; }
.portal-company-card h3 { margin: 0; overflow: hidden; font-size: 15px; text-overflow: ellipsis; white-space: nowrap; }
.portal-company-card p { margin: 8px 0 0; color: var(--cpp-muted); font-size: 12px; }
.portal-company-card > b { color: var(--cpp-blue); font-size: 12px; }

.portal-list-page { min-height: calc(100vh - 68px); }
.portal-filter-bar { max-width: 1100px; margin: 16px auto 0; background: rgba(255,255,255,.94); border: 1px solid var(--cpp-line); border-radius: 10px; box-shadow: 0 6px 20px rgba(36,107,219,.05); }
.portal-filter-toolbar { min-height: 58px; display: flex; align-items: center; justify-content: space-between; gap: 18px; padding: 10px 14px; }
.portal-filter-groups { min-width: 0; display: flex; align-items: center; gap: 4px; }
.portal-filter-popover { position: relative; }
.portal-filter-popover summary { min-width: 132px; height: 38px; display: flex; align-items: center; gap: 8px; padding: 0 11px; color: #667085; border: 1px solid transparent; border-radius: 7px; cursor: pointer; list-style: none; font-size: 12px; user-select: none; }
.portal-filter-popover summary::-webkit-details-marker { display: none; }
.portal-filter-popover summary:hover,.portal-filter-popover[open] summary { background: #f6f9fd; border-color: #dbe6f4; }
.portal-filter-popover summary strong { min-width: 0; overflow: hidden; color: #253858; text-overflow: ellipsis; white-space: nowrap; font-size: 13px; font-weight: 650; }
.portal-filter-popover summary i { margin-left: auto; color: #98a2b3; font-style: normal; font-size: 14px; transition: transform .16s ease; }
.portal-filter-popover[open] summary i { transform: rotate(180deg); }
.portal-filter-options { position: absolute; top: 46px; left: 0; z-index: 25; width: 330px; display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 5px; padding: 12px; background: #fff; border: 1px solid #dbe4f0; border-radius: 9px; box-shadow: 0 14px 36px rgba(31,62,104,.16); }
.portal-filter-options.city-options { width: 380px; }
.portal-filter-options a { min-width: 0; padding: 8px 9px; overflow: hidden; color: #475467; border-radius: 6px; text-align: center; text-overflow: ellipsis; white-space: nowrap; font-size: 12px; }
.portal-filter-options a:hover,.portal-filter-options a.active { color: var(--cpp-blue); background: var(--cpp-blue-soft); font-weight: 650; }
.portal-sort-tabs { flex: 0 0 auto; display: flex; align-items: center; padding: 3px; background: #f3f6fa; border-radius: 8px; }
.portal-sort-tabs a { height: 32px; display: inline-flex; align-items: center; padding: 0 11px; color: #667085; border-radius: 6px; font-size: 12px; white-space: nowrap; }
.portal-sort-tabs a:hover { color: var(--cpp-blue); }
.portal-sort-tabs a.active { color: var(--cpp-blue); background: #fff; box-shadow: 0 1px 4px rgba(31,62,104,.12); font-weight: 650; }
.portal-selected-filters { min-height: 43px; display: flex; align-items: center; flex-wrap: wrap; gap: 7px; padding: 8px 14px; border-top: 1px solid #edf1f6; }
.portal-selected-filters > span { margin-right: 2px; color: #98a2b3; font-size: 12px; }
.portal-selected-filters a { height: 27px; display: inline-flex; align-items: center; gap: 6px; padding: 0 9px; color: #315f9c; background: #f1f6fd; border: 1px solid #dbe8f8; border-radius: 5px; font-size: 12px; }
.portal-selected-filters a:hover { color: var(--cpp-blue); border-color: #bcd2ef; }
.portal-selected-filters a b { font-size: 15px; font-weight: 400; line-height: 1; }
.portal-selected-filters .clear-all { margin-left: auto; color: #667085; background: transparent; border-color: transparent; }
.portal-list-layout { display: grid; grid-template-columns: 220px minmax(0, 1fr); align-items: start; gap: 20px; padding-top: 28px; padding-bottom: 70px; }
.portal-filter-panel { position: sticky; top: 92px; display: grid; padding: 18px; background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); }
.portal-filter-panel h2 { margin: 0 0 12px; font-size: 17px; }
.portal-filter-panel a { padding: 10px 12px; color: #475467; border-radius: 7px; font-size: 14px; }
.portal-filter-panel a:hover, .portal-filter-panel a.active { color: var(--cpp-blue); background: var(--cpp-blue-soft); font-weight: 650; }
.portal-job-results { min-width: 0; }
.portal-results-heading { display: flex; align-items: baseline; gap: 14px; margin-bottom: 15px; }
.portal-results-heading h1 { margin: 0; font-size: 22px; }
.portal-results-heading span { color: var(--cpp-muted); font-size: 13px; }
.portal-empty-state { min-height: 360px; display: flex; flex-direction: column; align-items: center; justify-content: center; padding: 52px 24px; color: var(--cpp-muted); background: linear-gradient(145deg,#fff 0%,#f8fbff 100%); border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); box-shadow: 0 12px 34px rgba(29,77,142,.06); text-align: center; }
.portal-empty-mark { position: relative; width: 82px; height: 82px; display: grid; place-items: center; margin-bottom: 22px; color: var(--cpp-blue); background: var(--cpp-blue-soft); border: 1px solid #d5e6fd; border-radius: 50%; font-size: 28px; font-weight: 800; }
.portal-empty-mark:after { position: absolute; right: -2px; bottom: 3px; width: 25px; height: 25px; display: grid; place-items: center; color: #fff; background: var(--cpp-blue); border: 3px solid #fff; border-radius: 50%; content: "+"; font-size: 16px; }
.portal-empty-state strong { display: block; color: var(--cpp-text); font-size: 20px; }
.portal-empty-state p { max-width: 480px; margin: 12px 0 24px; line-height: 1.75; }
.portal-empty-actions { display: flex; justify-content: center; gap: 10px; }
.portal-empty-actions a { height: 40px; display: inline-flex; align-items: center; justify-content: center; padding: 0 18px; color: #475467; background: #fff; border: 1px solid var(--cpp-line); border-radius: 8px; font-weight: 650; }
.portal-empty-actions a:hover { color: var(--cpp-blue); border-color: #9bbce9; }
.portal-empty-actions a.primary { color: #fff; background: var(--cpp-blue); border-color: var(--cpp-blue); }
.portal-empty-actions a.primary:hover { color: #fff; background: var(--cpp-blue-dark); border-color: var(--cpp-blue-dark); }
.portal-job-row { display: grid; grid-template-columns: minmax(0, 1fr) 220px; gap: 20px; margin-bottom: 12px; padding: 22px; background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); }
.portal-job-row:hover { border-color: #a9c8f4; box-shadow: 0 8px 24px rgba(29, 77, 142, .07); }
.portal-job-row-company { display: flex; flex-direction: column; align-items: flex-start; justify-content: center; gap: 10px; padding-left: 20px; border-left: 1px solid #edf1f7; color: var(--cpp-muted); font-size: 13px; }
.portal-job-row-company > a:first-child { color: #344054; font-weight: 650; }
.portal-job-row-actions { margin-left: 0; }
.portal-pagination { margin-top: 24px; }
.portal-pagination ul { display: flex; justify-content: center; gap: 6px; padding: 0; list-style: none; }
.portal-pagination li a, .portal-pagination li span { min-width: 36px; height: 36px; display: grid; place-items: center; padding: 0 10px; background: #fff; border: 1px solid var(--cpp-line); border-radius: 7px; }
.portal-pagination li.active span { color: #fff; background: var(--cpp-blue); border-color: var(--cpp-blue); }

.portal-job-hero, .portal-company-hero { padding: 42px 0; background: linear-gradient(135deg, #eaf3ff 0%, #f8fbff 100%); border-bottom: 1px solid var(--cpp-line); }
.portal-job-hero { padding: 36px 0 34px; }
.portal-job-hero-inner { display: grid; grid-template-columns: minmax(0, 1fr) 330px; align-items: center; gap: 56px; }
.portal-job-hero-copy { min-width: 0; }
.portal-job-hero .portal-job-title { align-items: baseline; justify-content: flex-start; gap: 22px; }
.portal-job-hero .portal-job-title h1 { flex: 0 1 auto; max-width: min(720px, 72vw); line-height: 1.25; }
.portal-job-hero .portal-job-title strong { font-size: 19px; line-height: 1; white-space: nowrap; }
.portal-job-hero .portal-job-meta.large { margin-top: 14px; }
.portal-job-hero .portal-job-tags { max-height: none; min-height: 0; margin-top: 14px; }
.portal-job-tags span[data-benefit-id="3"],
.portal-job-tags span[data-benefit-id="5"],
.portal-job-tags span[data-benefit-id="41"] { color: #2b66b1; background: #eef5ff; border-color: #d9e8fb; }
.portal-job-tags span[data-benefit-id="14"],
.portal-job-tags span[data-benefit-id="33"],
.portal-job-tags span[data-benefit-id="37"],
.portal-job-tags span[data-benefit-id="42"] { color: #28755c; background: #eef8f3; border-color: #d8eee4; }
.portal-job-tags span[data-benefit-id="23"],
.portal-job-tags span[data-benefit-id="24"],
.portal-job-tags span[data-benefit-id="29"],
.portal-job-tags span[data-benefit-id="34"],
.portal-job-tags span[data-benefit-id="36"],
.portal-job-tags span[data-benefit-id="38"],
.portal-job-tags span[data-benefit-id="39"],
.portal-job-tags span[data-benefit-id="40"] { color: #94611a; background: #fff7e9; border-color: #f4e4c4; }
.portal-job-tags span[data-benefit-id="43"] { color: #7551a2; background: #f5f1fb; border-color: #e8ddf4; }
.portal-primary-cta { min-width: 150px; height: 48px; display: inline-flex; align-items: center; justify-content: center; color: #fff; background: var(--cpp-blue); border-radius: 8px; font-weight: 700; }
.portal-primary-cta:hover { background: var(--cpp-blue-dark); }
.portal-job-cta-group { display: grid; grid-template-columns: 1fr 1fr; gap: 9px; width: 330px; }
.portal-job-cta-group .portal-primary-cta { grid-column: 1 / -1; border: 1px solid var(--cpp-blue); cursor: pointer; }
.portal-job-cta-group .portal-primary-cta:disabled { color: #667085; background: #e8edf5; border-color: #e8edf5; cursor: default; }
.portal-secondary-cta { height: 42px; display: inline-flex; align-items: center; justify-content: center; color: var(--cpp-blue); background: #fff; border: 1px solid #a9c8f4; border-radius: 8px; cursor: pointer; font-weight: 700; }
.portal-secondary-cta:hover, .portal-secondary-cta.active { color: var(--cpp-blue-dark); background: var(--cpp-blue-soft); }
.portal-secondary-cta.chat { color: #fff; background: #16856b; border-color: #16856b; }
.portal-secondary-cta.chat:hover { background: #0f6f59; }
.portal-job-updated { margin: 16px 0 0; color: #667085; font-size: 12px; }
.portal-detail-layout { display: grid; grid-template-columns: minmax(0, 1fr) 340px; align-items: start; gap: 22px; padding-top: 28px; padding-bottom: 72px; }
.portal-detail-content, .portal-detail-aside > *, .portal-company-jobs { background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); }
.portal-detail-content { padding: 30px; }
.portal-detail-content section + section { margin-top: 34px; padding-top: 28px; border-top: 1px solid #edf1f7; }
.portal-detail-content h2, .portal-detail-aside h2, .portal-company-jobs h2 { margin: 0 0 18px; font-size: 19px; }
.portal-job-overview-compact { display: grid; grid-template-columns: auto minmax(0, 1fr); align-items: center; gap: 20px; padding: 18px 20px !important; }
.portal-job-overview-compact > h2 { margin: 0; padding-right: 20px; border-right: 1px solid #dce6f2; white-space: nowrap; }
.portal-job-overview { display: grid; grid-template-columns: minmax(132px, 1.45fr) repeat(5, minmax(76px, 1fr)); margin: 0; }
.portal-job-overview > div { min-width: 0; padding: 3px 13px; border-right: 1px solid #e3edf8; }
.portal-job-overview > div:last-child { border-right: 0; }
.portal-job-overview dt { margin-bottom: 5px; color: var(--cpp-muted); font-size: 11px; }
.portal-job-overview dd { margin: 0; overflow: hidden; color: var(--cpp-text); font-size: 14px; font-weight: 700; text-overflow: ellipsis; white-space: nowrap; }
.portal-rich-text, .portal-detail-content p { color: #475467; font-size: 15px; line-height: 1.9; white-space: normal; }
.portal-location-heading { display: flex; align-items: flex-start; justify-content: space-between; gap: 18px; margin-bottom: 16px; }
.portal-location-heading h2 { margin-bottom: 8px; }
.portal-location-heading p { margin: 0; }
.portal-job-map-wrap { position: relative; height: 286px; overflow: hidden; isolation: isolate; background: #e8f1fb; border: 1px solid #ccdcf1; border-radius: 10px; }
.portal-job-map-crop { position: absolute; inset: 0; overflow: hidden; background: #e8f1fb; }
.portal-job-map-crop:after { position: absolute; inset: 0; content: ""; background: linear-gradient(90deg, rgba(232, 241, 251, .22), transparent 55%), linear-gradient(0deg, rgba(20, 35, 58, .08), transparent 42%); pointer-events: none; }
.portal-job-map { position: absolute; top: -278px; left: -316px; width: calc(100% + 316px); max-width: none; height: 700px; display: block; border: 0; pointer-events: none; }
.portal-job-map-wrap.is-exact .portal-job-map { top: -410px; height: 830px; }
.portal-map-card { position: absolute; left: 18px; bottom: 18px; z-index: 1; width: min(360px, calc(100% - 36px)); padding: 17px 18px; background: rgba(255, 255, 255, .96); border: 1px solid rgba(207, 220, 238, .96); border-radius: 9px; box-shadow: 0 10px 28px rgba(29, 77, 142, .14); }
.portal-map-kicker { display: block; margin-bottom: 7px; color: var(--cpp-blue); font-size: 12px; font-weight: 700; }
.portal-map-card strong { display: block; color: var(--cpp-text); font-size: 17px; line-height: 1.45; }
.portal-map-card p { margin: 5px 0 12px; color: var(--cpp-muted); font-size: 12px; line-height: 1.6; }
.portal-map-card a { height: 34px; display: inline-flex; align-items: center; justify-content: center; padding: 0 13px; color: #fff; background: var(--cpp-blue); border-radius: 7px; font-size: 12px; font-weight: 700; }
.portal-map-card a:hover { color: #fff; background: var(--cpp-blue-dark); }
.portal-safety { display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 20px; background: #fff9ed; border: 1px solid #f4dfb4 !important; border-radius: 9px; }
.portal-safety h2 { color: #8b5b12; }
.portal-safety p { margin: 0; color: #7a5a27; }
.portal-safety-actions { display: flex; gap: 8px; flex: 0 0 auto; }
.portal-safety-actions button, .portal-safety-actions a { padding: 8px 10px; color: #7a5a27; background: #fff; border: 1px solid #e7cc96; border-radius: 7px; cursor: pointer; font-size: 12px; }
.portal-detail-aside { display: grid; gap: 18px; }
.portal-recruiter-card { display: grid; grid-template-columns: 50px minmax(0, 1fr); gap: 13px; padding: 22px; }
.portal-recruiter-avatar { width: 50px; height: 50px; display: grid; place-items: center; overflow: hidden; color: #fff; background: linear-gradient(135deg,var(--cpp-blue),#58a1ff); border-radius: 50%; font-weight: 800; }
.portal-recruiter-avatar img { width: 100%; height: 100%; object-fit: cover; }
.portal-recruiter-kicker { color: var(--cpp-muted); font-size: 11px; }
.portal-recruiter-card h2 { margin: 5px 0 7px; font-size: 17px; }
.portal-recruiter-card p { margin: 0; color: var(--cpp-muted); font-size: 12px; line-height: 1.6; }
.portal-recruiter-card p b { color: var(--cpp-success); }
.portal-company-summary { display: block; padding: 22px 24px; }
.portal-company-summary h2 { margin: 0 0 12px; line-height: 1.45; }
.portal-company-summary p { display: -webkit-box; margin: 0 0 16px; overflow: hidden; color: var(--cpp-muted); font-size: 13px; line-height: 1.7; -webkit-box-orient: vertical; -webkit-line-clamp: 3; }
.portal-company-summary b { color: var(--cpp-blue); font-size: 13px; }
.portal-related { padding: 22px; }
.portal-related a { display: flex; justify-content: space-between; gap: 12px; padding: 12px 0; border-top: 1px solid #edf1f7; font-size: 13px; }
.portal-related a strong { color: var(--cpp-danger); }
.portal-related-empty { display: grid; justify-items: start; gap: 7px; padding-top: 16px; border-top: 1px solid #edf1f7; }
.portal-related-empty > span { width: 34px; height: 34px; display: grid; place-items: center; color: var(--cpp-blue); background: var(--cpp-blue-soft); border-radius: 9px; font-weight: 800; }
.portal-related-empty strong { color: var(--cpp-text); font-size: 14px; }
.portal-related-empty p { margin: 0; color: var(--cpp-muted); font-size: 12px; line-height: 1.6; }
.portal-related-empty a { display: inline-flex; padding: 0; color: var(--cpp-blue); border: 0; font-weight: 700; }
.portal-own-job-note { max-width: 330px; color: var(--cpp-muted); font-size: 12px; line-height: 1.6; text-align: center; }

.portal-employer-page { min-height: calc(100vh - 64px); background: #f5f9ff; }
.portal-employer-hero { padding: 58px 0; background: linear-gradient(135deg,#e8f2ff 0%,#f8fbff 62%,#edf5ff 100%); border-bottom: 1px solid var(--cpp-line); }
.portal-employer-hero-inner { display: grid; grid-template-columns: minmax(0,1.08fr) minmax(360px,.72fr); align-items: center; gap: 64px; }
.portal-employer-copy { max-width: 680px; }
.portal-employer-kicker { color: var(--cpp-blue); font-size: 13px; font-weight: 700; }
.portal-employer-copy h1 { margin: 13px 0 18px; color: var(--cpp-text); font-size: 40px; line-height: 1.2; }
.portal-employer-copy p { max-width: 640px; margin: 0; color: #526079; font-size: 16px; line-height: 1.85; }
.portal-employer-actions { display: flex; flex-wrap: wrap; gap: 12px; margin-top: 30px; }
.portal-employer-primary,.portal-employer-secondary { min-height: 48px; display: inline-flex; align-items: center; justify-content: center; padding: 0 22px; border-radius: 8px; font-weight: 700; }
.portal-employer-primary { color: #fff; background: var(--cpp-blue); border: 1px solid var(--cpp-blue); }
.portal-employer-primary:hover { color: #fff; background: var(--cpp-blue-dark); }
.portal-employer-secondary { color: var(--cpp-blue); background: #fff; border: 1px solid #a9c8f4; }
.portal-employer-copy small { display: block; margin-top: 18px; color: #7a8699; font-size: 12px; line-height: 1.7; }
.portal-employer-guide { padding: 28px; background: #fff; border: 1px solid #d6e4f5; border-radius: 12px; box-shadow: 0 18px 48px rgba(29,77,142,.1); }
.portal-employer-guide h2 { margin: 0 0 20px; font-size: 21px; }
.portal-employer-guide ol { display: grid; gap: 18px; margin: 0; padding: 0; list-style: none; }
.portal-employer-guide li { display: grid; grid-template-columns: 32px minmax(0,1fr); gap: 13px; }
.portal-employer-guide li > b { width: 32px; height: 32px; display: grid; place-items: center; color: var(--cpp-blue); background: var(--cpp-blue-soft); border-radius: 8px; }
.portal-employer-guide strong,.portal-employer-guide span { display: block; }
.portal-employer-guide strong { margin-bottom: 5px; color: var(--cpp-text); font-size: 15px; }
.portal-employer-guide span { color: var(--cpp-muted); font-size: 13px; line-height: 1.65; }
.portal-employer-details { display: grid; grid-template-columns: 1fr 1fr; gap: 22px; padding-top: 34px; padding-bottom: 64px; }
.portal-employer-details > div { padding: 28px; background: #fff; border: 1px solid var(--cpp-line); border-radius: 12px; }
.portal-employer-details h2 { margin: 0 0 18px; font-size: 20px; }
.portal-employer-details ul { display: grid; grid-template-columns: 1fr 1fr; gap: 12px 28px; margin: 0; padding-left: 18px; color: #526079; font-size: 14px; }
.portal-employer-details p { margin: 0 0 15px; color: #526079; font-size: 14px; line-height: 1.8; }
.portal-employer-details a { color: var(--cpp-blue); font-size: 14px; font-weight: 700; }

.portal-company-hero-inner { display: flex; align-items: center; gap: 22px; }
.portal-company-hero h1 { margin: 0 0 14px; font-size: 30px; }
.portal-company-meta { display: flex; flex-wrap: wrap; gap: 8px; }
.portal-company-meta span { padding: 5px 10px; color: #4d6590; background: #fff; border: 1px solid #d6e6fd; border-radius: 5px; font-size: 12px; }
.portal-company-verified { display: inline-flex; margin-bottom: 9px; padding: 4px 9px; color: #116b58; background: #e9f8f3; border: 1px solid #bfe9dc; border-radius: 12px; font-size: 11px; font-weight: 700; }
.portal-company-facts { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); overflow: hidden; padding: 0 !important; border: 1px solid #dce9f8 !important; border-radius: 10px; }
.portal-company-facts > div { display: grid; gap: 7px; padding: 20px; background: #f8fbff; border-right: 1px solid #dce9f8; }
.portal-company-facts > div:last-child { border-right: 0; }
.portal-company-facts strong { color: var(--cpp-blue-dark); font-size: 21px; }
.portal-company-facts span, .portal-company-full-name { color: var(--cpp-muted); font-size: 12px; }
.portal-company-environment { display: grid; grid-template-columns: repeat(3,minmax(0,1fr)); gap: 10px; }
.portal-company-environment a { overflow: hidden; aspect-ratio: 4/3; background: #edf3fb; border-radius: 9px; }
.portal-company-environment img { width: 100%; height: 100%; object-fit: cover; transition: transform .18s ease; }
.portal-company-environment a:hover img { transform: scale(1.03); }
.portal-company-environment-empty { padding: 34px 22px; color: var(--cpp-muted); background: #f8fbff; border: 1px dashed #c9d9ee; border-radius: 9px; text-align: center; }
.portal-company-environment-empty strong { color: var(--cpp-text); }
.portal-company-environment-empty p { max-width: 560px; margin: 8px auto 0; font-size: 13px; line-height: 1.7; }
.portal-company-jobs-heading { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 6px; }
.portal-company-jobs-heading h2 { margin-bottom: 5px; }
.portal-company-jobs-heading span { color: var(--cpp-muted); font-size: 12px; }
.portal-company-jobs-heading > b { padding: 5px 8px; color: #116b58; background: #e9f8f3; border-radius: 5px; font-size: 11px; }
.portal-company-jobs { padding: 22px; }
.portal-company-jobs > a { display: flex; justify-content: space-between; gap: 14px; padding: 16px 0; border-top: 1px solid #edf1f7; }
.portal-company-jobs > a div { display: grid; gap: 7px; }
.portal-company-jobs span { color: var(--cpp-muted); font-size: 12px; }
.portal-company-jobs b { color: var(--cpp-danger); font-size: 14px; }

.portal-legal-page { padding: 36px 0 70px; }
.portal-legal-content { padding: 38px 44px; background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); box-shadow: 0 8px 28px rgba(29, 77, 142, .06); color: #344054; line-height: 1.85; }
.portal-legal-content h1 { margin: 0 0 24px; color: #172033; font-size: 30px; }
.portal-legal-content h2, .portal-legal-content h3 { margin: 30px 0 12px; color: #172033; }
.portal-legal-content p, .portal-legal-content li { font-size: 15px; }
.portal-help-page { min-height: calc(100vh - 68px); padding: 32px 0 70px; }
.portal-help-layout { display: grid; grid-template-columns: 250px minmax(0, 1fr); align-items: start; gap: 20px; }
.portal-help-menu, .portal-help-content { background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); }
.portal-help-menu { display: grid; overflow: hidden; }
.portal-help-menu h1 { margin: 0; padding: 22px; font-size: 22px; border-bottom: 1px solid #edf1f7; }
.portal-help-menu a { padding: 13px 22px; color: #475467; border-left: 3px solid transparent; font-size: 14px; }
.portal-help-menu a:hover, .portal-help-menu a.active { color: var(--cpp-blue); background: var(--cpp-blue-soft); border-left-color: var(--cpp-blue); }
.portal-help-content { min-height: 420px; padding: 30px 34px; }
.portal-help-content h2 { margin: 0 0 24px; font-size: 25px; }
.portal-help-content img { max-width: 100%; height: auto; }

.portal-center-page { min-height: calc(100vh - 68px); }
.portal-center-hero { padding: 36px 0; color: #fff; background: linear-gradient(120deg,#174ea6,#347fe9); }
.portal-center-hero span { font-size: 12px; opacity: .82; }
.portal-center-hero h1 { margin: 8px 0 5px; font-size: 28px; }
.portal-center-hero p { margin: 0; opacity: .82; }
.portal-center-layout { display: grid; grid-template-columns: 220px minmax(0,1fr); align-items: start; gap: 20px; padding-top: 28px; padding-bottom: 70px; }
.portal-center-nav { position: sticky; top: 92px; display: grid; padding: 18px; background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); }
.portal-center-nav strong { padding: 4px 10px 12px; }
.portal-center-nav a { display: flex; justify-content: space-between; padding: 11px 10px; color: #475467; border-radius: 7px; font-size: 14px; }
.portal-center-nav a:hover { color: var(--cpp-blue); background: var(--cpp-blue-soft); }
.portal-center-nav a span { color: #98a2b3; }
.portal-center-content { display: grid; gap: 18px; }
.portal-center-card { padding: 26px; background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); }
.portal-center-card > header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 16px; }
.portal-center-card h2 { margin: 5px 0 0; font-size: 21px; }
.portal-center-card > header > a { color: var(--cpp-blue); font-size: 13px; font-weight: 700; }
.portal-center-kicker { color: var(--cpp-blue); font-size: 11px; font-weight: 700; }
.portal-resume-summary { display: grid; grid-template-columns: minmax(0,1fr) 330px; align-items: center; gap: 40px; }
.portal-resume-summary p { margin: 9px 0 0; color: var(--cpp-muted); font-size: 13px; }
.portal-resume-progress strong { color: var(--cpp-blue); font-size: 25px; }
.portal-resume-progress > div { height: 8px; margin: 10px 0; overflow: hidden; background: #e8eef7; border-radius: 4px; }
.portal-resume-progress > div span { height: 100%; display: block; background: linear-gradient(90deg,var(--cpp-blue),#5ca3ff); border-radius: 4px; }
.portal-resume-progress small { color: var(--cpp-muted); line-height: 1.5; }
.portal-resume-edit-entry { display: inline-flex; align-items: center; justify-content: center; height: 38px; margin-top: 16px; padding: 0 16px; color: #fff; background: var(--cpp-blue); border-radius: 7px; font-size: 13px; font-weight: 700; }
.portal-resume-edit-entry:hover { color: #fff; background: #175dc3; }
.portal-center-list { border-top: 1px solid #edf1f7; }
.portal-center-list > a, .portal-center-row { min-height: 76px; display: flex; align-items: center; justify-content: space-between; gap: 20px; padding: 14px 2px; border-bottom: 1px solid #edf1f7; }
.portal-center-list > a > div, .portal-center-row > div, .portal-center-row > a { min-width: 0; display: grid; gap: 7px; }
.portal-center-list strong, .portal-center-row strong { color: var(--cpp-text); }
.portal-center-list span, .portal-center-row span, .portal-center-list time, .portal-center-row time { color: var(--cpp-muted); font-size: 12px; }
.portal-center-list b, .portal-center-row b { color: var(--cpp-blue); font-size: 13px; text-align: right; }
.portal-center-row button, .portal-blocked-list button { padding: 6px 9px; color: #667085; background: #fff; border: 1px solid var(--cpp-line); border-radius: 6px; cursor: pointer; font-size: 11px; }
.portal-center-empty { padding: 42px 20px; color: var(--cpp-muted); background: #f8fbff; border-radius: 9px; text-align: center; }
.portal-center-empty.compact { padding: 20px; }
.portal-center-empty strong { color: var(--cpp-text); }
.portal-center-empty p { margin: 8px 0 16px; font-size: 13px; }
.portal-center-empty a { color: var(--cpp-blue); font-weight: 700; }
.portal-blocked-list { display: grid; border-top: 1px solid #edf1f7; }
.portal-blocked-list > div { display: flex; align-items: center; justify-content: space-between; padding: 14px 2px; border-bottom: 1px solid #edf1f7; }

.portal-resume-editor { min-height: calc(100vh - 68px); padding: 30px 0 72px; background: #f4f7fb; }
.portal-resume-editor-head { display: grid; grid-template-columns: minmax(0,1fr) 360px; align-items: center; gap: 48px; margin-bottom: 22px; padding: 26px 30px; background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); }
.portal-resume-editor-head a { color: var(--cpp-blue); font-size: 13px; font-weight: 700; }
.portal-resume-editor-head h1 { margin: 10px 0 5px; font-size: 29px; }
.portal-resume-editor-head p { margin: 0; color: var(--cpp-muted); font-size: 13px; }
.portal-resume-editor-status { display: grid; grid-template-columns: 1fr auto; align-items: center; gap: 8px 14px; }
.portal-resume-editor-status > span { color: var(--cpp-muted); font-size: 12px; }
.portal-resume-editor-status > strong { color: var(--cpp-blue); font-size: 22px; }
.portal-resume-editor-status > div { grid-column: 1 / -1; height: 7px; overflow: hidden; background: #e7edf6; border-radius: 4px; }
.portal-resume-editor-status > div i { display: block; height: 100%; background: var(--cpp-blue); border-radius: 4px; transition: width .25s ease; }
.portal-resume-editor-status button { grid-column: 1 / -1; justify-self: end; padding: 0; color: var(--cpp-blue); background: transparent; border: 0; cursor: pointer; font-size: 12px; font-weight: 700; }
.portal-resume-editor-layout { display: grid; grid-template-columns: 210px minmax(0,1fr); align-items: start; gap: 20px; }
.portal-resume-editor-nav { position: sticky; top: 88px; display: grid; padding: 14px; background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); }
.portal-resume-editor-nav strong { padding: 8px 10px 13px; font-size: 15px; }
.portal-resume-editor-nav a { padding: 11px 10px; color: #475467; border-radius: 7px; font-size: 13px; }
.portal-resume-editor-nav a:hover { color: var(--cpp-blue); background: var(--cpp-blue-soft); }
.portal-resume-editor-content { display: grid; gap: 18px; }
.portal-resume-section { scroll-margin-top: 84px; padding: 27px 30px; background: #fff; border: 1px solid var(--cpp-line); border-radius: var(--cpp-radius); }
.portal-resume-section > header { display: flex; align-items: flex-start; justify-content: space-between; margin-bottom: 24px; padding-bottom: 18px; border-bottom: 1px solid #edf1f7; }
.portal-resume-section > header h2 { margin: 0 0 5px; font-size: 21px; }
.portal-resume-section > header p { margin: 0; color: var(--cpp-muted); font-size: 12px; }
.portal-resume-section > header > span { padding: 4px 7px; color: #175dc3; background: #eaf3ff; border-radius: 5px; font-size: 10px; font-weight: 700; }
.portal-resume-section form { display: grid; gap: 20px; }
.portal-resume-records { display: grid; gap: 14px; }
.portal-resume-records > form { padding: 20px; background: #f8fafc; border: 1px solid #e4eaf2; border-radius: 10px; }
.portal-resume-form-grid { display: grid; grid-template-columns: repeat(2,minmax(0,1fr)); gap: 18px 20px; }
.portal-resume-form-grid.compact { gap: 15px 18px; }
.portal-resume-form-grid label, .portal-resume-summary-input { display: grid; gap: 8px; color: #344054; font-size: 12px; font-weight: 700; }
.portal-resume-form-grid label.wide { grid-column: 1 / -1; }
.portal-resume-form-grid input, .portal-resume-form-grid select, .portal-resume-form-grid textarea, .portal-resume-summary-input textarea { width: 100%; padding: 11px 12px; color: var(--cpp-text); background: #fff; border: 1px solid #d5deeb; border-radius: 7px; outline: 0; resize: vertical; font: inherit; font-weight: 400; }
.portal-resume-form-grid input, .portal-resume-form-grid select { height: 42px; }
.portal-resume-form-grid input:focus, .portal-resume-form-grid select:focus, .portal-resume-form-grid textarea:focus, .portal-resume-summary-input textarea:focus { border-color: var(--cpp-blue); box-shadow: 0 0 0 3px rgba(36,107,219,.09); }
.portal-search-select { position: relative; min-width: 0; }
.portal-search-select > input { padding-right: 34px; background-image: linear-gradient(45deg,transparent 50%,#7a8699 50%),linear-gradient(135deg,#7a8699 50%,transparent 50%); background-position: calc(100% - 17px) 18px,calc(100% - 12px) 18px; background-repeat: no-repeat; background-size: 5px 5px,5px 5px; }
.portal-search-select-native { position: absolute !important; width: 1px !important; height: 1px !important; margin: -1px !important; padding: 0 !important; overflow: hidden !important; clip: rect(0 0 0 0); border: 0 !important; opacity: 0; }
.portal-search-select-options { position: absolute; top: calc(100% + 6px); right: 0; left: 0; z-index: 18; max-height: 260px; overflow-y: auto; padding: 6px; background: #fff; border: 1px solid #cad8eb; border-radius: 9px; box-shadow: 0 14px 34px rgba(24,62,112,.16); }
.portal-search-select-options[hidden] { display: none; }
.portal-search-select-options button { width: 100%; min-height: 36px; display: block; padding: 7px 9px; color: #344054; background: transparent; border: 0; border-radius: 6px; cursor: pointer; text-align: left; font-size: 13px; }
.portal-search-select-options button:hover,.portal-search-select-options button:focus { color: var(--cpp-blue-dark); background: var(--cpp-blue-soft); outline: 0; }
.portal-search-select-empty { display: block; padding: 16px 10px; color: var(--cpp-muted); text-align: center; font-size: 12px; }
.portal-resume-section form > footer { display: flex; align-items: center; justify-content: flex-end; gap: 12px; padding-top: 4px; }
.portal-resume-section form > footer span { margin-right: auto; color: #98a2b3; font-size: 11px; }
.portal-resume-section form > footer span.saved { color: #16856b; }
.portal-resume-section form > footer button, .portal-resume-add { height: 38px; padding: 0 17px; color: #fff; background: var(--cpp-blue); border: 1px solid var(--cpp-blue); border-radius: 7px; cursor: pointer; font-weight: 700; }
.portal-resume-section form > footer button.secondary { color: #475467; background: #fff; border-color: #d5deeb; }
.portal-resume-section form > footer button.danger { margin-right: auto; color: #b42332; background: #fff; border-color: #f0c8ce; }
.portal-resume-section form > footer button.danger + span { margin-right: auto; margin-left: 0; }
.portal-resume-add { justify-self: start; color: var(--cpp-blue); background: #fff; border-color: #bdd2ef; }
.portal-resume-summary-input { position: relative; }
.portal-resume-summary-input span { position: absolute; right: 12px; bottom: 10px; color: #98a2b3; font-size: 10px; font-weight: 400; }
.portal-resume-qr-modal { position: fixed; inset: 0; z-index: 1200; display: grid; place-items: center; padding: 20px; background: rgba(16,24,40,.52); }
.portal-resume-qr-modal[hidden] { display: none; }
.portal-resume-qr-modal > div { position: relative; width: min(390px,100%); padding: 30px; background: #fff; border-radius: 14px; box-shadow: 0 24px 80px rgba(18,48,88,.28); text-align: center; }
.portal-resume-qr-modal > div > button { position: absolute; top: 12px; right: 12px; width: 34px; height: 34px; color: #667085; background: transparent; border: 0; cursor: pointer; font-size: 26px; }
.portal-resume-qr-modal h2 { margin: 0 0 8px; font-size: 22px; }
.portal-resume-qr-modal p { margin: 0 0 20px; color: var(--cpp-muted); font-size: 13px; line-height: 1.7; }
.portal-resume-qr-modal img { width: 220px; height: 220px; object-fit: contain; }
.portal-resume-qr-modal [data-resume-qr-content] span { color: var(--cpp-muted); font-size: 13px; }

.portal-modal-backdrop { position: fixed; inset: 0; z-index: 995; background: rgba(16,24,40,.42); }
.portal-modal { position: fixed; top: 50%; left: 50%; z-index: 996; width: min(520px,calc(100vw - 32px)); overflow: hidden; background: #fff; border-radius: 14px; box-shadow: 0 24px 80px rgba(18,48,88,.3); transform: translate(-50%,-50%); }
.portal-modal header { height: 62px; display: flex; align-items: center; justify-content: space-between; padding: 0 22px; border-bottom: 1px solid var(--cpp-line); }
.portal-modal h2 { margin: 0; font-size: 19px; }
.portal-modal header button { width: 34px; height: 34px; color: #667085; background: transparent; border: 0; cursor: pointer; font-size: 25px; }
.portal-modal form { display: grid; gap: 17px; padding: 22px; }
.portal-modal label { display: grid; gap: 8px; color: #344054; font-size: 13px; font-weight: 650; }
.portal-modal input, .portal-modal select, .portal-modal textarea { width: 100%; padding: 10px 12px; color: var(--cpp-text); background: #fff; border: 1px solid #d6e0ee; border-radius: 7px; outline: 0; resize: vertical; font: inherit; }
.portal-modal input:focus, .portal-modal select:focus, .portal-modal textarea:focus { border-color: var(--cpp-blue); box-shadow: 0 0 0 3px rgba(36,107,219,.1); }
.portal-modal-actions { display: flex; justify-content: flex-end; gap: 9px; }
.portal-modal-actions button { height: 38px; padding: 0 17px; color: #475467; background: #fff; border: 1px solid var(--cpp-line); border-radius: 7px; cursor: pointer; font-weight: 700; }
.portal-modal-actions button.primary { color: #fff; background: var(--cpp-blue); border-color: var(--cpp-blue); }
.portal-toast { position: fixed; top: 88px; left: 50%; z-index: 1100; min-width: 220px; max-width: calc(100vw - 32px); padding: 12px 18px; color: #fff; background: #16856b; border-radius: 8px; box-shadow: 0 12px 34px rgba(29,77,142,.2); transform: translateX(-50%); text-align: center; font-size: 13px; font-weight: 700; }
.portal-toast.error { background: #c23c49; }

.portal-footer { color: #b8c5d8; background: #14233a; }
.portal-footer-grid { display: grid; grid-template-columns: 1.2fr .8fr 1fr; gap: 60px; padding-top: 42px; padding-bottom: 34px; }
.portal-footer-brand { display: flex; align-items: center; gap: 12px; color: #fff; font-size: 19px; }
.portal-footer p { max-width: 420px; color: #94a7c1; font-size: 13px; line-height: 1.8; }
.portal-footer-links { display: grid; align-content: start; gap: 12px; font-size: 13px; }
.portal-footer-links a:hover { color: #fff; }
.portal-footer-bottom { padding: 18px 0 24px; border-top: 1px solid rgba(255,255,255,.09); color: #8296b2; font-size: 12px; }

@media (max-width: 1024px) {
    .portal-brand { min-width: auto; }
    .portal-brand small { display: none; }
    .portal-nav { gap: 18px; }
    .portal-filter-toolbar { align-items: stretch; flex-direction: column; gap: 8px; }
    .portal-sort-tabs { align-self: flex-start; }
    .portal-job-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .portal-company-grid { grid-template-columns: repeat(2, minmax(0, 1fr)); }
}

@media (max-width: 767px) {
    .portal-shell { width: min(100% - 28px, 1200px); }
    .portal-header { height: 60px; }
    .portal-header-inner { gap: 12px; }
    .portal-brand { font-size: 19px; }
    .portal-brand-mark { width: 34px; height: 34px; border-radius: 9px; font-size: 18px; }
    .portal-menu-toggle { display: inline-flex; margin-left: auto; }
    .portal-nav { position: absolute; top: 60px; right: 0; left: 0; height: auto; display: none; padding: 10px 14px 16px; background: #fff; border-bottom: 1px solid var(--cpp-line); box-shadow: 0 12px 20px rgba(29,77,142,.1); }
    .portal-nav.open { display: grid; }
    .portal-nav a { height: 42px; padding: 0 10px; border-radius: 7px; }
    .portal-nav a.active:after { display: none; }
    .portal-nav a.active { background: var(--cpp-blue-soft); }
    .portal-role-actions { gap: 10px; }
    .portal-role-link { display: none; }
    .portal-login-button { min-width: 88px; height: 34px; padding: 0 11px; font-size: 13px; }
    .portal-user-trigger { width: 38px; height: 38px; padding: 2px; }
    .portal-user-name,.portal-user-chevron { display: none; }
    .portal-user-dropdown { position: fixed; top: 62px; right: 14px; width: min(286px,calc(100vw - 28px)); }
    .portal-message-button { display: none; }
    .portal-chat { right: 8px; bottom: 8px; width: calc(100vw - 16px); height: calc(100vh - 76px); border-radius: 12px; }
    .portal-search-section { padding: 18px 0 12px; }
    .portal-search { height: 48px; grid-template-columns: 72px 1fr 76px; }
    .portal-search input { padding: 0 10px; }
    .portal-search button { font-size: 14px; }
    .portal-filter-bar { margin-top: 12px; }
    .portal-filter-toolbar { display: block; padding: 10px; }
    .portal-filter-groups { display: grid; grid-template-columns: 1fr 1fr; gap: 6px; }
    .portal-filter-popover summary { min-width: 0; width: 100%; background: #f8fafc; border-color: #e3eaf3; }
    .portal-filter-options,.portal-filter-options.city-options { width: min(330px,calc(100vw - 48px)); grid-template-columns: repeat(2,minmax(0,1fr)); }
    .portal-filter-popover:nth-child(even) .portal-filter-options { right: 0; left: auto; }
    .portal-sort-tabs { width: 100%; margin-top: 8px; }
    .portal-sort-tabs a { flex: 1; justify-content: center; padding: 0 5px; }
    .portal-selected-filters { padding: 9px 10px; }
    .portal-selected-filters .clear-all { margin-left: 0; }
    .portal-hot-searches { gap: 14px; }
    .portal-hero { display: flex; flex-direction: column; }
    .portal-category-panel { height: auto; min-height: 0; overflow: visible; }
    .portal-category-list { grid-template-columns: repeat(2, minmax(0, 1fr)); }
    .portal-category-list:not(.expanded) a:nth-child(n+9) { display: none; }
    .portal-category-toggle { width: 100%; height: 40px; display: block; margin-top: 10px; color: var(--cpp-blue); background: var(--cpp-blue-soft); border: 1px solid #d7e6fa; border-radius: 7px; cursor: pointer; font-weight: 700; }
    .portal-banner { height: auto; min-height: 0; aspect-ratio: 16 / 8; }
    .portal-banner-copy { right: 10px; bottom: 10px; left: 10px; padding: 10px 12px; }
    .portal-banner-copy strong { font-size: 15px; }
    .portal-banner-copy span { display: none; }
    .portal-section { padding-top: 36px; padding-bottom: 40px; }
    .portal-section-heading { align-items: center; }
    .portal-section-heading h2 { font-size: 23px; }
    .portal-section-heading p { display: none; }
    .portal-job-grid, .portal-company-grid { grid-template-columns: 1fr; }
    .portal-list-layout { display: block; padding-top: 16px; }
    .portal-filter-panel { position: static; display: flex; gap: 6px; margin-bottom: 16px; overflow-x: auto; white-space: nowrap; }
    .portal-filter-panel h2 { display: none; }
    .portal-filter-panel a { flex: 0 0 auto; }
    .portal-job-row { grid-template-columns: 1fr; padding: 18px; }
    .portal-job-row-company { display: grid; grid-template-columns: 1fr; padding: 14px 0 0; border-top: 1px solid #edf1f7; border-left: 0; }
    .portal-job-row-company > span { display: none; }
    .portal-job-row-actions { width: 100%; }
    .portal-job-row-actions .portal-job-action { flex: 1; }
    .portal-empty-state { min-height: 320px; padding: 42px 20px; }
    .portal-empty-actions { width: 100%; flex-direction: column; }
    .portal-empty-actions a { width: 100%; }
    .portal-job-hero, .portal-company-hero { padding: 28px 0; }
    .portal-job-hero-inner { grid-template-columns: 1fr; align-items: flex-start; gap: 24px; }
    .portal-job-hero .portal-job-title { display: grid; grid-template-columns: minmax(0, 1fr) auto; align-items: baseline; gap: 14px; }
    .portal-job-hero .portal-job-title h1 { max-width: none; }
    .portal-job-title h1 { font-size: 27px; }
    .portal-primary-cta { width: 100%; }
    .portal-job-cta-group { width: 100%; }
    .portal-secondary-cta { width: 100%; }
    .portal-detail-layout { grid-template-columns: 1fr; padding-top: 16px; }
    .portal-detail-content { padding: 22px 18px; }
    .portal-job-overview-compact { display: block; padding: 18px 16px !important; }
    .portal-job-overview-compact > h2 { margin-bottom: 14px; padding: 0; border-right: 0; }
    .portal-job-overview { grid-template-columns: repeat(2, minmax(0, 1fr)); overflow: hidden; background: #f8fbff; border: 1px solid #dce9f8; border-radius: 9px; }
    .portal-job-overview > div, .portal-job-overview > div:nth-child(3n) { padding: 12px 13px; border-right: 1px solid #e3edf8; border-bottom: 1px solid #e3edf8; }
    .portal-job-overview > div:nth-child(2n) { border-right: 0; }
    .portal-job-overview > div:nth-last-child(-n+2) { border-bottom: 0; }
    .portal-location-heading { flex-direction: column; gap: 8px; }
    .portal-job-map-wrap { height: 270px; }
    .portal-job-map { top: -278px; left: -316px; width: calc(100% + 316px); height: 690px; }
    .portal-job-map-wrap.is-exact .portal-job-map { top: -515px; height: 925px; }
    .portal-map-card { right: 12px; bottom: 12px; left: 12px; width: auto; padding: 14px 15px; }
    .portal-map-card strong { font-size: 16px; }
    .portal-safety { align-items: flex-start; flex-direction: column; }
    .portal-safety-actions { width: 100%; }
    .portal-safety-actions button, .portal-safety-actions a { flex: 1; text-align: center; }
    .portal-company-facts { grid-template-columns: 1fr; }
    .portal-company-facts > div { border-right: 0; border-bottom: 1px solid #dce9f8; }
    .portal-company-facts > div:last-child { border-bottom: 0; }
    .portal-company-environment { grid-template-columns: repeat(2,minmax(0,1fr)); }
    .portal-employer-hero { padding: 34px 0; }
    .portal-employer-hero-inner { grid-template-columns: 1fr; gap: 28px; }
    .portal-employer-copy h1 { font-size: 31px; }
    .portal-employer-actions { display: grid; grid-template-columns: 1fr; }
    .portal-employer-primary,.portal-employer-secondary { width: 100%; }
    .portal-employer-guide { padding: 22px 18px; }
    .portal-employer-details { grid-template-columns: 1fr; padding-top: 18px; padding-bottom: 42px; }
    .portal-employer-details > div { padding: 22px 18px; }
    .portal-employer-details ul { grid-template-columns: 1fr; }
    .portal-center-layout { display: block; padding-top: 16px; }
    .portal-center-nav { position: static; display: flex; margin-bottom: 16px; overflow-x: auto; }
    .portal-center-nav strong { display: none; }
    .portal-center-nav a { flex: 0 0 auto; gap: 8px; }
    .portal-center-card { padding: 20px 16px; }
    .portal-resume-summary { grid-template-columns: 1fr; gap: 24px; }
    .portal-center-list > a, .portal-center-row { align-items: flex-start; flex-direction: column; gap: 10px; }
    .portal-center-list b, .portal-center-row b { text-align: left; }
    .portal-resume-editor { padding: 16px 0 42px; }
    .portal-resume-editor-head { grid-template-columns: 1fr; gap: 20px; padding: 22px 18px; }
    .portal-resume-editor-layout { display: block; }
    .portal-resume-editor-nav { position: static; display: flex; margin-bottom: 14px; overflow-x: auto; white-space: nowrap; }
    .portal-resume-editor-nav strong { display: none; }
    .portal-resume-editor-nav a { flex: 0 0 auto; }
    .portal-resume-section { padding: 22px 17px; }
    .portal-resume-form-grid { grid-template-columns: 1fr; gap: 15px; }
    .portal-resume-form-grid label.wide { grid-column: auto; }
    .portal-resume-records > form { padding: 17px 14px; }
    .portal-resume-section form > footer { flex-wrap: wrap; }
    .portal-legal-page { padding: 16px 0 42px; }
    .portal-legal-content { padding: 24px 18px; }
    .portal-legal-content h1 { font-size: 25px; }
    .portal-help-page { padding: 16px 0 42px; }
    .portal-help-layout { grid-template-columns: 1fr; }
    .portal-help-menu { display: flex; overflow-x: auto; }
    .portal-help-menu h1 { flex: 0 0 auto; padding: 14px 18px; font-size: 18px; border: 0; }
    .portal-help-menu a { flex: 0 0 auto; padding: 15px 12px; border-left: 0; border-bottom: 3px solid transparent; white-space: nowrap; }
    .portal-help-menu a:hover, .portal-help-menu a.active { border-bottom-color: var(--cpp-blue); }
    .portal-help-content { min-height: 300px; padding: 24px 18px; }
    .portal-footer-grid { grid-template-columns: 1fr; gap: 24px; padding-top: 34px; }
}

@media (prefers-reduced-motion: reduce) {
    *, *:before, *:after { scroll-behavior: auto !important; transition-duration: .01ms !important; animation-duration: .01ms !important; }
}