/* Circle Metro adapter. Canonical generated tokens are loaded separately. */
:root {
 --tgn-font-primary: var(--cm-font-family); --tgn-primary: var(--cm-color-accent);
 --tgn-text-primary: var(--cm-color-text-primary); --tgn-text-secondary: var(--cm-color-text-secondary);
 --system-primary: var(--cm-color-text-primary); --system-secondary: var(--cm-color-text-secondary);
 --system-background: var(--cm-color-surface); --system-background-secondary: var(--cm-color-canvas);
 --system-quaternary: var(--cm-color-outline); --system-blue: var(--cm-color-accent-text);
 --system-red: var(--cm-color-critical); --system-green: var(--cm-color-positive);
}
html, body { margin:0; background:var(--cm-color-canvas); color:var(--cm-color-text-primary); font-family:var(--cm-font-family); }
*, *::before, *::after { box-sizing:border-box; }
/* Product rule: hide scrollbar chrome on every scrollable surface. Do not disable overflow or input scrolling. */
html, body, body * { scrollbar-width:none !important; -ms-overflow-style:none !important; }
html::-webkit-scrollbar, body::-webkit-scrollbar, body *::-webkit-scrollbar { display:none !important; width:0 !important; height:0 !important; }
html { scroll-padding-top:120px; scroll-padding-bottom:88px; }
.jc-metro :is(a,button,input,select,textarea,[tabindex]) { scroll-margin-block:120px 88px; }
.jc-metro { color:var(--cm-color-text-primary); font:16px/1.5 var(--cm-font-family); }
.jc-metro h1,.jc-metro h2,.jc-metro h3 { color:var(--cm-color-text-primary); font-family:inherit; letter-spacing:-.035em; line-height:1.12; }
.jc-metro h1 { font-size:clamp(32px,5vw,56px); font-weight:400; }
.jc-metro h2 { font-weight:500; }
.jc-metro a { color:var(--cm-color-accent-text); }
.jc-icon { width:22px; height:22px; display:inline-block; flex-shrink:0; vertical-align:middle; }
.jc-sr { position:absolute; width:1px; height:1px; padding:0; margin:-1px; overflow:hidden; clip:rect(0,0,0,0); white-space:nowrap; border:0; }
.jc-skip { position:fixed; top:-100px; left:16px; z-index:9999; padding:12px 20px; background:var(--cm-color-surface); color:var(--cm-color-accent-text); }
.jc-skip:focus { top:12px; }
.jc-metro :focus-visible,.jc-appearance :focus-visible { outline:3px solid var(--cm-color-accent-text); outline-offset:3px; }
.jc-metro .top-bar { background:var(--cm-color-surface); backdrop-filter:none; border-color:var(--cm-color-outline); }
.jc-metro .top-bar__content { max-width:1280px; gap:24px; padding:16px 28px; min-height:80px; }
.jc-metro .top-bar__logo { color:var(--cm-color-text-primary); gap:12px; }
.jc-metro .logo-icon { width:44px; height:44px; border-radius:var(--cm-radius-control); background:var(--cm-color-tile); color:var(--cm-color-on-tile); }
.jc-metro .logo-title { font-size:20px; font-weight:600; letter-spacing:-.06em; }
.jc-metro .top-bar__actions { display:flex; align-items:center; gap:12px; }
.jc-desktop-nav { display:flex; align-items:center; gap:24px; margin-left:auto; }
.jc-desktop-nav a { text-decoration:none; color:var(--cm-color-text-secondary); padding:12px 0; border-bottom:2px solid transparent; }
.jc-desktop-nav a.active { color:var(--cm-color-accent-text); border-color:var(--cm-color-accent); }
.jc-metro .btn-text { display:inline-flex; align-items:center; min-height:48px; background:none; border:0; color:var(--cm-color-accent-text); font:inherit; cursor:pointer; }
.jc-appearance { display:flex; gap:4px; align-items:center; }
.jc-appearance-button,.jc-appearance select { min-height:48px; background:var(--cm-color-surface); color:var(--cm-color-text-primary); border:1px solid var(--cm-color-outline); border-radius:var(--cm-radius-control); font:inherit; padding:8px; cursor:pointer; }
.jc-appearance-button { width:48px; }
.jc-metro .main-content { width:100%; max-width:1280px; margin:auto; padding:28px 28px 48px; flex:1; }
.jc-metro .bottom-nav { background:var(--cm-color-surface); border-color:var(--cm-color-outline); padding-bottom:env(safe-area-inset-bottom); }
.jc-metro .bottom-nav__item { min-height:64px; color:var(--cm-color-text-secondary); background:none; }
.jc-metro .bottom-nav__item--active { color:var(--cm-color-accent-text); background:var(--cm-color-accent-soft); }
.jc-metro .icon-button { display:inline-flex; align-items:center; justify-content:center; width:48px; min-height:48px; color:var(--cm-color-text-primary); }
.jc-metro .more-menu { background:var(--cm-color-surface); color:var(--cm-color-text-primary); border:1px solid var(--cm-color-outline); border-radius:var(--cm-radius-sheet); max-height:85dvh; overflow:auto; }
.jc-metro .more-menu__item { min-height:48px; }
.jc-eyebrow { font-size:12px; letter-spacing:.14em; color:var(--cm-color-accent-text); font-weight:600; margin:0 0 16px; }
.jc-metro .jobs-page { padding:0; }
.jc-metro .search-header { text-align:left; padding:0 0 36px; background:none; border-radius:0; border-bottom:1px solid var(--cm-color-outline); margin-bottom:32px; }
.jc-metro .search-header h1 { color:var(--cm-color-text-primary); margin:0 0 20px; }
.jc-metro .search-header h1 span { color:var(--cm-color-accent-text); }
.jc-metro .search-header>p:not(.jc-eyebrow) { color:var(--cm-color-text-secondary); max-width:540px; margin:0 0 28px; }
.jc-metro .search-bar { max-width:none; margin:0; gap:12px; }
.jc-metro .search-bar input { min-width:0; background:var(--cm-color-surface); border:1px solid var(--cm-color-outline-strong); color:var(--cm-color-text-primary); border-radius:var(--cm-radius-control); }
.jc-metro input::placeholder,.jc-metro textarea::placeholder { color:var(--cm-color-text-secondary); opacity:1; }
.jc-metro .search-btn { display:flex; align-items:center; justify-content:center; gap:24px; }
.jc-metro .jobs-layout { grid-template-columns:240px minmax(0,1fr); gap:36px; }
.jc-metro .filters-panel { background:var(--cm-color-surface); padding:20px; border:1px solid var(--cm-color-outline); border-radius:var(--cm-radius-card); top:100px; }
.jc-metro .filter-heading { font-size:20px; margin:0 0 20px; }
.jc-metro .filter-toggle { display:none; }
.jc-metro .filter-body { display:block; }
.jc-metro .filter-checkbox { min-height:48px; padding:10px 0; color:var(--cm-color-text-primary); }
.jc-metro input[type=checkbox],.jc-metro input[type=radio] { accent-color:var(--cm-color-accent); width:20px; height:20px; flex-shrink:0; }
.jc-metro .salary-inputs input { min-width:0; width:100%; border-color:var(--cm-color-outline); background:var(--cm-color-canvas); }
.jc-metro .results-header { display:flex; align-items:center; justify-content:space-between; flex-wrap:wrap; gap:12px; margin-bottom:20px; }
.jc-metro .results-header p { color:var(--cm-color-text-primary); }
.jc-metro .results-header label { font-size:12px; color:var(--cm-color-text-secondary); display:flex; align-items:center; gap:8px; }
.jc-metro .results-header select { background:var(--cm-color-surface); color:var(--cm-color-text-primary); border:1px solid var(--cm-color-outline); border-radius:var(--cm-radius-control); padding:8px; }
.jc-metro .job-card { padding:24px; background:var(--cm-color-surface); border:1px solid var(--cm-color-outline); border-radius:var(--cm-radius-card); cursor:default; margin-bottom:16px; transition:border-color var(--cm-motion-fast); }
.jc-metro .job-card:hover { transform:none; background:var(--cm-color-surface); border-color:var(--cm-color-accent); }
.jc-metro .job-card.featured { background:var(--cm-color-surface); border-color:var(--cm-color-accent); }
.jc-metro .job-card h2 { font-size:24px; margin:0 0 6px; }
.jc-metro .job-card h2 a { color:var(--cm-color-text-primary); text-decoration:none; }
.jc-metro .job-card h2 a:hover { text-decoration:underline; text-underline-offset:4px; }
.jc-metro .save-btn { min-width:48px; min-height:48px; display:inline-flex; align-items:center; justify-content:center; color:var(--cm-color-accent-text); }
.jc-metro .save-btn.saved { background:var(--cm-color-accent-soft); color:var(--cm-color-accent-text); border-color:var(--cm-color-accent); }
.jc-metro .job-meta { display:flex; flex-wrap:wrap; gap:16px; }
.jc-metro .job-meta span,.jc-metro .salary { display:inline-flex; align-items:center; gap:6px; }
.jc-metro .company-name,.jc-metro .job-card .description { color:var(--cm-color-text-secondary); }
.jc-metro .job-detail-page,.jc-metro .apply-page { padding:0; }
.jc-metro .job-detail-page .job-header { padding:28px; background:var(--cm-color-surface); border:1px solid var(--cm-color-outline); border-radius:var(--cm-radius-card); }
.jc-metro .content-section,.jc-metro .apply-card,.jc-metro .info-card,.jc-metro .report-card { background:var(--cm-color-surface); border:1px solid var(--cm-color-outline); border-radius:var(--cm-radius-card); }
.jc-metro .salary-amount { color:var(--cm-color-text-primary); font-weight:500; letter-spacing:-.04em; }
.jc-metro .description { opacity:1; }
.jc-metro .apply-page textarea { background:var(--cm-color-canvas); color:var(--cm-color-text-primary); border-color:var(--cm-color-outline-strong); border-radius:var(--cm-radius-control); }
.jc-metro .resume-option { background:var(--cm-color-surface); border-color:var(--cm-color-outline); }
.jc-metro .resume-option.selected { background:var(--cm-color-accent-soft); border-color:var(--cm-color-accent); }
.jc-home-hero { padding:12px 0 32px; display:grid; grid-template-columns:1.3fr 1fr; gap:48px; align-items:center; }
.jc-home-hero h1 { font-size:clamp(40px,4.5vw,60px); margin:0 0 16px; line-height:1; letter-spacing:-.06em; }
.jc-home-hero h1 span { color:var(--cm-color-accent-text); }
.jc-home-hero p:not(.jc-eyebrow) { color:var(--cm-color-text-secondary); max-width:440px; margin:0; }
.jc-home-search { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; margin-top:20px; }
.jc-home-search .jc-button { grid-column:1 / -1; }
.jc-home-search label { display:flex; flex-direction:column; gap:6px; font-size:14px; }
.jc-home-search input { width:100%; min-width:0; min-height:52px; background:var(--cm-color-surface); border:1px solid var(--cm-color-outline-strong); border-radius:var(--cm-radius-control); color:var(--cm-color-text-primary); padding:12px 16px; font:inherit; }
.jc-button { display:inline-flex; align-items:center; justify-content:space-between; gap:24px; padding:14px 20px; min-height:52px; background:var(--cm-color-accent); border:0; border-radius:var(--cm-radius-control); color:var(--cm-color-on-accent)!important; text-decoration:none; font:inherit; cursor:pointer; }
.jc-home-mosaic { display:grid; grid-template-columns:repeat(2,minmax(0,1fr)); gap:12px; }
.jc-home-tile { min-height:136px; border-radius:var(--cm-radius-tile); padding:24px; background:var(--cm-color-tile); color:var(--cm-color-on-tile)!important; text-decoration:none; display:flex; flex-direction:column; align-items:flex-start; justify-content:space-between; }
.jc-home-tile strong { font-size:24px; font-weight:500; line-height:1.15; letter-spacing:-.03em; }
.jc-home-tile small { color:inherit; font-size:14px; margin-top:8px; }
.jc-home-tile:first-child { grid-column:span 2; min-height:184px; }
.jc-home-tile:first-child strong { font-size:36px; }
.jc-home-section { padding:36px 0; border-top:1px solid var(--cm-color-outline); }
.jc-section-heading { display:flex; align-items:center; justify-content:space-between; gap:16px; margin-bottom:24px; }
.jc-section-heading h2 { font-size:32px; margin:0; }
.jc-category-grid { display:grid; grid-template-columns:repeat(4,minmax(0,1fr)); gap:12px; }
.jc-category-grid a { padding:20px; border:1px solid var(--cm-color-outline); border-radius:var(--cm-radius-tile); background:var(--cm-color-surface); text-decoration:none; color:var(--cm-color-text-primary); display:flex; align-items:center; justify-content:space-between; min-height:80px; }
.jc-category-grid a:hover { border-color:var(--cm-color-accent); }
.jc-featured-grid { display:grid; grid-template-columns:repeat(3,minmax(0,1fr)); gap:16px; }
.jc-featured-card { padding:24px; border:1px solid var(--cm-color-outline); border-radius:var(--cm-radius-card); background:var(--cm-color-surface); }
.jc-featured-card h3 { font-size:24px; margin:16px 0; }
.jc-featured-card h3 a { text-decoration:none; color:var(--cm-color-text-primary); }
.jc-featured-card p { color:var(--cm-color-text-secondary); }
.jc-home-empty { padding:24px; background:var(--cm-color-surface); border-radius:var(--cm-radius-card); }
@media(max-width:1050px) { .jc-desktop-nav { gap:14px; } .jc-metro .logo-title { font-size:17px; } .jc-appearance select { max-width:90px; } }
@media(max-width:900px) { .jc-desktop-nav { display:none; } .jc-home-hero { gap:24px; } .jc-category-grid { grid-template-columns:repeat(3,minmax(0,1fr)); } .jc-featured-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } }
@media(max-width:767px) {
 .jc-metro .top-bar__content { min-height:64px; padding:8px 16px; gap:8px; } .jc-metro .logo-text { display:block; } .jc-metro .logo-title { font-size:17px; } .jc-metro .logo-icon { display:none; }
 .jc-metro .top-bar__actions { gap:8px; } .jc-appearance select { max-width:80px; font-size:14px; }
 .jc-metro .main-content { padding:16px 16px 36px; }
 .jc-metro .jobs-layout { grid-template-columns:minmax(0,1fr); gap:20px; } .jc-metro .filters-panel { position:static; }
 .jc-metro .search-bar { flex-direction:column; } .jc-metro .job-card { padding:20px; } .jc-metro .job-card h2 { font-size:22px; }
 .jc-home-hero { grid-template-columns:1fr; padding:0 0 24px; }
 .jc-home-search { grid-template-columns:minmax(0,1fr); margin-top:16px; gap:8px; }
 .jc-home-search label { gap:4px; }
 .jc-home-search input { min-height:48px; padding:10px 14px; }
 .jc-home-search .jc-button { min-height:48px; padding:12px 16px; }
 .jc-metro .jc-home-hero h1 { font-size:40px; }
 .jc-home-hero .jc-eyebrow { margin-bottom:12px; font-size:11px; }
 .jc-metro .search-header h1 { font-size:32px; margin-bottom:12px; }
 .jc-metro .search-header>p:not(.jc-eyebrow) { margin-bottom:16px; }
 .jc-metro .search-header { padding-bottom:24px; margin-bottom:20px; }
 .jc-metro .filters-panel { padding:12px 16px; }
 .jc-metro .filter-heading { display:none; }
 .jc-metro .filter-toggle { display:flex; align-items:center; gap:12px; width:100%; min-height:48px; padding:0; border:0; background:none; color:var(--cm-color-text-primary); font:inherit; font-weight:600; cursor:pointer; }
 .jc-metro .filter-toggle span { margin-left:auto; }
 .jc-metro .filter-body { display:none; }
 .jc-metro .filters-panel.is-expanded .filter-body { display:block; padding-top:20px; } .jc-home-tile { min-height:144px; padding:20px; } .jc-home-tile:first-child { min-height:170px; }
 .jc-category-grid { grid-template-columns:repeat(2,minmax(0,1fr)); } .jc-category-grid a { padding:16px; } .jc-featured-grid { grid-template-columns:1fr; }
 .jc-section-heading h2 { font-size:28px; }
}
@media(prefers-reduced-motion:reduce) { .jc-metro *, .jc-metro *::before,.jc-metro *::after { animation:none!important; transition:none!important; scroll-behavior:auto!important; } }
@media(forced-colors:active) { .jc-home-tile,.jc-button { border:1px solid ButtonText; } }

.jc-metro .featured-badge { position:static; display:inline-flex; margin-bottom:16px; background:var(--cm-color-accent-soft); color:var(--cm-color-accent-text); border-radius:var(--cm-radius-small); padding:4px 10px; }
.jc-metro .job-title-info { min-width:0; }.jc-metro .job-card h2 { overflow-wrap:anywhere; }.jc-metro .company-logo { flex-shrink:0; }
.jc-metro .job-content { grid-template-columns:minmax(0,1fr) 320px; }
.jc-metro .job-description-content { min-width:0; }
.jc-metro .info-label,.jc-metro .apply-hint,.jc-metro .salary-period,.jc-metro .similar-location { color:var(--cm-color-text-secondary); opacity:1; }
.jc-metro .badge.remote,.jc-metro .badge.featured { background:var(--cm-color-accent-soft); color:var(--cm-color-accent-text); }
.jc-metro .success-icon { background:var(--cm-color-positive); color:var(--cm-color-surface); }
.jc-metro .job-detail-page .header-info h1 { font-size:clamp(28px,4vw,40px); }
@media(max-width:900px) { .jc-metro .job-content { grid-template-columns:minmax(0,1fr); } }

.jc-metro h1:focus { outline:none; }

.jc-footer { display:flex; flex-wrap:wrap; gap:16px; justify-content:space-between; max-width:1280px; width:100%; margin:auto; padding:24px 28px 100px; border-top:1px solid var(--cm-color-outline); color:var(--cm-color-text-secondary); font-size:14px; }
.jc-footer a { min-height:48px; display:inline-flex; align-items:center; gap:8px; }
.jc-footer a .jc-icon { width:20px; height:20px; flex:none; }
.jc-shell-error { padding:32px; text-align:center; }
.jc-metro .aether-status-bar { background:var(--cm-color-surface); color:var(--cm-color-text-secondary); border-color:var(--cm-color-outline); }
@media(max-width:767px) { .jc-footer { padding:20px 16px 100px; } }

@media(max-width:360px) { .jc-metro .main-content { padding-top:8px; } .jc-metro .jc-home-hero h1 { font-size:32px; } .jc-appearance select { max-width:72px; } .jc-metro .logo-title { font-size:15px; } }
@media(max-height:700px) and (min-width:768px) { .jc-home-hero { padding-top:0; } .jc-metro .main-content { padding-top:20px; } }
/* Sana's amber surfaces need ink foregrounds; keep the canonical generated palette untouched. */
:root[data-theme][data-skin="sana"] { --cm-color-on-tile:var(--cm-brand-ink); }
:root[data-theme="light"][data-skin="sana"] { --cm-color-on-accent:var(--cm-brand-ink); }
